From 003a8f7289388e2c7697a6329991b405598183f9 Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期五, 10 五月 2024 16:35:55 +0800 Subject: [PATCH] 完成日工时管理,辅助工时配置页面 --- src/components/view/b3-work-time-management.vue | 38 + src/components/do/b3-work-time-management/work-time-management.vue | 538 +++++++++++++++++++++++++ src/components/do/b3-work-time-management/work-time-config.vue | 206 +++++++++ src/components/do/b3-work-time-management/work-time-statistics.vue | 19 static/js/menu.js | 2 src/components/view/b3-classes.vue | 426 +++++++++++--------- src/assets/api/controller.js | 10 7 files changed, 1,047 insertions(+), 192 deletions(-) diff --git a/src/assets/api/controller.js b/src/assets/api/controller.js index 2e611f1..6c48d54 100644 --- a/src/assets/api/controller.js +++ b/src/assets/api/controller.js @@ -23,6 +23,7 @@ sealScope, informationNotification, performanceShift, + auxiliaryWorkingHours, } } @@ -260,6 +261,13 @@ const performanceShift = { add:"/performanceShift/add",//缁╂晥绠$悊-鐝-鎺掔彮 page:"/performanceShift/page",//缁╂晥绠$悊-鐝-鍒嗛〉鏌ヨ - update:"/performanceShift/update/",//缁╂晥绠$悊-鐝-鐝鐘舵�佷慨鏀� + update:"/performanceShift/update",//缁╂晥绠$悊-鐝-鐝鐘舵�佷慨鏀� +} + +const auxiliaryWorkingHours = { + selectAuxiliaryWorkingHours:"/auxiliaryWorkingHours/selectAuxiliaryWorkingHours",//鏌ヨ杈呭姪宸ユ椂 + deleteAuxiliaryWorkingHours:"/auxiliaryWorkingHours/deleteAuxiliaryWorkingHours",//鍒犻櫎杈呭姪宸ユ椂 + upAuxiliaryWorkingHours:"/auxiliaryWorkingHours/upAuxiliaryWorkingHours",//淇敼杈呭姪宸ユ椂 + insertAuxiliaryWorkingHours:"/auxiliaryWorkingHours/insertAuxiliaryWorkingHours",//鏂板杈呭姪宸ユ椂 } diff --git a/src/components/do/b3-work-time-management/work-time-config.vue b/src/components/do/b3-work-time-management/work-time-config.vue new file mode 100644 index 0000000..cb3ae89 --- /dev/null +++ b/src/components/do/b3-work-time-management/work-time-config.vue @@ -0,0 +1,206 @@ +<template> + <div class="work-time-config"> + <div class="search"> + <div class="search_thing"> + <div class="search_label">缂栧彿锛�</div> + <div class="search_input"><el-input size="small" placeholder="璇疯緭鍏�" clearable + v-model="componentData.entity.number" @keyup.enter.native="refreshTable()"></el-input></div> + </div> + <div class="search_thing"> + <div class="search_label">瀹為獙瀹わ細</div> + <el-select v-model="componentData.entity.laboratory" placeholder="鍏ㄩ儴" size="small"> + <el-option v-for="item in laboratoryList" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + </div> + <div class="search_thing"> + <div class="search_label">閮ㄩ棬锛�</div> + <div class="search_input"> + <el-select v-model="componentData.entity.department" placeholder="鍏ㄩ儴" size="small"> + <el-option v-for="item in partList" :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="small" @click="refresh()">閲� 缃�</el-button> + <el-button size="small" type="primary" @click="refreshTable()">鏌� 璇�</el-button> + </div> + <el-button size="small" type="primary" style="position: absolute;right: 50px;" @click="openAdd">鏂� 澧�</el-button> + </div> + <div class="table"> + <ValueTable ref="ValueTable0" + :url="$api.auxiliaryWorkingHours.selectAuxiliaryWorkingHours" :upUrl="$api.auxiliaryWorkingHours.upAuxiliaryWorkingHours" + :delUrl="$api.auxiliaryWorkingHours.deleteAuxiliaryWorkingHours" :componentData="componentData" :key="upIndex" /> + </div> + </div> +</template> + +<script> +import { number } from 'echarts' +import ValueTable from '../../tool/value-table.vue' +export default { + components: { + ValueTable + }, + data () { + return{ + componentData: { + entity: { + number: null, + department: null, + laboratory: null, + orderBy: { + field: 'id', + order: 'desc' + } + }, + isIndex: true, + showSelect: false, + select: true, + do: [{ + id: 'delete', + font: '鍒犻櫎', + type: 'text', + method: 'doDiy' + }, { + id: 'update', + font: '缂栬緫', + type: 'text', + method: 'doDiy' + }], + tagField: { + laboratory: { + select: [] + }, + label: { + select: [] + }, + // department: { + // select: [] + // }, + }, + linkEvent: { + }, + selectField: { + laboratory: { + select: [] + }, + label: { + select: [] + }, + // department: { + // select: [] + // }, + }, + requiredAdd: ['number','auxiliaryProject','laboratory','label','approvedWorkingHour','department'], + requiredUp: ['number','auxiliaryProject','laboratory','label','approvedWorkingHour','department'] + }, + entityCopy: {}, + upIndex: 0, + laboratoryList:[], + partList:[], + addPower:true + } + }, + mounted() { + this.entityCopy = this.HaveJson(this.componentData.entity) + this.getPower() + this.obtainItemParameterList() + this.selectEnumByCategoryForUnit() + }, + methods: { + refresh(){ + this.componentData.entity = this.HaveJson(this.entityCopy) + this.upIndex++ + }, + refreshTable(){ + this.$refs['ValueTable0'].selectList() + }, + getPower(radio) { + let power = JSON.parse(sessionStorage.getItem('power')) + let up = false + let del = false + let add = false + for (var i = 0; i < power.length; i++) { + if (power[i].menuMethod == 'upDeviceParameter') { + up = true + } + if (power[i].menuMethod == 'delDeviceParameter') { + del = true + } + if (power[i].menuMethod == 'addDeviceParameter') { + add = true + } + } + if (!up) { + this.componentData.do.splice(1, 1) + } + if (!del) { + this.componentData.do.splice(0, 1) + } + this.addPower = add + }, + openAdd() { + this.$refs.ValueTable0.openAddDia(this.$api.auxiliaryWorkingHours.insertAuxiliaryWorkingHours); + }, + obtainItemParameterList() { + this.$axios.get(this.$api.laboratoryScope.obtainItemParameterList).then(res => { + let data = [] + res.data.forEach(a => { + data.push({ + label: a.laboratoryName, + value: a.id + }) + }) + this.laboratoryList = data + this.componentData.selectField.laboratory.select = data + this.componentData.tagField.laboratory.select = data + }) + }, + selectEnumByCategoryForUnit() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "鍗曚綅" + }).then(res => { + this.componentData.selectField.label.select = res.data + this.componentData.tagField.label.select = res.data + }) + }, + } +} +</script> + +<style scoped> +.work-time-config{ + height: 100%; +} +.search { + background-color: #fff; + height: 80px; + display: flex; + align-items: center; + } + + .search_thing { + width: 250px; + display: flex; + align-items: center; + } + + .search_label { + width: 70px; + font-size: 14px; + text-align: right; + } + + .search_input { + width: calc(100% - 70px); + } + .table { + margin-top: 10px; + background-color: #fff; + width: calc(100% - 40px); + height: calc(100% - 60px - 80px - 10px - 40px); + padding: 20px; + } +</style> diff --git a/src/components/do/b3-work-time-management/work-time-management.vue b/src/components/do/b3-work-time-management/work-time-management.vue new file mode 100644 index 0000000..0024274 --- /dev/null +++ b/src/components/do/b3-work-time-management/work-time-management.vue @@ -0,0 +1,538 @@ +<template> + <div class="work-time-management"> + <div class="search"> + <div class="search_thing"> + <div class="search_label">鍛ㄦ锛�</div> + <div class="search_input" style="display: flex;align-items: center;"> + <el-input size="small" placeholder="寮�濮嬪懆娆�" clearable + v-model="componentData.entity.number"></el-input> + <span> - </span> + <el-input size="small" placeholder="缁撴潫鍛ㄦ" clearable + v-model="componentData.entity.number"></el-input> + </div> + </div> + <div class="search_thing" style="width: 200px;"> + <div class="search_label">鏄熸湡锛�</div> + <el-select v-model="componentData.entity.laboratory" placeholder="鍏ㄩ儴" size="small"> + <el-option v-for="item in weekList" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + </div> + <div class="search_thing"> + <div class="search_label">鏃堕棿鑼冨洿锛�</div> + <div class="search_input"> + <el-date-picker + style="width: 100%;" + v-model="componentData.entity.number" + size="small" + type="daterange" + range-separator="鑷�" + start-placeholder="寮�濮嬫棩鏈�" + end-placeholder="缁撴潫鏃ユ湡"> + </el-date-picker> + </div> + </div> + <!-- 浠ヤ笅杩欎袱涓负缁勯暱瑙掕壊鐗规湁鐨� --> + <div class="search_thing" style="width: 200px;"> + <div class="search_label" >鍚嶅瓧锛�</div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable + v-model="componentData.entity.number"></el-input> + </div> + <div class="search_thing" style="width: 200px;"> + <div class="search_label">鐘舵�侊細</div> + <el-select v-model="componentData.entity.laboratory" placeholder="鍏ㄩ儴" size="small"> + <el-option v-for="item in stateList" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + </div> + <div class="search_thing" style="padding-left: 30px;width: 100px;"> + <el-button size="small" @click="refresh()">閲� 缃�</el-button> + <el-button size="small" type="primary" @click="refreshTable()">鏌� 璇�</el-button> + </div> + </div> + <div style="display: flex;align-items: center;justify-content: space-between;margin-top: 10px;"> + <el-radio-group v-model="currentTable" size="small" :key="'111'"> + <el-radio-button label="ValueTable0"> + 杈呭姪宸ユ椂 + </el-radio-button> + <el-radio-button label="ValueTable1"> + 浜ч噺宸ユ椂 + </el-radio-button> + </el-radio-group> + <div style="display: flex;align-items: center;"> + <p style="font-size: 14px;margin-right: 30px;"> + 浜ч噺宸ユ椂姹囨�伙細<span style="font-size: 16px;color: #3A7BFA;">11.333</span> 杈呭姪宸ユ椂姹囨�伙細<span style="font-size: 16px;color: #3A7BFA;">12.333</span> + </p> + <el-button size="small" type="primary" style="margin-right: 16px;" @click="openAdd">褰曞叆鏁版嵁</el-button> + <el-button size="small" type="primary">瀵� 鍑�</el-button> + </div> + </div> + <div class="table"> + <ValueTable ref="ValueTable0" + v-show="currentTable == 'ValueTable0'" + :url="$api.auxiliaryWorkingHours.selectAuxiliaryWorkingHours" :upUrl="$api.auxiliaryWorkingHours.upAuxiliaryWorkingHours" + :delUrl="$api.auxiliaryWorkingHours.deleteAuxiliaryWorkingHours" :componentData="componentData" :key="upIndex" /> + <ValueTable ref="ValueTable1" + v-show="currentTable == 'ValueTable1'" + :url="$api.auxiliaryWorkingHours.selectAuxiliaryWorkingHours" :upUrl="$api.auxiliaryWorkingHours.upAuxiliaryWorkingHours" + :delUrl="$api.auxiliaryWorkingHours.deleteAuxiliaryWorkingHours" :componentData="componentData1" :key="upIndex1" /> + </div> + <el-dialog :title="formData.id?'缂栬緫':'褰曞叆鏁版嵁'" :visible.sync="addVisible" width="600px" :before-close="handleClose"> + <el-row style="display:flex;justify-content: space-around;"> + <el-col :span="12"> + <el-form :model="formData" label-width="90px"> + <el-form-item label="褰曞叆鏃堕棿:"> + <el-radio-group v-model="formData.value0" size="small"> + <el-radio :label="0">浠婂ぉ</el-radio> + <el-radio :label="1">鏄庡ぉ</el-radio> + </el-radio-group> + </el-form-item> + <el-form-item label="骞翠唤:"> + <el-input v-model="formData.year" disabled size="small"></el-input> + </el-form-item> + <el-form-item label="鍛ㄦ:"> + <el-input v-model="formData.value2" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="鏄熸湡:"> + <el-input v-model="formData.value3" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="鐝:"> + <el-input v-model="formData.value4" size="small" disabled></el-input> + </el-form-item> + </el-form> + </el-col> + <el-col :span="12"> + <el-form :model="formData" label-width="90px"> + <el-form-item label="缂栧彿:"> + <el-input v-model="formData.value5" size="small"></el-input> + </el-form-item> + <el-form-item label="鏁伴噺:"> + <el-input v-model="formData.value6" size="small" ></el-input> + </el-form-item> + <el-form-item label="鏍稿噯宸ユ椂:"> + <el-input v-model="formData.value7" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="杈呭姪宸ユ椂:"> + <el-input v-model="formData.value8" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="杈呭姪椤圭洰:"> + <el-input v-model="formData.value9" size="small" disabled></el-input> + </el-form-item> + </el-form> + </el-col> + </el-row> + <el-form :model="formData" label-width="90px"> + <el-form-item label="杈呭姪璇存槑:"> + <el-input v-model="formData.value10" type="textarea" + :rows="3" size="small"></el-input> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-row> + <el-button @click="handleClose">鍙� 娑�</el-button> + <el-button type="primary" @click="submitAdd" :loading="addLoad">纭� 瀹�</el-button> + </el-row> + </span> + </el-dialog> + <el-dialog :title="title" :visible.sync="checkVisible" width="600px"> + <el-row style="display:flex;justify-content: space-around;"> + <el-col :span="12"> + <el-form :model="formData0" label-width="90px"> + <el-form-item label="骞翠唤:"> + <el-input v-model="formData0.year" size="small"></el-input> + </el-form-item> + <el-form-item label="鍛ㄦ:"> + <el-input v-model="formData0.value2" size="small"></el-input> + </el-form-item> + <el-form-item label="鏄熸湡:"> + <el-input v-model="formData0.value3" size="small"></el-input> + </el-form-item> + <el-form-item label="濮撳悕:"> + <el-input v-model="formData0.value4" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="鐝:"> + <el-select v-model="formData0.value4" placeholder="璇烽�夋嫨" size="small"> + <el-option v-for="item in classType" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + </el-form-item> + </el-form> + </el-col> + <el-col :span="12"> + <el-form :model="formData0" label-width="90px"> + <el-form-item label="缂栧彿:"> + <el-input v-model="formData0.value5" size="small"></el-input> + </el-form-item> + <el-form-item label="鏁伴噺:"> + <el-input v-model="formData0.value6" size="small" ></el-input> + </el-form-item> + <el-form-item label="鏍稿噯宸ユ椂:"> + <el-input v-model="formData0.value7" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="杈呭姪宸ユ椂:"> + <el-input v-model="formData0.value8" size="small" disabled></el-input> + </el-form-item> + <el-form-item label="杈呭姪椤圭洰:"> + <el-input v-model="formData0.value9" size="small" disabled></el-input> + </el-form-item> + </el-form> + </el-col> + </el-row> + <el-form :model="formData0" label-width="90px"> + <el-form-item label="澶嶆牳璇存槑:"> + <el-input v-model="formData0.value10" type="textarea" + :rows="3" size="small"></el-input> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-row> + <el-button @click="submitCheck(0)" :loading="checkLoadN">{{title=='瀹℃牳'?'涓嶉�氳繃':'涓嶆壒鍑�'}}</el-button> + <el-button type="primary" @click="submitCheck(1)" :loading="checkLoadY">{{title=='瀹℃牳'?'閫� 杩�':'鎵� 鍑�'}}</el-button> + </el-row> + </span> + </el-dialog> + </div> +</template> + +<script> +import ValueTable from '../../tool/value-table.vue' +export default { + components: { + ValueTable + }, + data () { + return{ + componentData: { + entity: { + number: null, + department: null, + laboratory: null, + orderBy: { + field: 'id', + order: 'desc' + } + }, + isIndex: true, + showSelect: false, + select: false, + do: [{ + id: 'delete', + font: '鍒犻櫎', + type: 'text', + method: 'doDiy' + }, { + id: 'handleEdit', + font: '缂栬緫', + type: 'text', + method: 'handleEdit' + },{ + id: 'handleCheck', + font: '瀹℃牳', + type: 'text', + method: 'handleCheck' + }, { + id: 'handleRatify', + font: '鎵瑰噯', + type: 'text', + method: 'handleRatify' + }], + tagField: { + deviceStatus: { + select: [] + }, + equipmentManager: { + select: [] + }, + authorizedPerson: { + select: [] + }, + insProductIds:{ + select:[] + } + }, + linkEvent: { + deviceName: { + method: 'selectAllByOne' + } + }, + selectField: { + authorizedPerson: { + select: [], + choose: true + }, + equipmentManager: { + select: [] + }, + insProductIds:{ + select:[], + choose: true + } + }, + requiredAdd: [], + requiredUp: [] + }, + entityCopy: {}, + upIndex: 0, + componentData1: { + entity: { + number: null, + department: null, + laboratory: null, + orderBy: { + field: 'id', + order: 'desc' + } + }, + isIndex: true, + showSelect: false, + select: false, + do: [], + tagField: { + deviceStatus: { + select: [] + }, + equipmentManager: { + select: [] + }, + authorizedPerson: { + select: [] + }, + insProductIds:{ + select:[] + } + }, + linkEvent: { + deviceName: { + method: 'selectAllByOne' + } + }, + selectField: { + authorizedPerson: { + select: [], + choose: true + }, + equipmentManager: { + select: [] + }, + insProductIds:{ + select:[], + choose: true + } + }, + requiredAdd: [], + requiredUp: [] + }, + upIndex1:0, + weekList:[ + {label: '鏄熸湡涓�', value: 1}, + {label: '鏄熸湡浜�', value: 2}, + {label: '鏄熸湡涓�', value: 3}, + {label: '鏄熸湡鍥�', value: 4}, + {label: '鏄熸湡浜�', value: 5}, + {label: '鏄熸湡鍏�', value: 6}, + {label: '鏄熸湡鏃�', value: 7} + ], + currentTable:'ValueTable0', + addVisible:false, + addLoad:false, + formData:{ + value0:0, + year:new Date().getFullYear(), + value2:this.getCurrentWeekNumber(), + value3:this.getWeek(), + value4:'', + value5:'', + value6:'', + value7:'', + value8:'', + value9:'', + value10:'', + }, + formData0:{ + value0:0, + year:new Date().getFullYear(), + value2:this.getCurrentWeekNumber(), + value3:this.getWeek(), + value4:'', + value5:'', + value6:'', + value7:'', + value8:'', + value9:'', + value10:'', + }, + checkVisible:false, + checkLoadN:false, + checkLoadY:false, + title:'瀹℃牳', + classType:[], + stateList:[ + { + value:0, + label:'宸叉彁浜�' + }, + { + value:1, + label:'宸插鏍�' + }, + { + value:2, + label:'宸叉壒鍑�' + }, + ] + } + }, + watch:{ + 'formData.value0'(val){ + if(val==0){ + this.formData.year = new Date().getFullYear(); + this.formData.value2 = this.getCurrentWeekNumber() + this.formData.value3 = this.getWeek() + }else{ + var today = new Date(); // 鑾峰彇褰撳墠鏃ユ湡 + var yesterday = new Date(today); // 澶嶅埗褰撳墠鏃ユ湡 + yesterday.setDate(today.getDate() - 1); // 璁剧疆涓哄墠涓�澶� + var timestamp = new Date(yesterday.getTime()); + this.formData.year = timestamp.getFullYear(); + this.formData.value2 = this.getCurrentWeekNumber(timestamp) + this.formData.value3 = this.getWeek(timestamp) + } + } + }, + mounted(){ + this.getCurrentWeekNumber() + this.selectEnumByCategory() + }, + methods:{ + refreshTable(){}, + refresh(){}, + openAdd(){ + this.formData = { + value0:0, + year:new Date().getFullYear(), + value2:this.getCurrentWeekNumber(), + value3:this.getWeek(), + value4:'', + value5:'', + value6:'', + value7:'', + value8:'', + value9:'', + value10:'', + } + this.addVisible = true + }, + handleEdit(row){ + this.formData = row; + this.addVisible = true + }, + handleClose(){ + this.addVisible = false + }, + submitAdd(){ + if(!this.formData.value5){ + this.$message.error('璇疯緭鍏ョ紪鍙�') + return + } + if(!this.formData.value6){ + this.$message.error('璇疯緭鍏ユ暟閲�') + return + } + this.addLoad = true + }, + handleCheck(row){ + this.title = '瀹℃牳' + this.formData0 = row; + this.checkVisible = true + }, + handleRatify(row){ + this.title = '鎵瑰噯' + this.formData0 = row; + this.checkVisible = true + }, + submitCheck(e){ + if(!this.formData0.value5){ + this.$message.error('璇疯緭鍏ョ紪鍙�') + return + } + if(!this.formData0.value6){ + this.$message.error('璇疯緭鍏ユ暟閲�') + return + } + this.checkLoadY = true + }, + selectEnumByCategory() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "鐝绫诲瀷" + }).then(res => { + this.classType = res.data + }) + }, + getCurrentWeekNumber(now=new Date()) { + const startOfWeek = new Date(now.getFullYear(), now.getMonth(), now.getDate() - now.getDay()); // 鍛ㄥぉ + const firstWeekOfYear = new Date(startOfWeek.getFullYear(), 0, 0); // 褰撳勾鐨勭涓�涓懆澶� + const firstWeekOfNextYear = new Date(firstWeekOfYear.getFullYear() + 1, 0, 0); // 涓嬩竴骞寸殑绗竴涓懆澶� + const daysSinceNewYear = (startOfWeek - firstWeekOfYear) / (24 * 60 * 60 * 1000); // 璁$畻鑷柊骞翠互鏉ョ殑澶╂暟 + const weeksSinceNewYear = Math.floor(daysSinceNewYear / 7); // 澶╂暟闄や互7寰楀埌鍛ㄦ暟 + + if (startOfWeek > now) { + // 濡傛灉褰撳墠鍛ㄧ殑鍛ㄥぉ杩樻病鍒帮紝鍒欒繑鍥炰笂骞寸殑鏈�鍚庝竴鍛� + return weeksSinceNewYear; + } else if (firstWeekOfNextYear <= now) { + // 濡傛灉褰撳墠鍛ㄧ殑鍛ㄥぉ宸茬粡杩囦簡锛屽垯杩斿洖褰撳勾鐨勫懆鏁� + return weeksSinceNewYear +1; + } else { + // 鍚﹀垯杩斿洖褰撳勾鐨勬渶鍚庝竴鍛� + return weeksSinceNewYear + 2; + } + }, + getWeek(e=new Date()){ + // let str = '鏃ヤ竴浜屼笁鍥涗簲鍏�' + let d = e.getDay() + // let c = str.charAt(d) + // return `鍛�${c}` + return d + }, + } +} +</script> + +<style scoped> +.work-time-management{ + height: 100%; + overflow-y: scroll; + /* scrollbar-width: none; */ +} +/* .work-time-management::-webkit-scrollbar { + display: none; +} */ +.search { + background-color: #fff; + height: 80px; + display: flex; + align-items: center; + } + + .search_thing { + width: 300px; + display: flex; + align-items: center; + } + + .search_label { + width: 70px; + font-size: 14px; + text-align: right; + } + + .search_input { + width: calc(100% - 70px); + } + .table { + margin-top: 10px; + background-color: #fff; + width: calc(100% - 40px); + height: calc(100% - 60px - 80px - 10px - 40px - 25px); + padding: 20px; + } +</style> diff --git a/src/components/do/b3-work-time-management/work-time-statistics.vue b/src/components/do/b3-work-time-management/work-time-statistics.vue new file mode 100644 index 0000000..e624163 --- /dev/null +++ b/src/components/do/b3-work-time-management/work-time-statistics.vue @@ -0,0 +1,19 @@ +<template> + <div class="work-time-statistics"> + 宸ユ椂缁熻 + </div> +</template> + +<script> +export default { + data () { + return{ + + } + } +} +</script> + +<style> + +</style> diff --git a/src/components/view/b3-classes.vue b/src/components/view/b3-classes.vue index c931dfe..0c851bd 100644 --- a/src/components/view/b3-classes.vue +++ b/src/components/view/b3-classes.vue @@ -8,6 +8,7 @@ v-model="query.year" type="year" size="small" + format="yyyy" placeholder="閫夋嫨骞�" style="width: 140px;" :clearable="false"> @@ -41,12 +42,12 @@ <el-button size="small" type="primary" @click="refreshTable()">鏌� 璇�</el-button> </div> <div class="search_thing btns" style="padding-left: 30px;"> - <el-button size="small" type="primary">瀵� 鍑�</el-button> - <el-button size="small" type="primary" @click="schedulingVisible = true">鎺� 鐝�</el-button> + <el-button size="small" type="primary" v-if="downPower">瀵� 鍑�</el-button> + <el-button size="small" type="primary" @click="schedulingVisible = true" v-if="addPower">鎺� 鐝�</el-button> </div> </div> <div class="center" v-loading="pageLoading"> - <scroll-pagination @load="init" :finishLoding="finishLoding"> + <scroll-pagination @load="init" :finishLoding="finishLoding" v-show="query.month&&list.length>0"> <div class="clearfix"> <div class="fixed-left"> <div class="content-title" style="padding-left: 16px;box-sizing: border-box;"> @@ -59,7 +60,9 @@ <p style="font-size: 14px;color: #3A7BFA;line-height: 24px;">{{ item.name }}</p> <p style="color: #999999;font-size: 12px;transform: scale(0.8) translateX(-20px);white-space: nowrap;width: 150px;overflow-x: show;">鏃�: {{ item.day0 }}, 涓�: {{ item.day1 }}, 澶�: {{ item.day2 }}, 浼�: {{ item.day3 }}, 鍋�: {{ item.day4 }}</p> <p style="margin-top: 4px;"><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.totalAttendance }}澶�</span></p> + color: #FF4902;">{{ query.month?item.monthlyAttendance +.totalAttendance:item.sidebarAnnualAttendance +.totalAttendance }}澶�</span></p> </div> </div> </div> @@ -67,9 +70,11 @@ <div class="content"> <div class="content-title content-title-right" style="border-bottom: 0;"> <div class="content-title-item" v-for="(item,index) in weeks" :key="'b'+index"> - <span class="month">{{ item.weekNum }}鍛�</span> - <span class="day">{{ item.day }}</span> - <span class="week">{{ item.week }}</span> + <span class="month" style="position: absolute;top: 4px;" 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 }}</span> + </p> </div> </div> <div class="content-body" v-for="(item,index) in list" :key="'c'+index" @@ -77,11 +82,12 @@ v-on:mouseleave="currentUserIndex=null"> <div class="content-body-item" v-for="(m,i) in item.list" :key="'d'+i" :class="{hoverType:currentUserIndex==index}"> <div class="work-box" :class="{type0:m.shift==='0',type1:m.shift==='1',type2:m.shift==='2',type3:m.shift==='3',type4:m.shift==='4',}"> - <div class="work-box-left"> + <!-- <div class="work-box-left"> <span>{{ getShiftByDic(m.shift) }}</span> - </div> - <el-dropdown trigger="click" placement="bottom" @command="e=>handleCommand(e,m)"> - <i class="el-icon-arrow-down el-icon--right" style="font-size: 20px;color: #fff;cursor: pointer;"></i> + </div> --> + <el-dropdown trigger="click" placement="bottom" @command="e=>handleCommand(e,m)" :disabled="!downPower"> + <!-- <i class="el-icon-arrow-down el-icon--right" style="font-size: 20px;color: #fff;cursor: pointer;"></i> --> + <span style="cursor: pointer;">{{ getShiftByDic(m.shift) }}</span> <el-dropdown-menu slot="dropdown"> <el-dropdown-item v-for="(n,j) in classType" :key="'h'+j" :command="n.value">{{ n.label }}</el-dropdown-item> </el-dropdown-menu> @@ -93,6 +99,56 @@ </div> </div> </scroll-pagination> + <scroll-pagination @load="initYear" :finishLoding="finishLoding" v-show="!query.month&&list.length>0" style="width: 100%;"> + <div class="clearfix year-table"> + <div class="fixed-left"> + <div class="content-title" style="padding-left: 16px;box-sizing: border-box;"> + 浜哄憳鍚嶇О + </div> + <div class="content-user" :class="{hoverType:currentUserIndex==index}" v-for="(item,index) in list" :key="'e'+index" v-on:mouseenter="onMouseEnter(index)" + v-on:mouseleave="currentUserIndex=null"> + <div class="user-pic">{{ item.name.charAt(0) }}</div> + <div class="user-info"> + <p style="font-size: 14px;color: #3A7BFA;line-height: 24px;">{{ item.name }}</p> + <p style="color: #999999;font-size: 12px;transform: scale(0.8) translateX(-20px);white-space: nowrap;width: 150px;overflow-x: show;">鏃�: {{ item.day0 }}, 涓�: {{ item.day1 }}, 澶�: {{ item.day2 }}, 浼�: {{ item.day3 }}, 鍋�: {{ item.day4 }}</p> + <p style="margin-top: 4px;"><span style="color: #999999;font-size: 12px;display: inline-block;transform: scale(0.8) translateX(-10px);">鍚堣鍑哄嫟: </span><span style="font-size: 16px; + color: #FF4902;">{{ query.month?item.monthlyAttendance +.totalAttendance:item.sidebarAnnualAttendance +.totalAttendance }}澶�</span></p> + </div> + </div> + </div> + <div class="scroll-right"> + <div class="content"> + <div> + <div class="content-title content-title-right" style="border-bottom: 0;height: 52px;" :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 list" + :key="'c'+index" + v-on:mouseenter="onMouseEnter(index)" + v-on:mouseleave="currentUserIndex=null" + :style="`display: grid; + grid-template-columns: repeat(${monthList.length}, 1fr);`" + > + <div class="content-body-item" v-for="(m,i) in monthList.length" :key="'d'+i" :class="{hoverType:currentUserIndex==index}"> + <p style="color:rgb(153, 153, 153);font-size: 12px;">鍚堣鍑哄嫟锛�<span style="font-size: 14px;color:#000">12</span></p> + <p style="color:rgb(153, 153, 153);font-size: 12px;"> + 鏃�: 12, 涓�: 12, 澶�: 12, 浼�: 12, 鍋�: 12 + </p> + </div> + </div> + </div> + </div> + </div> + </div> + </scroll-pagination> + <span style="color:#909399;font-size:14px;position: absolute;left:50%;top: 50%;transform: translate(-59%,-50%);" v-if="list.length==0">鏆傛棤鏁版嵁</span> </div> <el-dialog title="鎺掔彮" :visible.sync="schedulingVisible" width="400px"> <div class="search_thing"> @@ -151,188 +207,68 @@ }, data () { return{ - currentYear:new Date().getFullYear(), - currentMonth:new Date().getMonth()+1, + addPower:true, + upPower:true, + downPower:true, query:{ userName:'', laboratory:'', - year:'', - month:'' + year:new Date(), + month:new Date().getMonth()+1 + // month:'' }, monthOptions:[ { - value:'1', + value:1, label:'1鏈�' }, { - value:'2', + value:2, label:'2鏈�' }, { - value:'3', + value:3, label:'3鏈�' }, { - value:'4', + value:4, label:'4鏈�' }, { - value:'5', + value:5, label:'5鏈�' }, { - value:'6', + value:6, label:'6鏈�' }, { - value:'7', + value:7, label:'7鏈�' }, { - value:'8', + value:8, label:'8鏈�' }, { - value:'9', + value:9, label:'9鏈�' }, { - value:'10', + value:10, label:'10鏈�' }, { - value:'11', + value:11, label:'11鏈�' }, { - value:'12', + value:12, label:'12鏈�' }, ], laboratory:[], weeks:[], - workList:[ - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'涓彮', - time:'8:00-16:00', - }, - { - type:'澶滅彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - { - type:'鏃╃彮', - time:'8:00-16:00', - }, - ], classType:[], currentUserIndex:null, schedulingVisible:false, @@ -347,8 +283,24 @@ currentPage: 1, // 褰撳墠椤� pageSize: 10, // 涓�椤�10鏉� total: '', - pageLoading: true, // 缁勪欢loading鐨勫睍绀�,榛樿涓簍rue - finishLoding: false // 鍔犺浇瀹屾垚锛屾樉绀哄凡缁忔病鏈夋洿澶氫簡 + pageLoading: false, // 缁勪欢loading鐨勫睍绀�,榛樿涓簍rue + finishLoding: false, // 鍔犺浇瀹屾垚锛屾樉绀哄凡缁忔病鏈夋洿澶氫簡 + monthList:[] + } + }, + watch: { + 'query.year'(val){ + this.monthList = [] + if(val.getFullYear()==new Date().getFullYear()){ + for(let i=new Date().getMonth()+1;i>0;i--){ + this.monthList.push(i) + } + }else{ + for (let i=12;i>0;i--) { + this.monthList.push(i) + } + } + this.monthList.reverse() } }, mounted(){ @@ -356,6 +308,12 @@ this.obtainItemParameterList() this.getUsers() this.init() + this.monthList = [] + for(let i=new Date().getMonth()+1;i>0;i--){ + this.monthList.push(i) + } + this.monthList.reverse() + // this.getPower() }, methods: { refresh(){ @@ -364,8 +322,8 @@ this.query = { userName:'', laboratory:'', - year:'', - month:'' + year:new Date(), + month:new Date().getMonth()+1 } this.init() }, @@ -378,39 +336,52 @@ if(this.currentPage==1){ this.pageLoading = true } + let year = this.query.year.getFullYear() + let month0 = this.query.month?this.query.month:new Date().getMonth()+1 + let month = month0>9?month0:'0'+month0 this.$axios.post(this.$api.performanceShift.page, { size:this.pageSize, current:this.currentPage, - time:this.query.month?this.query.year+'-'+this.query.month:this.query.year, + time:year+'-'+month+'-01 00:00:00', userName:this.query.userName, laboratory:this.query.laboratory, }).then(res => { this.pageLoading = false if (res.code == 201) return this.total = res.data.total - let list = res.data.records.map(item=>{ - for (let key in item) { + let list = res.data.page.records.map(item=>{ + for (let key in item.monthlyAttendance) { let type = this.getDayByDic(key) if(type!=undefined||type!=null){ - item[`day${type}`] = item[key] + item[`day${type}`] = item.monthlyAttendance[key] } } return item }); // 鍙充晶鏃ユ湡鑾峰彇 - if(this.currentPage==1){ - if(list&&list.length>0){ - this.weeks = []; - list[0].list&&list[0].list.forEach(item=>{ - let obj = { - weekNum:item.weekly, - week:item.headerTime.split(' ')[1], - day:item.headerTime.split(' ')[0] - } - this.weeks.push(obj) - }) + // if(this.currentPage==1){ + // if(list&&list.length>0){ + // this.weeks = []; + // list[0].list&&list[0].list.forEach(item=>{ + // let obj = { + // weekNum:item.weekly, + // week:item.headerTime.split(' ')[1], + // day:item.headerTime.split(' ')[0] + // } + // this.weeks.push(obj) + // }) + // } + // } + 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) + }) if(list.length==0){ this.finishLoding = true; }else{ @@ -423,7 +394,29 @@ } this.currentPage++; } + console.log(this.list) }) + }, + initYear(){}, + getPower() { + let power = JSON.parse(sessionStorage.getItem('power')) + let add = false + let up = false + let down = false + for (var i = 0; i < power.length; i++) { + if (power[i].menuMethod == 'update') { + up = true + } + if (power[i].menuMethod == 'delDeviceParameter') { + down = true + } + if (power[i].menuMethod == 'add') { + add = true + } + } + this.addPower = add + this.upPower = up + this.downPower = down }, onMouseEnter(index){ this.currentUserIndex = index @@ -487,10 +480,14 @@ }, handleCommand(e,m){ if(e!=m.shift){ - this.$axios.put(this.$api.performanceShift.update+m.id, { + this.$axios.put(this.$api.performanceShift.update, { id:m.id, shift:e - }).then(res => { + }, { + headers: { + 'Content-Type': 'application/json' + } + }).then(res => { if (res.code == 201) return this.$message.success('鎿嶄綔鎴愬姛') m.shift = e @@ -610,32 +607,33 @@ } .content-title-item{ height: 100%; - width: 100px; + width: 60px; flex-shrink: 0; border-bottom: 1px solid #EEEEEE; box-sizing: border-box; display: flex; align-items: center; justify-content: center; + flex-direction: column; + position: relative; } .content-title-item .month{ font-size: 12px; color: #3A7BFA; box-sizing: border-box; - padding: 0 4px; + padding: 0 1px; border-radius: 50%; background: #D6E4FF; - line-height: 30px; text-align: center; - margin-right: 6px; + line-height: 22px; } .content-title-item .day{ - font-size: 16px; + font-size: 14px; color: #333333; - margin-right: 6px; + /* margin-right: 4px; */ } .content-title-item .week{ - font-size: 14px; + font-size: 12px; color: #999999; } .content-body{ @@ -643,8 +641,8 @@ align-items: center; } .content-body-item{ - height: 80px; - width: 100px; + height: 70px; + width: 60px; flex-shrink: 0; box-sizing: border-box; padding: 4px; @@ -664,28 +662,43 @@ } .work-box.type0{ background: rgba(58,123,250,0.15); - color: #3A7BFA; + color: #3A7BFA !important; +} +.work-box.type0 span{ + color: #3A7BFA !important; } .work-box.type1{ background: #E3DCFE; - color: #635998; + color: #635998 !important; +} +.work-box.type1 span{ + color: #635998 !important; } .work-box.type2{ background: #FAE2CA; - color: #BC8D5E; + color: #BC8D5E !important; +} +.work-box.type2 span{ + color: #BC8D5E !important; } .work-box.type3{ background: #E1F3D8; - color: #67C23A; + color: #67C23A !important; +} +.work-box.type3 span{ + color: #67C23A !important; } .work-box.type4{ background: #FDE2E2; - color: #F56C6C; + color: #F56C6C !important; } -.el-icon-arrow-down::before{ +.work-box.type4 span{ + color: #F56C6C !important; +} +/* .el-icon-arrow-down::before{ color: #c6c4c4; -} -.type0 .el-icon-arrow-down::before{ +} */ +/* .type0 .el-icon-arrow-down::before{ color: #fff; } .type1 .el-icon-arrow-down::before{ @@ -699,7 +712,7 @@ } .type4 .el-icon-arrow-down::before{ color: #fff; -} +} */ .work-box-left{ display: flex; justify-content: center; @@ -708,7 +721,7 @@ } .content-user{ width: 100%; - height: 80px; + height: 70px; box-sizing: border-box; border-bottom: 1px solid #EEEEEE; display: flex; @@ -732,4 +745,37 @@ .hoverType{ background: rgba(58,123,250,0.05); } +.year-table{ + width: 100%; +} +/* .year-table .scroll-right{ + width: calc(100% -220px); +} */ +.year-table .scroll-right{ + flex: 1; +} +.year-table .month{ + font-size: 14px; + color: #3A7BFA; + box-sizing: border-box; + padding: 0 4px; + border-radius: 50%; + background: #D6E4FF; + text-align: center; + line-height: 30px; +} +.year-table .content-title-item{ + width: 100%; +} +.year-table .content-body{ + /* width: calc(100% -220px) !important; */ +} +.year-table .content-body-item{ + width: 100%; + height: 70px; + display: flex; + align-items: center; + flex-direction: column; + justify-content: center; +} </style> diff --git a/src/components/view/b3-work-time-management.vue b/src/components/view/b3-work-time-management.vue new file mode 100644 index 0000000..9a90bfc --- /dev/null +++ b/src/components/view/b3-work-time-management.vue @@ -0,0 +1,38 @@ +<template> + <div class="work-time-management"> + <el-radio-group v-model="currentComponent" size="small" style="margin-top: 16px;margin-bottom: 16px;"> + <el-radio-button label="workTimeStatistics"> + 宸ユ椂缁熻 + </el-radio-button> + <el-radio-button label="workTimeManagement"> + 鏃ュ伐鏃剁鐞� + </el-radio-button> + <el-radio-button label="workTimeConfig"> + 杈呭姪宸ユ椂閰嶇疆 + </el-radio-button> + </el-radio-group> + <component :is="currentComponent"></component> + </div> +</template> + +<script> +import workTimeStatistics from '../do/b3-work-time-management/work-time-statistics.vue' +import workTimeManagement from '../do/b3-work-time-management/work-time-management.vue' +import workTimeConfig from '../do/b3-work-time-management/work-time-config.vue' +export default { + components: { + workTimeStatistics, + workTimeManagement, + workTimeConfig + }, + data() { + return{ + currentComponent:'workTimeConfig' + } + } +} +</script> + +<style scoped> + +</style> diff --git a/static/js/menu.js b/static/js/menu.js index 98b2997..831a1ca 100644 --- a/static/js/menu.js +++ b/static/js/menu.js @@ -69,7 +69,7 @@ c: [{ v: "宸ユ椂绠$悊", i: "font icon-erjidaohang", - u: "", + u: "b3-work-time-management", p: "" }, { v: "浜哄憳鑰冨嫟", -- Gitblit v1.9.3