zjl #26
4
.env.dev
4
.env.dev
@ -12,9 +12,9 @@ ENV = 'development'
|
||||
VUE_APP_TITLE = 芋道管理系统
|
||||
|
||||
# 芋道管理系统/开发环境
|
||||
VUE_APP_BASE_API = 'http://192.168.1.49:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.8:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.0.33:48080'
|
||||
VUE_APP_BASE_API = 'http://192.168.0.33:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
|
||||
|
||||
# 路由懒加载
|
||||
|
||||
@ -50,3 +50,11 @@ export function getCode() {
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 获得可用的排班列表
|
||||
export function listEnabled() {
|
||||
return request({
|
||||
url: '/base/group-team/listEnabled',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
@ -1,54 +1,27 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 创建排班信息
|
||||
export function createGroupTeamScheduling(data) {
|
||||
// 获取某月预排班-已有排班
|
||||
export function getPreset(query) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/create',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 更新排班信息
|
||||
export function updateGroupTeamScheduling(data) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/update',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除排班信息
|
||||
export function deleteGroupTeamScheduling(id) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/delete?id=' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
// 获得排班信息
|
||||
export function getGroupTeamScheduling(id) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/get?id=' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 获得排班信息分页
|
||||
export function getGroupTeamSchedulingPage(query) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/page',
|
||||
url: '/base/group-team-scheduling/getPreset',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 导出排班信息 Excel
|
||||
export function exportGroupTeamSchedulingExcel(query) {
|
||||
// 批量创建-更新排班信息
|
||||
export function createOrUpdateList(data) {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/export-excel',
|
||||
method: 'get',
|
||||
params: query,
|
||||
responseType: 'blob'
|
||||
url: '/base/group-team-scheduling/createOrUpdateList',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 自动排班，填充上月已有的排班
|
||||
export function autoSet() {
|
||||
return request({
|
||||
url: '/base/group-team-scheduling/autoSet',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
10
src/assets/icons/svg/toggle.svg
Normal file
10
src/assets/icons/svg/toggle.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>切换</title>
|
||||
<g id="1班组管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="切换" fill="#FFFFFF" fill-rule="nonzero">
|
||||
<rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect>
|
||||
<path d="M14.5,9.15 C14.969442,9.15 15.35,9.53055796 15.35,10 C15.35,10.4333311 15.0257376,10.7909267 14.6066222,10.8433773 L14.5,10.85 L3.523,10.8493636 L5.10448737,12.4305126 C5.26177017,12.5877954 5.34716031,12.7990496 5.34764236,13.015701 L5.34074746,13.1242515 L5.31933966,13.2323523 C5.24258033,13.518822 5.01882201,13.7425803 4.73235229,13.8193397 C4.48169128,13.8865041 4.21633806,13.832194 4.01342676,13.6770775 L3.93051263,13.6044874 L1.04232939,10.7055042 C0.831903536,10.5688042 0.689345737,10.3541899 0.656994192,10.1075365 L0.65,10 L0.65778959,9.88152374 C0.670925502,9.77175364 0.705946489,9.66606949 0.76033092,9.57061601 L0.821076439,9.47880032 L0.894170559,9.39517056 C1.02591288,9.26342824 1.19742791,9.1808136 1.37731459,9.15882561 L1.5,9.15 L14.5,9.15 Z M11.9865732,2.32292254 L12.0694874,2.39551263 L14.9508862,5.29019827 C15.1653597,5.42263107 15.3074642,5.64305498 15.3419246,5.89182346 L15.35,6 L15.3417548,6.1198336 C15.3282251,6.22918814 15.2930578,6.33441548 15.2387207,6.42946868 L15.1780851,6.52090655 L15.1052179,6.60421789 C14.9738843,6.73555151 14.8030912,6.81820523 14.622959,6.840766 L14.5,6.85 L1.5,6.85 C1.03055796,6.85 0.65,6.46944204 0.65,6 C0.65,5.56666889 0.974262406,5.20907332 1.39337781,5.15662271 L1.5,5.15 L12.475,5.14936355 L10.8955126,3.56948738 C10.7382298,3.41220459 10.6528397,3.20095039 10.6523576,2.98429905 L10.6592525,2.8757485 L10.6806603,2.76764771 C10.7478247,2.5169867 10.9275353,2.31433911 11.1633258,2.21617103 L11.2676477,2.18066033 C11.5183087,2.11349592 11.7836619,2.167806 11.9865732,2.32292254 Z" id="形状结合"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<span class="blue-block"></span>
|
||||
<el-form-item label="能源类型">
|
||||
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
|
||||
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
|
||||
<el-option
|
||||
v-for="item in energyTypeList"
|
||||
:key="item.id"
|
||||
@ -11,7 +12,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="时间维度">
|
||||
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
|
||||
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
|
||||
<el-option
|
||||
v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
|
||||
:key="item.value"
|
||||
@ -33,6 +34,7 @@
|
||||
:picker-options="pickerOptions"
|
||||
popper-class="noneMinute"
|
||||
@change="timeSelect"
|
||||
size="small"
|
||||
:clearable="false"
|
||||
>
|
||||
</el-date-picker>
|
||||
@ -47,6 +49,7 @@
|
||||
value-format="timestamp"
|
||||
:picker-options="pickerOptions"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
@change="timeSelect"
|
||||
>
|
||||
</el-date-picker>
|
||||
@ -60,6 +63,7 @@
|
||||
:picker-options="pickerOptionsWeek"
|
||||
@change="startWeek"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择周">
|
||||
</el-date-picker>-
|
||||
<el-date-picker
|
||||
@ -70,6 +74,7 @@
|
||||
style='width:150px;'
|
||||
@change="endWeek"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择周">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -83,6 +88,7 @@
|
||||
value-format="timestamp"
|
||||
:clearable="false"
|
||||
:picker-options="pickerOptions"
|
||||
size="small"
|
||||
@change="timeSelect"
|
||||
>
|
||||
</el-date-picker>
|
||||
@ -96,6 +102,7 @@
|
||||
value-format="timestamp"
|
||||
placeholder="选择年"
|
||||
@change="startYear"
|
||||
size="small"
|
||||
:clearable="false"
|
||||
>
|
||||
</el-date-picker>-
|
||||
@ -107,13 +114,14 @@
|
||||
value-format="timestamp"
|
||||
placeholder="选择年"
|
||||
@change="endYear"
|
||||
size="small"
|
||||
:clearable="false"
|
||||
>
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="对象维度">
|
||||
<el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs">
|
||||
<el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs" size="small">
|
||||
<el-option
|
||||
v-for="item in getDictDatas(this.DICT_TYPE.OBJECT_TYPE)"
|
||||
:key="item.value"
|
||||
@ -123,7 +131,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="对象选择">
|
||||
<el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;">
|
||||
<el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;" size="small">
|
||||
<el-option
|
||||
v-for="item in objectList"
|
||||
:key="item.id"
|
||||
@ -135,7 +143,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="search">查询</el-button>
|
||||
<el-button type="primary" size="small" @click="search">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
@ -400,4 +408,17 @@ export default {
|
||||
.noneMinute .el-scrollbar:nth-of-type(2) {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.demo-form-inline {
|
||||
.blue-block {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background-color: #0B58FF;
|
||||
border-radius: 1px;
|
||||
margin-right: 8px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,15 +1,17 @@
|
||||
<template>
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<span class="blue-block"></span>
|
||||
<el-form-item label="对象选择">
|
||||
<el-cascader
|
||||
v-model="objArr"
|
||||
:options="objList"
|
||||
:props="{ checkStrictly: true, value: 'id', label: 'name' }"
|
||||
popper-class="cascaderParent"
|
||||
size="small"
|
||||
clearable></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="时间维度">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;" size="small">
|
||||
<el-option
|
||||
v-for="item in timeType"
|
||||
:key="item.id"
|
||||
@ -27,6 +29,7 @@
|
||||
:picker-options="pickerOptions"
|
||||
@change="selectTime"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择月">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -38,6 +41,7 @@
|
||||
:picker-options="pickerOptionsWeek"
|
||||
@change="selectTime"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择周">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -48,18 +52,19 @@
|
||||
:picker-options="pickerOptions"
|
||||
@change="selectTime"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择日">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="search">查询</el-button>
|
||||
<el-button type="primary" size="small" @click="search">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<span class="separateStyle"></span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="exportData" plain>导出</el-button>
|
||||
<el-button type="primary" size="small" @click="exportData" plain>导出</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
@ -178,4 +183,17 @@ export default {
|
||||
background: #E8E8E8;
|
||||
vertical-align: middle;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.demo-form-inline {
|
||||
.blue-block {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background-color: #0B58FF;
|
||||
border-radius: 1px;
|
||||
margin-right: 8px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<span class="blue-block"></span>
|
||||
<el-form-item label="能源类型">
|
||||
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
|
||||
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
|
||||
<el-option
|
||||
v-for="item in energyTypeList"
|
||||
:key="item.id"
|
||||
@ -16,15 +17,17 @@
|
||||
:options="objList"
|
||||
:props="{ checkStrictly: true, value: 'id', label: 'name' }"
|
||||
popper-class="cascaderParent"
|
||||
size="small"
|
||||
clearable></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="时间维度">
|
||||
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
|
||||
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
|
||||
<el-option
|
||||
v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
:value="item.value"
|
||||
size="small">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@ -41,6 +44,7 @@
|
||||
:picker-options="pickerOptions"
|
||||
popper-class="noneMinute"
|
||||
@change="timeSelect"
|
||||
size="small"
|
||||
>
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -54,6 +58,7 @@
|
||||
value-format="timestamp"
|
||||
:picker-options="pickerOptions"
|
||||
@change="timeSelect"
|
||||
size="small"
|
||||
>
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -65,6 +70,7 @@
|
||||
style='width:150px;'
|
||||
:picker-options="pickerOptionsWeek"
|
||||
@change="startWeek"
|
||||
size="small"
|
||||
placeholder="选择周">
|
||||
</el-date-picker>-
|
||||
<el-date-picker
|
||||
@ -74,6 +80,7 @@
|
||||
:picker-options="pickerOptionsWeek"
|
||||
style='width:150px;'
|
||||
@change="endWeek"
|
||||
size="small"
|
||||
placeholder="选择周">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -86,6 +93,7 @@
|
||||
end-placeholder="结束日期"
|
||||
value-format="timestamp"
|
||||
:picker-options="pickerOptions"
|
||||
size="small"
|
||||
@change="timeSelect"
|
||||
>
|
||||
</el-date-picker>
|
||||
@ -98,6 +106,7 @@
|
||||
:picker-options="pickerOptions"
|
||||
value-format="timestamp"
|
||||
placeholder="选择年"
|
||||
size="small"
|
||||
@change="startYear"
|
||||
>
|
||||
</el-date-picker>-
|
||||
@ -108,13 +117,14 @@
|
||||
:picker-options="pickerOptions"
|
||||
value-format="timestamp"
|
||||
placeholder="选择年"
|
||||
size="small"
|
||||
@change="endYear"
|
||||
>
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="search">查询</el-button>
|
||||
<el-button type="primary" size="small" @click="search">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
@ -361,4 +371,17 @@ export default {
|
||||
.noneMinute .el-scrollbar:nth-of-type(2) {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.demo-form-inline {
|
||||
.blue-block {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background-color: #0B58FF;
|
||||
border-radius: 1px;
|
||||
margin-right: 8px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,15 +1,17 @@
|
||||
<template>
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<span class="blue-block"></span>
|
||||
<el-form-item label="对象选择">
|
||||
<el-cascader
|
||||
v-model="objArr"
|
||||
:options="objList"
|
||||
:props="{ checkStrictly: true, value: 'id', label: 'name' }"
|
||||
popper-class="cascaderParent"
|
||||
size="small"
|
||||
clearable></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="时间维度">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;" size="small">
|
||||
<el-option
|
||||
v-for="item in timeType"
|
||||
:key="item.id"
|
||||
@ -27,6 +29,7 @@
|
||||
:picker-options="pickerOptions"
|
||||
@change="selectTime"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
@ -37,18 +40,19 @@
|
||||
:picker-options="pickerOptions"
|
||||
@change="selectTime"
|
||||
:clearable="false"
|
||||
size="small"
|
||||
placeholder="选择月">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="search">查询</el-button>
|
||||
<el-button type="primary" size="small" @click="search">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<span class="separateStyle"></span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="exportData" plain>导出</el-button>
|
||||
<el-button type="primary" size="small" @click="exportData" plain>导出</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
@ -153,4 +157,17 @@ export default {
|
||||
background: #E8E8E8;
|
||||
vertical-align: middle;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.demo-form-inline {
|
||||
.blue-block {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background-color: #0B58FF;
|
||||
border-radius: 1px;
|
||||
margin-right: 8px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -124,6 +124,10 @@ export default {
|
||||
this.getList()
|
||||
this.getTypeList()
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.$route.params.name)
|
||||
console.log('22222')
|
||||
},
|
||||
methods: {
|
||||
getTypeList() {
|
||||
getEnergyTypeListAll().then((res) => {
|
||||
|
||||
@ -1,67 +1,583 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div>
|
||||
<div class="groupTeamScheduling">
|
||||
<div class="operationArea">
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<span class="blue-block"></span>
|
||||
<el-form-item label="月份选择">
|
||||
<el-date-picker
|
||||
v-model="queryParams.startDay"
|
||||
v-model="startDay"
|
||||
type="month"
|
||||
placeholder="选择月">
|
||||
placeholder="选择月"
|
||||
size="small"
|
||||
:disabled="showSetting"
|
||||
@change="selectMonth"
|
||||
:clearable="false"
|
||||
style="width: 120px">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary">自动排班</el-button>
|
||||
<span class="separateStyle"></span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary">编辑</el-button>
|
||||
<el-button type="primary" size="small" :disabled="showSetting || settingBtnDis" @click="settingMsg">设置</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain @click="toUpperLower">班组上下片查询</el-button>
|
||||
<el-button type="primary" size="small" v-show="showSetting && autoScheduling" @click="schedulingBtn">自动排班</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain>班组能源查询</el-button>
|
||||
<span class="separateStyle" v-show="showSetting"></span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain>班组检测查询</el-button>
|
||||
<el-button type="primary" size="small" v-show="showSetting" @click="confirmSetting">确认</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="small" plain v-show="showSetting" @click="cancelSetting">取消</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="请先选择查询的班组" class="rightItem">
|
||||
<el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('1')">班组上下片查询</el-button>
|
||||
<el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('2')">班组能源查询</el-button>
|
||||
<el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('3')">班组检测查询</el-button>
|
||||
<el-button type="primary" size="small" @click="aaa">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<!-- 班组上下片查询 -->
|
||||
<group-upper-lower v-if="upperLowerVisible" ref="upperLowerParam"></group-upper-lower>
|
||||
<!-- 日历区域 -->
|
||||
<div class="calenderArea">
|
||||
<div style="font-size: 24px;font-weight: 500">{{ this.month }} {{ this.year }}</div>
|
||||
<el-calendar v-model="startDay">
|
||||
<!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
|
||||
<template
|
||||
slot="dateCell"
|
||||
slot-scope="{date, data}">
|
||||
<div v-if="data.type === 'current-month'">
|
||||
<!-- 日期 -->
|
||||
<div class="dateStyle">
|
||||
{{ Number(data.day.split('-')[2]) }}
|
||||
{{ data.day }}
|
||||
</div>
|
||||
<!-- 班次班组 -->
|
||||
<!-- class有两个样式，一个是类似class1，还有个是选中红框显示 -->
|
||||
<el-row :gutter="2" :class="'class' + (index+1) + (chooseTip === (item.startDay+item.classesId) ? ' team-active' : '')" v-for="(item, index) in list[Number(data.day.split('-')[2])]" :key='index'>
|
||||
<el-col :span="12">
|
||||
<div class="selectDiv">
|
||||
<!-- 选择班组图标 -->
|
||||
<div class="toggle-icon" v-show="showSetting && (new Date(data.day).valueOf() < new Date().valueOf() ? false: true)">
|
||||
<svg-icon icon-class="toggle"/>
|
||||
</div>
|
||||
<!-- 不能选择班组 -->
|
||||
<div class="toggle-icon-hide" v-show="!(showSetting && (new Date(data.day).valueOf() < new Date().valueOf() ? false: true))"></div>
|
||||
<el-select v-model="item.teamId" size='small' :disabled="!showSetting || (new Date(data.day).valueOf() > new Date().valueOf() ? false: true)" @change="a">
|
||||
<el-option
|
||||
v-for="i in teamList"
|
||||
:key="i.id"
|
||||
:label="i.name"
|
||||
:value="i.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-button class="labelClass" @click="chooseTeam(item)">{{ item.classesName }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
</el-calendar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createGroupTeamScheduling } from "@/api/base/groupTeamScheduling";
|
||||
import GroupUpperLower from "./components/groupUpperLower.vue"
|
||||
import { getPreset, createOrUpdateList, autoSet } from "@/api/base/groupTeamScheduling";
|
||||
import { listEnabled } from "@/api/base/groupTeam";
|
||||
import moment from 'moment';
|
||||
|
||||
export default {
|
||||
name: "GroupTeamScheduling",
|
||||
components: { GroupUpperLower },
|
||||
data() {
|
||||
return {
|
||||
monthList: [
|
||||
{id: ''}
|
||||
],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
upperLowerVisible: false
|
||||
startDay: '',// 查询参数
|
||||
year: '',// 2023
|
||||
month: '',// 九月
|
||||
monthList: ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
|
||||
// list: {
|
||||
// 1:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-01",
|
||||
// startTime: 1690848000000,
|
||||
// teamId: "1685934333821423617",
|
||||
// teamName: "S班"
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-01",
|
||||
// startTime: 1690894000000,
|
||||
// teamId: "1685926036653445121",
|
||||
// teamName: "test3"
|
||||
// }
|
||||
// ],
|
||||
// 2:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-02",
|
||||
// startTime: 1690848000000,
|
||||
// teamId: "1685934333821423617",
|
||||
// teamName: "S班"
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-02",
|
||||
// startTime: 1690894000000,
|
||||
// teamId: "1685926036653445121",
|
||||
// teamName: "test3"
|
||||
// }
|
||||
// ],
|
||||
// 3:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-03",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-03",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ],
|
||||
// 4:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-04",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-04",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ],
|
||||
// 5:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-15",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-15",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ],
|
||||
// 6:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-16",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-16",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ],
|
||||
// 7:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-17",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-17",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ],
|
||||
// 18:[
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690891200000,
|
||||
// startDay:"2023-09-18",
|
||||
// startTime: 1690848000000
|
||||
// },
|
||||
// {
|
||||
// classesId: "1674293974662062081",
|
||||
// endTime: 1690934400000,
|
||||
// startDay:"2023-09-18",
|
||||
// startTime: 1690894000000
|
||||
// }
|
||||
// ]
|
||||
// },//日历数据
|
||||
list: [],
|
||||
teamList: [],// 班组下拉
|
||||
showSetting: false,// 设置模式。自动排班，确认，取消按钮显示
|
||||
settingBtnDis: false,
|
||||
jumpDisabled: true,// 操作按钮控制
|
||||
chooseObj: {}, //当前选中的数据，查询按钮用
|
||||
chooseTip: '',// 当前选中数据的唯一值，显示红框
|
||||
autoScheduling: false // 只有在当前日期后的月份才生效
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.startDay = new Date()
|
||||
// 设置按钮是否置灰
|
||||
this.settingBtn()
|
||||
this.getTeamList()
|
||||
this.toggleMonth()
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {},
|
||||
toUpperLower() {
|
||||
this.upperLowerVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.upperLowerParam.init()
|
||||
// 切换月份
|
||||
selectMonth() {
|
||||
if (this.startDay) {
|
||||
this.settingBtn() // 设置按钮状态,需在getlist前面
|
||||
this.toggleMonth()
|
||||
this.getList()
|
||||
this.clearChoose()
|
||||
if ( moment(this.startDay).valueOf() > moment().endOf('month').valueOf()) {
|
||||
this.autoScheduling = true
|
||||
} else {
|
||||
this.autoScheduling = false
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获取班组列表
|
||||
getTeamList() {
|
||||
listEnabled().then(res => {
|
||||
this.teamList = res.data || []
|
||||
})
|
||||
},
|
||||
// 获取日历数据
|
||||
getList() {
|
||||
let year = moment(this.startDay).format('YYYY')
|
||||
let month = moment(this.startDay).format('M')
|
||||
getPreset({
|
||||
year: year,
|
||||
month: month
|
||||
}).then(res => {
|
||||
this.list = res.data || []
|
||||
}).catch(() => {
|
||||
this.list = []
|
||||
this.settingBtnDis = true // 禁用设置按钮
|
||||
})
|
||||
},
|
||||
// 设置
|
||||
settingMsg() {
|
||||
this.showSetting = !this.showSetting
|
||||
this.clearChoose()
|
||||
},
|
||||
// 取消
|
||||
cancelSetting() {
|
||||
this.showSetting = !this.showSetting
|
||||
this.getList() // 数据还原
|
||||
},
|
||||
// 确认
|
||||
confirmSetting() {
|
||||
// 打平数据
|
||||
let tempArr = Object.values(this.list)
|
||||
let arr = []
|
||||
for (let i = 0; i < tempArr.length; i++) {
|
||||
for (let j = 0; j < tempArr[i].length; j++) {
|
||||
arr.push(tempArr[i][j])
|
||||
}
|
||||
}
|
||||
createOrUpdateList(arr).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.showSetting = !this.showSetting
|
||||
this.getList() // 数据更新
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击班次红框选中当前数据
|
||||
chooseTeam(value) {
|
||||
if (this.showSetting) {
|
||||
this.$modal.msgWarning("当前处于设置模式")
|
||||
return false
|
||||
}
|
||||
this.chooseObj = value
|
||||
this.chooseTip = value.startDay + value.classesId // 匹配当前的样式
|
||||
this.jumpDisabled = false //查询按钮不禁用
|
||||
},
|
||||
// 自动排班
|
||||
schedulingBtn() {
|
||||
// 次月1号有值前端排班
|
||||
if (this.list[1][0].teamId) {
|
||||
console.log('次月1号有值前端排班')
|
||||
let tempArr = Object.values(this.list)
|
||||
let arr = []
|
||||
let n = 0
|
||||
for (let i = 0; i < tempArr.length; i++) {
|
||||
if (n > 0) {
|
||||
break;
|
||||
}
|
||||
for (let j = 0; j < tempArr[i].length; j++) {
|
||||
if (tempArr[i][j].teamId) {
|
||||
arr.push(tempArr[i][j].teamId)
|
||||
} else {
|
||||
n++
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(arr)
|
||||
for (let k = 0; k < tempArr.length; k++) {
|
||||
for (let v = 0; v < tempArr[k].length; v++) {
|
||||
let t = (k*(k+1)+v) % arr.length
|
||||
// console.log(t)
|
||||
if (arr.length === 1) {
|
||||
this.list[k+1][v].teamId = arr[0]
|
||||
} else {
|
||||
if (k === 0 && v === 0) {
|
||||
this.list[k+1][v].teamId = arr[0]
|
||||
} else {
|
||||
this.list[k+1][v].teamId = arr[t]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// 次月1号没有值,接口排班
|
||||
console.log('次月1号没有值接口排班')
|
||||
autoSet().then(res => {
|
||||
this.list = res.data || []
|
||||
})
|
||||
}
|
||||
},
|
||||
// 设置按钮如果是上个月或者今天是本月最后一天，设置按钮置灰
|
||||
settingBtn() {
|
||||
let nowMonth = moment().startOf('month').valueOf()
|
||||
let startMonth = moment(this.startDay).valueOf()
|
||||
let nowDate = moment(new Date()).date()
|
||||
let sumDate = moment().daysInMonth()
|
||||
if (nowMonth > startMonth) { // 之前月
|
||||
this.settingBtnDis = true
|
||||
} else {
|
||||
if (nowDate < sumDate) {
|
||||
this.settingBtnDis = false
|
||||
} else {
|
||||
this.settingBtnDis = true
|
||||
}
|
||||
}
|
||||
},
|
||||
// 清除红框选中数据
|
||||
clearChoose() {
|
||||
this.chooseObj = {}
|
||||
this.chooseTip = ""
|
||||
this.jumpDisabled = true
|
||||
},
|
||||
// 切换月份显示
|
||||
toggleMonth() {
|
||||
this.year = moment(this.startDay).format("YYYY")
|
||||
let month = Number(moment(this.startDay).format("MM"))
|
||||
this.month = this.monthList[month - 1]
|
||||
},
|
||||
// 3个跳转按钮
|
||||
toOtherPage(val) {
|
||||
switch (val) {
|
||||
case '1':
|
||||
this.$router.push({
|
||||
path: '/core/monitoring/production-line-data',
|
||||
// name: 'reportDesign',
|
||||
params: { startTime: '1111', endTime: '2222' }
|
||||
})
|
||||
break;
|
||||
case '2':
|
||||
this.$router.push({
|
||||
// path: '/energy/monitoring/energy-report-search',
|
||||
name: 'EnergyReportSearch',
|
||||
params: { startTime: '1111', endTime: '2222' }
|
||||
})
|
||||
console.log('aaa')
|
||||
break;
|
||||
default:
|
||||
this.$router.push({
|
||||
path: '/quality/monitoring/quality-statistics',
|
||||
// name: 'reportDesign',
|
||||
params: { startTime: '1111', endTime: '2222' }
|
||||
})
|
||||
}
|
||||
},
|
||||
aaa() {
|
||||
console.log(this.list)
|
||||
},
|
||||
a() {
|
||||
console.log('11111')
|
||||
this.$forceUpdate()
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.groupTeamScheduling {
|
||||
background-color: #F2F4F9;
|
||||
.operationArea {
|
||||
padding: 14px 10px 0 16px;
|
||||
margin-bottom: 8px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
.blue-block {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background-color: #0B58FF;
|
||||
border-radius: 1px;
|
||||
margin-right: 8px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.separateStyle {
|
||||
display: inline-block;
|
||||
width: 1px;
|
||||
height: 24px;
|
||||
background: #E8E8E8;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.rightItem {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
// 日历
|
||||
.calenderArea {
|
||||
padding: 14px 10px 0 20px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
.el-calendar__body {
|
||||
padding: 10px 16px 16px 0;
|
||||
}
|
||||
.el-calendar__header {
|
||||
display: none;
|
||||
}
|
||||
.el-calendar-table > thead {
|
||||
height: 48px;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
background-color: rgba(242, 244, 249, 1);
|
||||
}
|
||||
.el-calendar-table__row {
|
||||
height: 133px;
|
||||
.prev, .next {
|
||||
pointer-events: none;
|
||||
}
|
||||
.el-calendar-day {
|
||||
padding: 0 10px;
|
||||
height: 100%;
|
||||
.dateStyle {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
text-align: right;
|
||||
height: 32px;
|
||||
line-height: 28px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.team-active {// 选中班组
|
||||
border:2px solid red
|
||||
}
|
||||
.class1, .class2, .class3 {
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
margin-bottom: 2px;
|
||||
.selectDiv {
|
||||
position: relative;
|
||||
.toggle-icon {
|
||||
position: absolute;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
font-size: 14px;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.toggle-icon-hide {
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 28px;
|
||||
z-index: 1;
|
||||
}
|
||||
.el-input__suffix {
|
||||
display: none;
|
||||
}
|
||||
.el-input--suffix .el-input__inner {
|
||||
padding: 0 4px 0 28px;
|
||||
}
|
||||
.el-input--small .el-input__inner {
|
||||
height: 28px;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
.labelClass {
|
||||
width: 100%;
|
||||
height: 28px;
|
||||
border: none;
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.class1 {
|
||||
.selectDiv {
|
||||
.toggle-icon, .toggle-icon-hide {
|
||||
background-color: #FACE00;
|
||||
}
|
||||
.el-input--small .el-input__inner {
|
||||
color: #E7A200;
|
||||
background-color: #FFEFC0;
|
||||
}
|
||||
}
|
||||
.labelClass {
|
||||
color: #E7A200;
|
||||
background-color: #FFEFC0;
|
||||
}
|
||||
}
|
||||
.class2 {
|
||||
.selectDiv {
|
||||
.toggle-icon, .toggle-icon-hide {
|
||||
background-color: #3984FF;
|
||||
}
|
||||
.el-input--small .el-input__inner {
|
||||
color: #2D7BFF;
|
||||
background-color: #BEEAFF;
|
||||
}
|
||||
}
|
||||
.labelClass {
|
||||
color: #2D7BFF;
|
||||
background-color: #BEEAFF;
|
||||
}
|
||||
}
|
||||
.class3 {
|
||||
.selectDiv {
|
||||
.toggle-icon, .toggle-icon-hide {
|
||||
background-color: #37D97F;
|
||||
}
|
||||
.el-input--small .el-input__inner {
|
||||
color: #129F51;
|
||||
background-color: #E0FFEE;
|
||||
}
|
||||
}
|
||||
.labelClass {
|
||||
color: #129F51;
|
||||
background-color: #E0FFEE;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user