340 lines
8.8 KiB
Vue
340 lines
8.8 KiB
Vue
<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="190px"
|
|
: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>
|