'init'
This commit is contained in:
421
src/views/team-manage/components/change/add-plan.vue
Normal file
421
src/views/team-manage/components/change/add-plan.vue
Normal file
@@ -0,0 +1,421 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<HeaderTitleBar />
|
||||
<el-divider content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.FillInShift")
|
||||
}}</el-divider>
|
||||
<el-form
|
||||
ref="team"
|
||||
:model="team"
|
||||
:rules="rules"
|
||||
label-width="110px"
|
||||
:class="$style.form"
|
||||
>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.LastTeamName')"
|
||||
prop="preTeamId"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-select
|
||||
v-model="team.preTeamId"
|
||||
:class="$style.select"
|
||||
filterable
|
||||
clearable
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="preTeamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in preTeamList"
|
||||
:key="index"
|
||||
:label="item.teamName"
|
||||
:value="item.teamId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PreviousTeamLeader')"
|
||||
prop="preTeamLeader"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input v-model="team.preTeamLeader" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.HandoverAdd.HandoverTeam')"
|
||||
prop="teamId"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-select
|
||||
v-model="team.teamId"
|
||||
:class="$style.select"
|
||||
filterable
|
||||
clearable
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="teamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in teamList"
|
||||
:key="index"
|
||||
:label="item.teamName"
|
||||
:value="item.teamId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.HandoverAdd.HandoverTeamLeader')"
|
||||
prop="teamLeader"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input v-model="team.teamLeader" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.HandoverAdd.PlanTeam')"
|
||||
prop="planTeamId"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input
|
||||
v-if="$route.query.disable === 'true' || $route.query.disable"
|
||||
v-model="team.planTeamName"
|
||||
:disabled="true"
|
||||
/>
|
||||
<el-select
|
||||
v-else
|
||||
v-model="team.planTeamId"
|
||||
:class="$style.select"
|
||||
filterable
|
||||
clearable
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="planTeamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in planTeamList"
|
||||
:key="index"
|
||||
:label="item.planTeamName"
|
||||
:value="item.planTeamId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.HandoverAdd.PlanTeamLeader')"
|
||||
prop="planTeamLeader"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input v-model="team.planTeamLeader" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PlanWorkingHours')"
|
||||
prop="planOnlineTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.planOnlineTime"
|
||||
type="datetime"
|
||||
:class="$style.select"
|
||||
:clearable="false"
|
||||
:disabled="true"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PlannedHandoverTime')"
|
||||
prop="planHandoverTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.planHandoverTime"
|
||||
type="datetime"
|
||||
:clearable="false"
|
||||
:class="$style.select"
|
||||
:disabled="true"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.HandoverTme')"
|
||||
prop="handoverTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.handoverTime"
|
||||
type="datetime"
|
||||
:class="$style.select"
|
||||
:clearable="false"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.WorkingHours')"
|
||||
prop="onlineTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.onlineTime"
|
||||
type="datetime"
|
||||
:clearable="false"
|
||||
:class="$style.select"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-divider v-if="false" content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.MajorSelection")
|
||||
}}</el-divider>
|
||||
<ProfessionPanel
|
||||
v-if="false"
|
||||
:id="team.id"
|
||||
:class="$style.bom"
|
||||
style="width:70%"
|
||||
@on-change="professionChange"
|
||||
/>
|
||||
<el-divider content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.SelectionOfTeamMembers")
|
||||
}}</el-divider>
|
||||
<WorkerList
|
||||
:id="team.id"
|
||||
:team-id="team.teamId"
|
||||
:plan-team-id="team.planTeamId"
|
||||
:class="$style.bom"
|
||||
style="width:70%"
|
||||
@on-change="workerChange"
|
||||
/>
|
||||
<SubmitBar
|
||||
v-if="$route.query.disable !== 'true' && !$route.query.disable"
|
||||
@on-cancle="close()"
|
||||
@on-submit="handleSubmit('team')"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { find } from 'lodash'
|
||||
import {
|
||||
add,
|
||||
getInfo,
|
||||
update,
|
||||
teamSelectList
|
||||
} from '@/api/team-manage/team.js'
|
||||
import { planTeamSelectList } from '@/api/team-manage/team-plan.js'
|
||||
import SubmitBar from '@/views/art/components/submit-bar'
|
||||
import HeaderTitleBar from '@/views/material-manage/components/header-title-bar'
|
||||
import WorkerList from '@/views/team-manage/components/change/worker-list'
|
||||
import ProfessionPanel from '@/views/team-manage/components/change/profession-panel'
|
||||
import { getInfo as getPlanInfo } from '@/api/team-manage/team-plan.js'
|
||||
export default {
|
||||
name: 'TeamAddPanel',
|
||||
components: {
|
||||
SubmitBar,
|
||||
HeaderTitleBar,
|
||||
WorkerList,
|
||||
ProfessionPanel
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
team: {
|
||||
id: null,
|
||||
handoverTime: new Date(),
|
||||
onlineTime: new Date(),
|
||||
teamId: null,
|
||||
teamLeader: '',
|
||||
preTeamId: null,
|
||||
preTeamLeader: '',
|
||||
teamWorkStatus: 1,
|
||||
|
||||
planId: null,
|
||||
planTeamId: null,
|
||||
planTeamLeader: '',
|
||||
planHandoverTime: '',
|
||||
planOnlineTime: '',
|
||||
professionIdList: [],
|
||||
workerIdList: []
|
||||
},
|
||||
rules: {
|
||||
teamId: [
|
||||
{ required: true, message: '本次班组不能为空', trigger: 'change' }
|
||||
],
|
||||
planTeamId: [
|
||||
{ required: false, message: '计划班组不能为空', trigger: 'change' }
|
||||
],
|
||||
preTeamId: [
|
||||
{ required: false, message: '上一班组不能为空', trigger: 'change' }
|
||||
],
|
||||
onlineTime: [
|
||||
{ required: true, message: '上班时间不能为空', trigger: 'blur' }
|
||||
],
|
||||
handoverTime: [
|
||||
{ required: true, message: '交接时间不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
id: null,
|
||||
preTeamList: [],
|
||||
teamList: [],
|
||||
planTeamList: []
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.id = this.$route.query.id
|
||||
const planId = this.$route.query.planId
|
||||
console.log(this.id)
|
||||
if (this.id) {
|
||||
getInfo({ id: this.id }).then(res => {
|
||||
console.log(res)
|
||||
this.team = res.data
|
||||
})
|
||||
}
|
||||
if (planId) {
|
||||
this.team.planId = planId
|
||||
getPlanInfo({ id: planId })
|
||||
.then(res => {
|
||||
console.log('planTeam====', res.data)
|
||||
const planTeam = res.data
|
||||
this.team.planTeamLeader = planTeam ? planTeam.planTeamLeader : ''
|
||||
this.team.planOnlineTime = planTeam ? planTeam.planOnlineTime : ''
|
||||
this.team.planHandoverTime = planTeam
|
||||
? planTeam.planHandoverTime
|
||||
: ''
|
||||
this.team.planId = planTeam.id
|
||||
this.team.planTeamId = planTeam.planTeamId
|
||||
this.team.preTeamLeader = planTeam
|
||||
? planTeam.planPreTeamLeader
|
||||
: ''
|
||||
this.team.preTeamId = planTeam ? planTeam.planPreTeamId : ''
|
||||
// 本次
|
||||
this.team.teamId = planTeam.planTeamId
|
||||
this.team.teamLeader = planTeam ? planTeam.planPreTeamLeader : ''
|
||||
//
|
||||
this.team.onlineTime = planTeam ? planTeam.planOnlineTime : ''
|
||||
this.team.handoverTime = planTeam ? planTeam.planHandoverTime : ''
|
||||
//
|
||||
this.team.id = planTeam.planTeamId
|
||||
return this.team
|
||||
})
|
||||
.then(() => planTeamSelectList())
|
||||
.then(res => {
|
||||
this.planTeamList = res.data
|
||||
return this.planTeamList
|
||||
})
|
||||
.then(() => teamSelectList())
|
||||
.then(res => {
|
||||
this.preTeamList = res.data
|
||||
this.teamList = res.data
|
||||
})
|
||||
} else {
|
||||
teamSelectList().then(res => {
|
||||
this.preTeamList = res.data
|
||||
this.teamList = res.data
|
||||
})
|
||||
planTeamSelectList().then(res => {
|
||||
this.planTeamList = res.data
|
||||
})
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.$router.push({ path: this.$route.query.redirect })
|
||||
},
|
||||
handleSubmit(formName) {
|
||||
console.log('handleSubmit')
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (!valid) {
|
||||
return false
|
||||
}
|
||||
console.log(this.team)
|
||||
// const { professionIdList, workerIdList } = this.team
|
||||
const { workerIdList } = this.team
|
||||
// if (professionIdList.length === 0) {
|
||||
// this.$message({
|
||||
// type: 'error',
|
||||
// message: '专业不能为空！'
|
||||
// })
|
||||
// return false
|
||||
// }
|
||||
if (workerIdList.length === 0) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '员工不能为空！'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if (this.id) {
|
||||
update(this.team).then(res => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '更新成功！'
|
||||
})
|
||||
this.close()
|
||||
})
|
||||
} else {
|
||||
this.team.id = null
|
||||
add(this.team).then(res => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '保存成功！！'
|
||||
})
|
||||
this.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
preTeamChange(val) {
|
||||
const preTeam = find(this.preTeamList, f => f.teamId === val)
|
||||
this.team.preTeamLeader = preTeam ? preTeam.teamLeader : ''
|
||||
},
|
||||
planTeamChange(val) {
|
||||
const planTeam = find(this.planTeamList, f => f.planTeamId === val)
|
||||
this.team.planTeamLeader = planTeam ? planTeam.planTeamLeader : ''
|
||||
this.team.planOnlineTime = planTeam ? planTeam.planOnlineTime : ''
|
||||
this.team.planHandoverTime = planTeam ? planTeam.planHandoverTime : ''
|
||||
this.team.planId = planTeam.id
|
||||
},
|
||||
teamChange(val) {
|
||||
console.log(val)
|
||||
const team = find(this.teamList, f => f.teamId === val)
|
||||
this.team.teamLeader = team ? team.teamLeader : ''
|
||||
console.log(this.team)
|
||||
this.team.id = team.teamId
|
||||
},
|
||||
professionChange(val) {
|
||||
this.team.professionIdList = val
|
||||
},
|
||||
workerChange(val) {
|
||||
this.team.workerIdList = val.map(m => m.workerId)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.form {
|
||||
width: 70%;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
.form-item {
|
||||
width: 50%;
|
||||
}
|
||||
.form-item-remark {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.input {
|
||||
display: flex;
|
||||
margin: 8px 16px 8px 4px;
|
||||
align-items: center;
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
.bom {
|
||||
position: relative;
|
||||
width: 98%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
107
src/views/team-manage/components/change/profession-panel.vue
Normal file
107
src/views/team-manage/components/change/profession-panel.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2021-03-05 16:34:46
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2021-03-08 11:03:18
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<el-checkbox
|
||||
v-model="checkAll"
|
||||
:indeterminate="isIndeterminate"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="handleCheckAllChange"
|
||||
>{{ $t('module.teamManager.HandoverAdd.SelectAll') }}</el-checkbox>
|
||||
<div style="margin: 15px 0;" />
|
||||
<el-checkbox-group
|
||||
v-model="checkedCities"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="handleCheckedCitiesChange"
|
||||
>
|
||||
<el-checkbox v-for="city in cities" :key="city.id" :label="city.id">{{
|
||||
city.name
|
||||
}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { professionVoList } from '@/api/team-manage/team.js'
|
||||
|
||||
export default {
|
||||
name: 'ProfessionPanel',
|
||||
components: {},
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checkAll: false,
|
||||
isIndeterminate: false,
|
||||
checkedCities: [],
|
||||
cities: [],
|
||||
params: {
|
||||
current: 1,
|
||||
size: 100
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
id: {
|
||||
handler(val) {
|
||||
this.init(val)
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
async init(id) {
|
||||
console.log('id', id)
|
||||
const citiesRes = await professionVoList({ ...this.params, id: id || this.$route.query.id })
|
||||
this.cities = citiesRes.data
|
||||
if (id || this.$route.query.id) {
|
||||
this.checkedCities = this.cities.filter(f => f.checked).map(m => m.id)
|
||||
this.checkAll = this.checkedCities.length === this.cities.length
|
||||
console.log(this.checkedCities)
|
||||
}
|
||||
},
|
||||
handleCheckAllChange(val) {
|
||||
console.log(val)
|
||||
this.checkedCities = val ? this.cities.map(m => m.id) : []
|
||||
this.isIndeterminate = false
|
||||
this.$emit('on-change', this.checkedCities)
|
||||
},
|
||||
handleCheckedCitiesChange(value) {
|
||||
console.log(value)
|
||||
const checkedCount = value.length
|
||||
this.checkAll = checkedCount === this.cities.length
|
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length
|
||||
this.$emit('on-change', this.checkedCities)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
.input {
|
||||
display: flex;
|
||||
margin: 8px 16px 8px 4px;
|
||||
align-items: center;
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
161
src/views/team-manage/components/change/worker-list.vue
Normal file
161
src/views/team-manage/components/change/worker-list.vue
Normal file
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<SearchBar
|
||||
v-if="false"
|
||||
:placeholder="$t('module.teamManager.HandoverAdd.Placeholder')"
|
||||
@on-search="handleSearch"
|
||||
/>
|
||||
<el-table
|
||||
ref="mainTable"
|
||||
:data="tableDataList"
|
||||
:class="$style.table"
|
||||
:stripe="true"
|
||||
:header-cell-style="{background:'#eef1f6',color:'#606266',height: '56px', textAlign: 'center'}"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
size="mini"
|
||||
:selectable="isDisabled"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column
|
||||
prop="index"
|
||||
:label="$t('module.teamManager.Handover.index')"
|
||||
width="80"
|
||||
fixed="left"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="workerName"
|
||||
:label="$t('module.teamManager.HandoverAdd.planWorkerName')"
|
||||
width="180"
|
||||
fixed="left"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="professionName"
|
||||
:label="$t('module.teamManager.HandoverAdd.planProfessionName')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="telephone"
|
||||
:label="$t('module.teamManager.HandoverAdd.telephone')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="workshop"
|
||||
:label="$t('module.teamManager.HandoverAdd.workshop')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="onDuty"
|
||||
:label="$t('module.teamManager.HandoverAdd.onDuty')"
|
||||
width="80"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.onDuty === 1" type="success">
|
||||
在岗
|
||||
</el-tag>
|
||||
<el-tag v-else type="info">
|
||||
离岗
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { workerVoList } from '@/api/team-manage/team.js'
|
||||
import SearchBar from '@/views/art/components/search-bar'
|
||||
export default {
|
||||
components: { SearchBar },
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
teamId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
planTeamId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
moment,
|
||||
isEdit: false,
|
||||
tableDataList: [],
|
||||
page: {
|
||||
current: 1,
|
||||
size: 2
|
||||
},
|
||||
addDialogVisible: false,
|
||||
param: {},
|
||||
multipleSelection: [],
|
||||
disable: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
id: {
|
||||
handler(val) {
|
||||
this.handleSearch()
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.disable = this.$route.query.disable === 'true'
|
||||
this.handleSearch()
|
||||
},
|
||||
methods: {
|
||||
isDisabled() {
|
||||
return this.$route.query.disable === 'true'
|
||||
},
|
||||
handleSearch(param) {
|
||||
this.param = param
|
||||
console.log(param)
|
||||
const params = {
|
||||
id: this.id,
|
||||
teamId: this.teamId,
|
||||
planTeamId: this.planTeamId,
|
||||
...param,
|
||||
...this.page
|
||||
}
|
||||
workerVoList(params).then(res => {
|
||||
console.log(res)
|
||||
if (!res.data) {
|
||||
this.tableDataList = []
|
||||
return
|
||||
}
|
||||
this.tableDataList = res.data.map((m, index) => ({
|
||||
...m,
|
||||
index: this.page.size * (this.page.current - 1) + index + 1
|
||||
}))
|
||||
const multipleSelection = this.tableDataList.filter(f => f.checked)
|
||||
console.log(multipleSelection)
|
||||
if (!this.id) {
|
||||
return
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
multipleSelection.forEach(e =>
|
||||
this.$refs.mainTable.toggleRowSelection(e)
|
||||
)
|
||||
})
|
||||
})
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
console.log(val)
|
||||
this.multipleSelection = val
|
||||
this.$emit('on-change', this.multipleSelection)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
.table {
|
||||
margin: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
59
src/views/team-manage/components/offline/offline-drawer.vue
Normal file
59
src/views/team-manage/components/offline/offline-drawer.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
:title="$t('module.teamManager.HandoverDrawer.title')"
|
||||
size="85%"
|
||||
:append-to-body="true"
|
||||
:visible.sync="visible"
|
||||
:wrapper-closable="false"
|
||||
:before-close="() => $emit('on-close')"
|
||||
>
|
||||
<OfflineEdit :team="team" />
|
||||
<el-divider content-position="left">【{{ team ? team.teamName :'' }}】{{ $t('module.teamManager.HandoverDrawer.TeamCommutingRecord') }}</el-divider>
|
||||
<TeamList
|
||||
:class="$style['team-list']"
|
||||
:team-id="team ? team.teamId : null"
|
||||
/>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TeamList from './team-list.vue'
|
||||
import OfflineEdit from './offline-edit.vue'
|
||||
|
||||
export default {
|
||||
name: 'OfflineDrawer',
|
||||
components: { TeamList, OfflineEdit },
|
||||
props: {
|
||||
team: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
},
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isEdit: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
editSuccess() {
|
||||
this.innerDrawer = true
|
||||
},
|
||||
handleSubmit() {
|
||||
this.isEdit = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.team-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 30px;
|
||||
}
|
||||
</style>
|
||||
110
src/views/team-manage/components/offline/offline-edit.vue
Normal file
110
src/views/team-manage/components/offline/offline-edit.vue
Normal file
@@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<el-form
|
||||
ref="teamUpdate"
|
||||
:class="$style.form"
|
||||
:model="teamUpdate"
|
||||
:rules="rules"
|
||||
label-width="100px"
|
||||
>
|
||||
<el-form-item :label="$t('module.teamManager.Handover.TeamName')" prop="teamName">
|
||||
<span :class="$style.label">{{ team.teamName || '-' }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.Handover.TeamLeader')" prop="teamLeader">
|
||||
<span :class="$style.label">{{ team.teamLeader || '-' }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.Handover.WorkingHours')" prop="onlineTime">
|
||||
<el-date-picker
|
||||
v-model="teamUpdate.onlineTime"
|
||||
style="width:210px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.Handover.OffWorkTime')" prop="offlineTime">
|
||||
<el-date-picker
|
||||
v-model="teamUpdate.offlineTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="width:210px"
|
||||
type="datetime"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="" prop="">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
icon="el-icon-success"
|
||||
@click="handleSubmit()"
|
||||
>
|
||||
{{ 'btn.save' | i18nFilter }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { offlineUpdate } from '@/api/team-manage/team.js'
|
||||
|
||||
export default {
|
||||
name: 'OfflineEdit',
|
||||
components: {},
|
||||
props: {
|
||||
team: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
teamUpdate: {
|
||||
offlineTime: moment(this.team.offlineTime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
onlineTime: moment(this.team.onlineTime).format('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
rules: {
|
||||
onlineTime: [
|
||||
{ required: true, message: '上班时间不能为空', trigger: 'blur' }
|
||||
],
|
||||
offlineTime: [
|
||||
{ required: true, message: '下班时间不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit() {
|
||||
this.$refs['teamUpdate'].validate((valid) => {
|
||||
if (!valid) {
|
||||
return false
|
||||
}
|
||||
const param = {
|
||||
id: this.team.id,
|
||||
teamId: this.team.teamId,
|
||||
offlineTime: moment.utc(this.teamUpdate.offlineTime),
|
||||
onlineTime: moment.utc(this.teamUpdate.onlineTime)
|
||||
}
|
||||
console.log(param)
|
||||
offlineUpdate(param).then(res => {
|
||||
console.log(res)
|
||||
this.$message.success('保存成功！')
|
||||
this.$bus.emit('on-offline-edit-success')
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
margin-bottom: 30px;
|
||||
.form {
|
||||
display: flex;
|
||||
.label {
|
||||
display: inline-block;
|
||||
min-width: 100px;
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
100
src/views/team-manage/components/offline/offline-search-bar.vue
Normal file
100
src/views/team-manage/components/offline/offline-search-bar.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<span :class="$style['label-name']">{{ $t('module.teamManager.HandoverDrawer.OffHours') }}</span>
|
||||
<el-date-picker
|
||||
v-model="dts"
|
||||
type="datetimerange"
|
||||
style="margin-right:16px;"
|
||||
align="right"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
unlink-panels
|
||||
:start-placeholder="$t('module.basicData.ScrapInfo.StartTime')"
|
||||
:end-placeholder="$t('module.basicData.ScrapInfo.EndTime')"
|
||||
:range-separator="$t('module.basicData.ScrapInfo.To')"
|
||||
:picker-options="pickerOptions"
|
||||
/>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch()">
|
||||
{{ 'btn.search' | i18nFilter }}
|
||||
</el-button>
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
lableName: {
|
||||
type: String,
|
||||
default: '关键字'
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请输入'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
keywords: '',
|
||||
dts: ['', ''],
|
||||
pickerOptions: {
|
||||
shortcuts: [{
|
||||
text: '最近一周',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近一个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近三个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$bus.on('on-offline-edit-success', this.handleSearch)
|
||||
this.handleSearch()
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$bus.off('on-offline-edit-success', this.handleSearch)
|
||||
},
|
||||
methods: {
|
||||
handleSearch() {
|
||||
const param = {
|
||||
offlineBegTime: moment.utc(this.dts[0]),
|
||||
offlineEndTime: moment.utc(this.dts[1])
|
||||
}
|
||||
this.$emit('on-search', param)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
padding: 4px 40px;
|
||||
background-color: #eee;
|
||||
.label-name {
|
||||
margin-right: 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
108
src/views/team-manage/components/offline/team-list.vue
Normal file
108
src/views/team-manage/components/offline/team-list.vue
Normal file
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<OfflineSearchBar :placeholder="'班组名称或班组长'" @on-search="handleSearch" />
|
||||
<el-table
|
||||
:data="workList"
|
||||
:class="$style.table"
|
||||
:stripe="true"
|
||||
:header-cell-style="{background:'#eef1f6',color:'#606266',height: '56px', textAlign: 'center'}"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
size="medium"
|
||||
>
|
||||
<el-table-column prop="index" :label="$t('module.teamManager.Handover.index')" width="80" fixed />
|
||||
<el-table-column prop="teamName" :label="$t('module.teamManager.Handover.TeamName')" width="180" fixed />
|
||||
<el-table-column prop="handoverTime" :label="$t('module.teamManager.Handover.HandoverTme')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.handoverTime && moment(scope.row.handoverTime).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teamLeader" :label="$t('module.teamManager.Handover.TeamLeader')" width="180" />
|
||||
<el-table-column prop="onlineTime" :label="$t('module.teamManager.Handover.WorkingHours')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.onlineTime && moment(scope.row.onlineTime).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="offlineTime" :label="$t('module.teamManager.Handover.OffWorkTime')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.offlineTime && moment(scope.row.offlineTime).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="preTeamName" :label="$t('module.teamManager.Handover.LastTeamName')" width="180" />
|
||||
<el-table-column prop="preTeamLeader" :label="$t('module.teamManager.Handover.PreviousTeamLeader')" width="180" />
|
||||
</el-table>
|
||||
<el-pagination
|
||||
v-show="page.total > page.size"
|
||||
:class="$style.table"
|
||||
:current-page="page.current"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:page-size="page.size"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="page.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { list } from '@/api/team-manage/team.js'
|
||||
import OfflineSearchBar from './offline-search-bar'
|
||||
export default {
|
||||
components: { OfflineSearchBar },
|
||||
props: {
|
||||
teamId: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
moment,
|
||||
isEdit: false,
|
||||
workList: [],
|
||||
page: {
|
||||
total: 40,
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
param: {}
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
handleSearch(param) {
|
||||
this.param = param
|
||||
console.log(param)
|
||||
list({ ...param, ...this.page, teamId: Number(this.teamId), teamWorkStatus: 0 }).then(res => {
|
||||
console.log(res)
|
||||
this.page.total = res.data.total
|
||||
if (!res.data.records) {
|
||||
this.workList = []
|
||||
return
|
||||
}
|
||||
this.workList = res.data.records.map((m, index) => ({
|
||||
...m,
|
||||
index: this.page.size * (this.page.current - 1) + index + 1
|
||||
}))
|
||||
})
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`)
|
||||
this.page.size = val
|
||||
this.handleSearch(this.param)
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`)
|
||||
this.page.current = val
|
||||
this.handleSearch(this.param)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
.table {
|
||||
margin: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
339
src/views/team-manage/components/plan/add-plan.vue
Normal file
339
src/views/team-manage/components/plan/add-plan.vue
Normal file
@@ -0,0 +1,339 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<HeaderTitleBar />
|
||||
<el-divider content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.TeamPlanFill")
|
||||
}}</el-divider>
|
||||
<el-form
|
||||
ref="team"
|
||||
:model="team"
|
||||
:rules="rules"
|
||||
label-width="110px"
|
||||
:class="$style.form"
|
||||
>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.LastTeamName')"
|
||||
prop="planPreTeamId"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-select
|
||||
v-model="team.planPreTeamId"
|
||||
:class="$style.select"
|
||||
filterable
|
||||
clearable
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="preTeamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in preTeamList"
|
||||
:key="index"
|
||||
:label="item.planTeamName"
|
||||
:value="item.planTeamId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PreviousTeamLeader')"
|
||||
prop="planPreTeamLeader"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input v-model="team.planPreTeamLeader" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.TeamName')"
|
||||
prop="planTeamId"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-select
|
||||
v-model="team.planTeamId"
|
||||
:class="$style.select"
|
||||
filterable
|
||||
clearable
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="teamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in teamList"
|
||||
:key="index"
|
||||
:label="item.planTeamName"
|
||||
:value="item.planTeamId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.TeamLeader')"
|
||||
prop="planTeamLeader"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-input v-model="team.planTeamLeader" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PlanWorkingHours')"
|
||||
prop="planOnlineTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.planOnlineTime"
|
||||
type="datetime"
|
||||
:class="$style.select"
|
||||
:clearable="false"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.PlannedHandoverTime')"
|
||||
prop="planHandoverTime"
|
||||
:class="$style['form-item']"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="team.planHandoverTime"
|
||||
type="datetime"
|
||||
:clearable="false"
|
||||
:class="$style.select"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.teamManager.Handover.Remark')"
|
||||
prop="remark"
|
||||
:class="$style['form-item-remark']"
|
||||
>
|
||||
<el-input
|
||||
v-model="team.remark"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-divider v-if="false" content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.MajorSelection")
|
||||
}}</el-divider>
|
||||
<ProfessionPanel
|
||||
v-if="false"
|
||||
:id="team.planId"
|
||||
:class="$style.bom"
|
||||
style="width:70%"
|
||||
@on-change="professionChange"
|
||||
/>
|
||||
<el-divider content-position="left">{{
|
||||
$t("module.teamManager.HandoverAdd.SelectionOfTeamMembers")
|
||||
}}</el-divider>
|
||||
<WorkerList
|
||||
:id="team.planTeamId"
|
||||
:class="$style.bom"
|
||||
style="width:70%"
|
||||
@on-change="workerChange"
|
||||
/>
|
||||
<SubmitBar
|
||||
v-if="$route.query.disable !== 'true' && !$route.query.disable"
|
||||
@on-cancle="close()"
|
||||
@on-submit="handleSubmit('team')"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { find } from 'lodash'
|
||||
import {
|
||||
add,
|
||||
getInfo,
|
||||
update,
|
||||
planTeamSelectListNew
|
||||
} from '@/api/team-manage/team-plan.js'
|
||||
import SubmitBar from '@/views/art/components/submit-bar'
|
||||
import HeaderTitleBar from '@/views/material-manage/components/header-title-bar'
|
||||
import WorkerList from '@/views/team-manage/components/plan/worker-list'
|
||||
import ProfessionPanel from '@/views/team-manage/components/plan/profession-panel'
|
||||
|
||||
export default {
|
||||
name: 'Team',
|
||||
components: {
|
||||
SubmitBar,
|
||||
HeaderTitleBar,
|
||||
WorkerList,
|
||||
ProfessionPanel
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
team: {
|
||||
planPreTeamId: null,
|
||||
planTeamId: null,
|
||||
planWorkerIdList: [],
|
||||
planProfessionIdList: [],
|
||||
id: null,
|
||||
planId: null,
|
||||
remark: '',
|
||||
name: '',
|
||||
planOnlineTime: new Date(),
|
||||
planHandoverTime: new Date(),
|
||||
planTeamLeader: '',
|
||||
planPreTeamLeader: ''
|
||||
},
|
||||
rules: {
|
||||
planTeamId: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm([
|
||||
'placeholder.input',
|
||||
this.$t('module.teamManager.Handover.TeamName')
|
||||
]),
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
planPreTeamId: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm([
|
||||
'placeholder.input',
|
||||
this.$t('module.teamManager.Handover.LastTeamName')
|
||||
]),
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
planOnlineTime: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm([
|
||||
'placeholder.input',
|
||||
this.$t('module.teamManager.Handover.PlanWorkingHours')
|
||||
]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
planHandoverTime: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm([
|
||||
'placeholder.input',
|
||||
this.$t('module.teamManager.Handover.PlannedHandoverTime')
|
||||
]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
},
|
||||
id: null,
|
||||
preTeamList: [],
|
||||
teamList: []
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.id = this.$route.query.id
|
||||
console.log(this.id)
|
||||
if (this.id) {
|
||||
getInfo({ id: this.id }).then(res => {
|
||||
console.log(res)
|
||||
this.team = res.data
|
||||
})
|
||||
}
|
||||
planTeamSelectListNew().then(res => {
|
||||
this.preTeamList = res.data
|
||||
this.teamList = res.data
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.$router.push({ path: this.$route.query.redirect })
|
||||
},
|
||||
handleSubmit(formName) {
|
||||
console.log('handleSubmit')
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (!valid) {
|
||||
return false
|
||||
}
|
||||
console.log(this.team)
|
||||
// const { planProfessionIdList, planWorkerIdList } = this.team
|
||||
const { planWorkerIdList } = this.team
|
||||
// if (planProfessionIdList.length === 0) {
|
||||
// this.$message({
|
||||
// type: 'error',
|
||||
// message: '专业不能为空！'
|
||||
// })
|
||||
// return false
|
||||
// }
|
||||
if (planWorkerIdList.length === 0) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '员工不能为空！'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if (this.id) {
|
||||
update(this.team).then(res => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '更新成功！'
|
||||
})
|
||||
this.close()
|
||||
})
|
||||
} else {
|
||||
this.team.id = null
|
||||
add(this.team).then(res => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '保存成功！！'
|
||||
})
|
||||
this.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
preTeamChange(val) {
|
||||
const preTeam = find(this.preTeamList, f => f.planTeamId === val)
|
||||
this.team.planPreTeamLeader = preTeam ? preTeam.planTeamLeader : ''
|
||||
},
|
||||
teamChange(val) {
|
||||
console.log(val)
|
||||
const team = find(this.teamList, f => f.planTeamId === val)
|
||||
this.team.planTeamLeader = team ? team.planTeamLeader : ''
|
||||
console.log(' team.planTeamId', team.planTeamId)
|
||||
this.team.planTeamId = team.planTeamId
|
||||
this.team.planId = val
|
||||
},
|
||||
professionChange(val) {
|
||||
this.team.planProfessionIdList = val
|
||||
},
|
||||
workerChange(val) {
|
||||
this.team.planWorkerIdList = val.map(m => m.planWorkerId)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.form {
|
||||
width: 70%;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
.form-item {
|
||||
width: 50%;
|
||||
}
|
||||
.form-item-remark {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.input {
|
||||
display: flex;
|
||||
margin: 8px 16px 8px 4px;
|
||||
align-items: center;
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
.bom {
|
||||
position: relative;
|
||||
width: 98%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
105
src/views/team-manage/components/plan/profession-panel.vue
Normal file
105
src/views/team-manage/components/plan/profession-panel.vue
Normal file
@@ -0,0 +1,105 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2021-03-05 16:34:46
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2021-03-08 11:03:41
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<el-checkbox
|
||||
v-model="checkAll"
|
||||
:indeterminate="isIndeterminate"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="handleCheckAllChange"
|
||||
>{{ $t('module.teamManager.HandoverAdd.SelectAll') }}</el-checkbox>
|
||||
<div style="margin: 15px 0;" />
|
||||
<el-checkbox-group
|
||||
v-model="checkedCities"
|
||||
:disabled="$route.query.disable === 'true' || $route.query.disable"
|
||||
@change="handleCheckedCitiesChange"
|
||||
>
|
||||
<el-checkbox v-for="city in cities" :key="city.id" :label="city.id">{{
|
||||
city.name
|
||||
}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { planProfessionVoList } from '@/api/team-manage/team-plan.js'
|
||||
|
||||
export default {
|
||||
name: 'ProfessionPanel',
|
||||
components: {},
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
disable: false,
|
||||
checkAll: false,
|
||||
isIndeterminate: false,
|
||||
checkedCities: [],
|
||||
cities: [],
|
||||
params: {
|
||||
planId: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
id(val) {
|
||||
this.init(val)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async init(val) {
|
||||
const citiesRes = await planProfessionVoList({
|
||||
planId: val || this.$route.query.id
|
||||
})
|
||||
console.log(citiesRes)
|
||||
this.cities = citiesRes.data
|
||||
if (val || this.$route.query.id) {
|
||||
this.checkedCities = this.cities.filter(f => f.checked).map(m => m.id)
|
||||
this.checkAll = this.checkedCities.length === this.cities.length
|
||||
console.log('this.checkedCities', this.checkedCities)
|
||||
this.$emit('on-change', this.checkedCities)
|
||||
}
|
||||
},
|
||||
handleCheckAllChange(val) {
|
||||
console.log(val)
|
||||
this.checkedCities = val ? this.cities.map(m => m.id) : []
|
||||
this.isIndeterminate = false
|
||||
this.$emit('on-change', this.checkedCities)
|
||||
},
|
||||
handleCheckedCitiesChange(value) {
|
||||
console.log(value)
|
||||
const checkedCount = value.length
|
||||
this.checkAll = checkedCount === this.cities.length
|
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length
|
||||
this.$emit('on-change', this.checkedCities)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
.input {
|
||||
display: flex;
|
||||
margin: 8px 16px 8px 4px;
|
||||
align-items: center;
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
126
src/views/team-manage/components/plan/worker-list.vue
Normal file
126
src/views/team-manage/components/plan/worker-list.vue
Normal file
@@ -0,0 +1,126 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<SearchBar v-if="false" :placeholder="$t('module.teamManager.HandoverAdd.Placeholder')" @on-search="handleSearch" />
|
||||
<el-table
|
||||
ref="mainTable"
|
||||
:data="tableDataList"
|
||||
:class="$style.table"
|
||||
:stripe="true"
|
||||
:header-cell-style="{background:'#eef1f6',color:'#606266',height: '56px', textAlign: 'center'}"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
size="mini"
|
||||
:selectable="isDisabled"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column prop="index" :label="$t('module.teamManager.Handover.index')" width="80" fixed="left" />
|
||||
<el-table-column prop="planWorkerName" :label="$t('module.teamManager.HandoverAdd.planWorkerName')" width="180" fixed="left" />
|
||||
<el-table-column prop="planProfessionName" :label="$t('module.teamManager.HandoverAdd.planProfessionName')" width="180" />
|
||||
<el-table-column prop="telephone" :label="$t('module.teamManager.HandoverAdd.telephone')" width="180" />
|
||||
<el-table-column prop="workshop" :label="$t('module.teamManager.HandoverAdd.workshop')" width="180" />
|
||||
<el-table-column prop="onDuty" :label="$t('module.teamManager.HandoverAdd.onDuty')" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.onDuty === 1" type="success">
|
||||
在岗
|
||||
</el-tag>
|
||||
<el-tag v-else type="info">
|
||||
离岗
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { planWorkerVoList } from '@/api/team-manage/team-plan.js'
|
||||
|
||||
import SearchBar from '@/views/art/components/search-bar'
|
||||
export default {
|
||||
components: { SearchBar },
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
moment,
|
||||
isEdit: false,
|
||||
tableDataList: [],
|
||||
page: {
|
||||
current: 1,
|
||||
size: 2
|
||||
},
|
||||
addDialogVisible: false,
|
||||
param: {},
|
||||
multipleSelection: [],
|
||||
disable: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
id(val) {
|
||||
this.handleSearch()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.disable = this.$route.query.disable === 'true' || this.$route.query.disable
|
||||
},
|
||||
methods: {
|
||||
isDisabled(row, rowIndex) {
|
||||
if (row.status === 1) {
|
||||
return true // 不禁用
|
||||
} else {
|
||||
return false // 不禁用
|
||||
}
|
||||
},
|
||||
handleSearch(param) {
|
||||
this.param = param
|
||||
console.log(param)
|
||||
const params = {
|
||||
enabled: 1,
|
||||
planId: this.$route.query.id,
|
||||
planTeamId: this.id,
|
||||
...param,
|
||||
...this.page
|
||||
}
|
||||
planWorkerVoList(params).then(res => {
|
||||
console.log(res)
|
||||
if (!res.data) {
|
||||
this.tableDataList = []
|
||||
return
|
||||
}
|
||||
this.tableDataList = res.data.map((m, index) => ({
|
||||
...m,
|
||||
index: this.page.size * (this.page.current - 1) + index + 1
|
||||
}))
|
||||
const multipleSelection = this.tableDataList.filter(f => f.checked)
|
||||
console.log(multipleSelection)
|
||||
if (!this.id) {
|
||||
return
|
||||
}
|
||||
this.$emit('on-change', this.multipleSelection)
|
||||
this.$nextTick(() => {
|
||||
multipleSelection.forEach(e =>
|
||||
this.$refs.mainTable.toggleRowSelection(e)
|
||||
)
|
||||
})
|
||||
})
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
if (this.$route.query.disable) { return }
|
||||
console.log(val)
|
||||
this.multipleSelection = val
|
||||
this.$emit('on-change', this.multipleSelection)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
.table {
|
||||
margin: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
139
src/views/team-manage/components/search-bar.vue
Normal file
139
src/views/team-manage/components/search-bar.vue
Normal file
@@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<span :class="$style['label-name']">{{ $t('module.teamManager.Handover.Keyword') }}</span>
|
||||
<el-input
|
||||
v-model="keywords"
|
||||
:placeholder="placeholder"
|
||||
:clearable="true"
|
||||
style="width:150px;max-width:100%;margin-right:16px;"
|
||||
/>
|
||||
<span :class="$style['label-name']">{{ $t('module.teamManager.Handover.'+handoverTme) }}</span>
|
||||
<el-date-picker
|
||||
v-model="dts"
|
||||
type="datetimerange"
|
||||
style="margin-right:16px;"
|
||||
align="right"
|
||||
unlink-panels
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
:start-placeholder="$t('module.basicData.ScrapInfo.StartTime')"
|
||||
:end-placeholder="$t('module.basicData.ScrapInfo.EndTime')"
|
||||
:range-separator="$t('module.basicData.ScrapInfo.To')"
|
||||
:picker-options="pickerOptions"
|
||||
/>
|
||||
<span :class="$style['label-name']">{{ $t('module.teamManager.Handover.HandoverStatus') }}</span>
|
||||
<el-select
|
||||
v-model="handoverStatus"
|
||||
style="margin-right:16px;"
|
||||
filterable
|
||||
clearable
|
||||
>
|
||||
<el-option
|
||||
v-for="item in workStatusOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch()">
|
||||
{{ 'btn.search' | i18nFilter }}
|
||||
</el-button>
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
lableName: {
|
||||
type: String,
|
||||
default: '关键字'
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请输入'
|
||||
},
|
||||
handoverTme: {
|
||||
type: String,
|
||||
default: 'HandoverTme'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
keywords: '',
|
||||
dts: ['', ''],
|
||||
pickerOptions: {
|
||||
shortcuts: [{
|
||||
text: '最近一周',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近一个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}, {
|
||||
text: '最近三个月',
|
||||
onClick(picker) {
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||
picker.$emit('pick', [start, end])
|
||||
}
|
||||
}]
|
||||
},
|
||||
handoverStatus: null,
|
||||
workStatusOptions: [{
|
||||
value: null,
|
||||
label: '全部'
|
||||
},
|
||||
{
|
||||
value: 0,
|
||||
label: '已下班'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
label: '工作中'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSearch() {
|
||||
console.log(this.dts)
|
||||
const param = {
|
||||
keyWords: this.keywords,
|
||||
keywords: this.keywords,
|
||||
handoverBegTime: this.dts ? moment.utc(this.dts[0]) : null,
|
||||
handoverEndTime: this.dts ? moment.utc(this.dts[1]) : null,
|
||||
planHandoverBegTime: this.dts ? moment.utc(this.dts[0]) : null,
|
||||
planHandoverEndTime: this.dts ? moment.utc(this.dts[1]) : null,
|
||||
handoverStatus: this.handoverStatus,
|
||||
teamWorkStatus: this.handoverStatus
|
||||
}
|
||||
this.$emit('on-search', param)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
padding: 4px 40px;
|
||||
background-color: #eee;
|
||||
.label-name {
|
||||
margin-right: 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
13
src/views/team-manage/index.vue
Normal file
13
src/views/team-manage/index.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<!--
|
||||
* @Author: gtz
|
||||
* @Date: 2021-03-08 11:34:17
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-03-08 11:40:37
|
||||
* @Description: file content
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div id="factory">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
241
src/views/team-manage/list.vue
Normal file
241
src/views/team-manage/list.vue
Normal file
@@ -0,0 +1,241 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<SearchBar :placeholder="$t('module.teamManager.Handover.Placeholder')" @on-search="handleSearch">
|
||||
<el-button type="success" icon="el-icon-plus" @click="handleAdd()">
|
||||
{{ "btn.add" | i18nFilter }}
|
||||
</el-button>
|
||||
</SearchBar>
|
||||
<el-table
|
||||
:data="workList"
|
||||
:class="$style.table"
|
||||
:stripe="true"
|
||||
:header-cell-style="{background:'#eef1f6',color:'#606266',height: '56px', textAlign: 'center'}"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
size="medium"
|
||||
>
|
||||
<el-table-column prop="index" :label="$t('module.teamManager.Handover.index')" width="80" fixed />
|
||||
<el-table-column prop="teamName" :label="$t('module.teamManager.Handover.TeamName')" width="180" fixed />
|
||||
<el-table-column prop="handoverTime" :label="$t('module.teamManager.Handover.HandoverTme')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.handoverTime && moment(scope.row.handoverTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teamLeader" :label="$t('module.teamManager.Handover.TeamLeader')" width="180" />
|
||||
<el-table-column prop="onlineTime" :label="$t('module.teamManager.Handover.WorkingHours')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.onlineTime && moment(scope.row.onlineTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="offlineTime" :label="$t('module.teamManager.Handover.OffWorkTime')" width="180">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.offlineTime && moment(scope.row.offlineTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="preTeamName" :label="$t('module.teamManager.Handover.LastTeamName')" width="180" />
|
||||
<el-table-column prop="preTeamLeader" :label="$t('module.teamManager.Handover.PreviousTeamLeader')" width="180" />
|
||||
<el-table-column prop="teamWorkStatus" :label="$t('module.teamManager.Handover.TeamWorkStatus')" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.teamWorkStatus === 1" type="success">
|
||||
工作中
|
||||
</el-tag>
|
||||
<el-tag v-else type="info">
|
||||
已下班
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('module.teamManager.Handover.Detail')" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleEdit(scope.row.id, true)">{{
|
||||
"btn.detail" | i18nFilter
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('module.teamManager.Handover.Operation')" width="280" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.row.teamWorkStatus === 1"
|
||||
size="mini"
|
||||
type="info"
|
||||
icon="el-icon-edit"
|
||||
@click="handleOffline(scope.row)"
|
||||
>
|
||||
{{ "btn.goOffWork" | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button
|
||||
type="info"
|
||||
size="mini"
|
||||
icon="el-icon-edit"
|
||||
@click="handleShow(scope.row.id)"
|
||||
>
|
||||
{{ "btn.log" | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row.id)"
|
||||
>
|
||||
{{ "btn.delete" | i18nFilter }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
background
|
||||
:hide-on-single-page="false"
|
||||
:class="$style.table"
|
||||
:current-page="page.current"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:page-size="page.size"
|
||||
layout="total, sizes, prev, pager, next"
|
||||
:total="page.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
<OfflineDrawer
|
||||
:team="currentTeam"
|
||||
:class="$style.dialog"
|
||||
:visible="offlineDrawerVisible"
|
||||
@on-close="offlineDrawerClose()"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { list, del } from '@/api/team-manage/team.js'
|
||||
import SearchBar from '@/views/team-manage/components/search-bar'
|
||||
import OfflineDrawer from '@/views/team-manage/components/offline/offline-drawer'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: { SearchBar, OfflineDrawer },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
moment,
|
||||
isEdit: false,
|
||||
workList: [],
|
||||
page: {
|
||||
total: 0,
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
offlineDrawerVisible: false,
|
||||
param: {},
|
||||
currentTeam: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$bus.on('on-offline-edit-success', this.offlineDrawerClose)
|
||||
this.handleSearch()
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$bus.off('on-offline-edit-success', this.offlineDrawerClose)
|
||||
},
|
||||
methods: {
|
||||
handleShow(id) {
|
||||
this.$router.push({
|
||||
path: 'showlog',
|
||||
query: {
|
||||
id
|
||||
}
|
||||
})
|
||||
},
|
||||
handleSearch(param) {
|
||||
this.param = param
|
||||
console.log(param)
|
||||
list({ ...param, ...this.page }).then(res => {
|
||||
console.log(res)
|
||||
this.page.total = res.data.total
|
||||
if (!res.data.records) {
|
||||
this.workList = []
|
||||
return
|
||||
}
|
||||
this.workList = res.data.records.map((m, index) => ({
|
||||
...m,
|
||||
index: this.page.size * (this.page.current - 1) + index + 1
|
||||
}))
|
||||
})
|
||||
},
|
||||
handleAdd() {
|
||||
this.$router.push({
|
||||
path: 'team/add',
|
||||
query: {
|
||||
redirect: '/team-manage/list',
|
||||
title: '班组计划新增'
|
||||
}
|
||||
})
|
||||
},
|
||||
handleEdit(id, disable) {
|
||||
this.$router.push({
|
||||
path: 'team/add',
|
||||
query: {
|
||||
redirect: '/team-manage/list',
|
||||
title: '班组计划详情',
|
||||
id,
|
||||
disable
|
||||
}
|
||||
})
|
||||
},
|
||||
handleOffline(team) {
|
||||
this.offlineDrawerVisible = true
|
||||
this.currentTeam = team
|
||||
this.isEdit = true
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`)
|
||||
this.page.size = val
|
||||
this.handleSearch(this.param)
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`)
|
||||
this.page.current = val
|
||||
this.handleSearch(this.param)
|
||||
},
|
||||
handleDelete(id) {
|
||||
this.$confirm(`${this.$t('module.teamManager.Handover.alertListContent')}`,
|
||||
`${this.$t('module.teamManager.Handover.alertTitle')}`, {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
del({ id }).then(res => {
|
||||
this.handleSearch(this.param)
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
})
|
||||
}).catch(() => {
|
||||
// this.$message({
|
||||
// type: 'info',
|
||||
// message: '已取消删除'
|
||||
// })
|
||||
})
|
||||
// this.$alert(`${this.$t('module.teamManager.Handover.alertListContent')}`, `${this.$t('module.teamManager.Handover.alertTitle')}`, {
|
||||
// confirmButtonText: i18n.t('btn.confirm'),
|
||||
// callback: action => {
|
||||
// del({ id }).then(res => {
|
||||
// this.handleSearch(this.param)
|
||||
// this.$message({
|
||||
// type: 'info',
|
||||
// message: i18n.t('deleteMsgBox.doneMsg')
|
||||
// })
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
},
|
||||
offlineDrawerClose() {
|
||||
this.handleSearch()
|
||||
this.offlineDrawerVisible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
.table {
|
||||
margin: 16px;
|
||||
width: 98.5%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
161
src/views/team-manage/log-add.vue
Normal file
161
src/views/team-manage/log-add.vue
Normal file
@@ -0,0 +1,161 @@
|
||||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-07-14 10:24:51
|
||||
* @LastEditTime: 2021-07-14 14:17:07
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \mt-bus-fe\src\views\team-manage\log-add.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
|
||||
:close-on-click-modal="false"
|
||||
:visible.sync="visible"
|
||||
@close="onClose"
|
||||
>
|
||||
<el-row :gutter="15" style="padding: 0 20px;">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
size="medium"
|
||||
label-width="100px"
|
||||
label-position="right"
|
||||
:rules="rules"
|
||||
>
|
||||
<el-form-item :label="$t('module.teamManager.showLog.title')" prop="remark">
|
||||
<el-input v-model="dataForm.remark" :placeholder="$i18nForm(['placeholder.input', $t('module.teamManager.showLog.title')])" :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.showLog.content')" prop="content">
|
||||
<el-input v-model="dataForm.content" type="textarea" :rows="2" :placeholder="$i18nForm(['placeholder.input', $t('module.teamManager.showLog.content')])" :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.showLog.type')" prop="type">
|
||||
<template>
|
||||
<el-select v-model="dataForm.type" placeholder="请选择" :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="item in type"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.teamManager.showLog.happenTime')" prop="happenTime">
|
||||
<template>
|
||||
<div class="block">
|
||||
<el-date-picker
|
||||
v-model="dataForm.happenTime"
|
||||
type="datetime"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.teamManager.showLog.happenTime')])"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDataById, addLog, updateLog } from '@/api/team-manage/team.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
// rules: [],
|
||||
dataForm: {
|
||||
remark: null,
|
||||
content: null,
|
||||
happenTime: null,
|
||||
type: null
|
||||
},
|
||||
type: [{
|
||||
value: '请假',
|
||||
label: '请假'
|
||||
}, {
|
||||
value: '缺勤',
|
||||
label: '缺勤'
|
||||
}, {
|
||||
value: '设备故障',
|
||||
label: '设备故障'
|
||||
}],
|
||||
rules: {
|
||||
remark: [{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.teamManager.showLog.title')]),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
content: [{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.teamManager.showLog.content')]),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
type: [{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.teamManager.showLog.type')]),
|
||||
trigger: 'change'
|
||||
}],
|
||||
happenTime: [{
|
||||
required: false,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.teamManager.showLog.happenTIme')]),
|
||||
trigger: 'change'
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onClose() {
|
||||
this.$refs['dataForm'].resetFields()
|
||||
},
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.dataForm.id) {
|
||||
updateLog(this.dataForm).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
addLog(this.dataForm).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
init(id) {
|
||||
this.dataForm.id = id || ''
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
if (this.dataForm.id) {
|
||||
getDataById({ id: this.dataForm.id }).then(res => {
|
||||
this.dataForm = res.data
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
274
src/views/team-manage/plan.vue
Normal file
274
src/views/team-manage/plan.vue
Normal file
@@ -0,0 +1,274 @@
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<SearchBar
|
||||
:placeholder="$t('module.teamManager.Handover.Placeholder')"
|
||||
:handover-tme="'PlannedHandoverTime'"
|
||||
@on-search="handleSearch"
|
||||
>
|
||||
<el-button type="success" icon="el-icon-plus" @click="handleAdd()">
|
||||
{{ "btn.add" | i18nFilter }}
|
||||
</el-button>
|
||||
</SearchBar>
|
||||
<el-table
|
||||
:data="workList"
|
||||
:class="$style.table"
|
||||
:stripe="true"
|
||||
:header-cell-style="{background:'#eef1f6',color:'#606266',height: '56px', textAlign: 'center'}"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
size="medium"
|
||||
>
|
||||
<el-table-column
|
||||
prop="index"
|
||||
:label="$t('module.teamManager.Handover.index')"
|
||||
width="80"
|
||||
fixed
|
||||
/>
|
||||
<el-table-column
|
||||
prop="planTeamName"
|
||||
:label="$t('module.teamManager.Handover.TeamName')"
|
||||
width="180"
|
||||
fixed
|
||||
/>
|
||||
<el-table-column
|
||||
prop="createTime"
|
||||
:label="$t('module.teamManager.Handover.CreateTime')"
|
||||
width="180"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ moment(scope.row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="planOnlineTime"
|
||||
:label="$t('module.teamManager.Handover.PlanWorkingHours')"
|
||||
width="180"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ moment(scope.row.planOnlineTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="planHandoverTime"
|
||||
:label="$t('module.teamManager.Handover.PlannedHandoverTime')"
|
||||
width="180"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ moment(scope.row.planHandoverTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="planTeamLeader"
|
||||
:label="$t('module.teamManager.Handover.TeamLeader')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="planPreTeamName"
|
||||
:label="$t('module.teamManager.Handover.LastTeamName')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="planPreTeamLeader"
|
||||
:label="$t('module.teamManager.Handover.PreviousTeamLeader')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="handoverStatus"
|
||||
:label="$t('module.teamManager.Handover.HandoverStatus')"
|
||||
width="80"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.handoverStatus === 1" type="success">
|
||||
已完成
|
||||
</el-tag>
|
||||
<el-tag v-else type="info">
|
||||
等待中
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="remark"
|
||||
:label="$t('module.teamManager.Handover.Remark')"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column
|
||||
:label="$t('module.teamManager.Handover.Detail')"
|
||||
width="80"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleEdit(scope.row.id, true)">{{
|
||||
"btn.detail" | i18nFilter
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:label="$t('module.teamManager.Handover.Operation')"
|
||||
width="280"
|
||||
fixed="right"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.row.handoverStatus !== 1"
|
||||
type="primary"
|
||||
size="mini"
|
||||
icon="el-icon-play"
|
||||
@click="handleStartWork(scope.row.id)"
|
||||
>
|
||||
{{ "btn.start" | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.handoverStatus !== 1"
|
||||
size="mini"
|
||||
type="info"
|
||||
icon="el-icon-edit"
|
||||
@click="handleEdit(scope.row.id)"
|
||||
>
|
||||
{{ "btn.edit" | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row.id)"
|
||||
>
|
||||
{{ "btn.delete" | i18nFilter }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
background
|
||||
:hide-on-single-page="false"
|
||||
:class="$style.table"
|
||||
:current-page="page.current"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:page-size="page.size"
|
||||
layout="total, sizes, prev, pager, next"
|
||||
:total="page.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { page, del } from '@/api/team-manage/team-plan.js'
|
||||
import SearchBar from '@/views/team-manage/components/search-bar'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: { SearchBar },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
moment,
|
||||
isEdit: false,
|
||||
workList: [],
|
||||
page: {
|
||||
total: 40,
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
offlineDrawerVisible: false,
|
||||
param: {},
|
||||
currentTeam: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.handleSearch()
|
||||
},
|
||||
methods: {
|
||||
handleSearch(param) {
|
||||
this.param = param
|
||||
console.log(param)
|
||||
page({ ...param, ...this.page }).then(res => {
|
||||
console.log(res)
|
||||
this.page.total = res.data.total
|
||||
if (!res.data.records) {
|
||||
this.workList = []
|
||||
return
|
||||
}
|
||||
this.workList = res.data.records.map((m, index) => ({
|
||||
...m,
|
||||
index: this.page.size * (this.page.current - 1) + index + 1
|
||||
}))
|
||||
})
|
||||
},
|
||||
handleStartWork(id) {
|
||||
this.$router.push({
|
||||
path: 'team/add',
|
||||
query: {
|
||||
redirect: '/team-manage/list',
|
||||
title: '班组计划新增',
|
||||
planId: id
|
||||
}
|
||||
})
|
||||
},
|
||||
handleAdd() {
|
||||
this.$router.push({
|
||||
path: 'plan/add',
|
||||
query: {
|
||||
redirect: '/team-manage/plan',
|
||||
title: '班组计划新增'
|
||||
}
|
||||
})
|
||||
},
|
||||
handleEdit(id, disable) {
|
||||
this.$router.push({
|
||||
path: 'plan/add',
|
||||
query: {
|
||||
redirect: '/team-manage/plan',
|
||||
title: '班组计划详情',
|
||||
id,
|
||||
disable
|
||||
}
|
||||
})
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`)
|
||||
this.page.size = val
|
||||
this.handleSearch(this.param)
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`)
|
||||
this.page.current = val
|
||||
this.handleSearch(this.param)
|
||||
},
|
||||
handleOffline(team) {
|
||||
this.offlineDrawerVisible = true
|
||||
this.currentTeam = team
|
||||
this.isEdit = true
|
||||
},
|
||||
handleDelete(id) {
|
||||
this.$confirm(
|
||||
`${this.$t('module.teamManager.Handover.alertPlanContent')}`,
|
||||
`${this.$t('module.teamManager.Handover.alertTitle')}`,
|
||||
{
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}
|
||||
).then(() => {
|
||||
console.log(id)
|
||||
del({ id }).then(res => {
|
||||
this.handleSearch(this.param)
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
offlineDrawerClose() {
|
||||
this.handleSearch()
|
||||
this.offlineDrawerVisible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
.table {
|
||||
margin: 16px;
|
||||
width: 98.5%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
169
src/views/team-manage/showlog.vue
Normal file
169
src/views/team-manage/showlog.vue
Normal file
@@ -0,0 +1,169 @@
|
||||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-07-14 08:58:11
|
||||
* @LastEditTime: 2021-07-14 13:37:54
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \mt-bus-fe\src\views\team-manage\showlog.vue
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form
|
||||
:model="formData"
|
||||
:inline="true"
|
||||
size="medium"
|
||||
label-width="80px"
|
||||
>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="addNew()"> {{ 'btn.add' | i18nFilter }} </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
>
|
||||
<method-btn
|
||||
slot="handleBtn"
|
||||
:width="trueWidth"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="formData.current"
|
||||
:limit.sync="formData.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
<log-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.teamManager.showLog.title'),
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'content',
|
||||
label: i18n.t('module.teamManager.showLog.content'),
|
||||
align: 'center',
|
||||
filter: handleLimit
|
||||
},
|
||||
{
|
||||
prop: 'type',
|
||||
label: i18n.t('module.teamManager.showLog.type'),
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'happenTime',
|
||||
label: i18n.t('module.teamManager.showLog.happenTime'),
|
||||
align: 'center',
|
||||
filter: timeFormatter
|
||||
}
|
||||
]
|
||||
import i18n from '@/lang'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
import { showLogPage, delData } from '@/api/team-manage/team.js'
|
||||
import logAdd from './log-add.vue'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import { handleLimit, timeFormatter } from '@/filters'
|
||||
export default {
|
||||
components: { BaseTable, MethodBtn, Pagination, logAdd },
|
||||
data() {
|
||||
return {
|
||||
value: {},
|
||||
tableProps,
|
||||
tableData: [],
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
formData: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
id: this.$route.query.id
|
||||
},
|
||||
list: [],
|
||||
total: 0,
|
||||
tableBtn,
|
||||
trueWidth: 200,
|
||||
listLoading: true,
|
||||
addOrUpdateVisible: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
// eslint-disable-next-line no-undef
|
||||
delData({ id: raw.data.id }).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.addNew(raw.data.id)
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
showLogPage(this.formData).then(response => {
|
||||
if (response.data.records) {
|
||||
this.list = response.data.records
|
||||
} else {
|
||||
this.list.splice(0, this.list.length)
|
||||
}
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
addNew(id) {
|
||||
this.addOrUpdateVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init(id)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user