|
|
@ -10,29 +10,58 @@ |
|
|
<div class="operate-img"></div> |
|
|
<div class="operate-img"></div> |
|
|
<div class="operate-left">{{$t('page.business.study.studyEnter.syxkxx')}}</div> |
|
|
<div class="operate-left">{{$t('page.business.study.studyEnter.syxkxx')}}</div> |
|
|
<div class="operate-right"> |
|
|
<div class="operate-right"> |
|
|
<i class="el-icon-edit operate-icon"></i> |
|
|
|
|
|
|
|
|
<i class="el-icon-edit operate-icon" @click="editSubject"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="subject-content"> |
|
|
<div class="subject-content"> |
|
|
<div class="subject-item" v-for="(item,index) in subjectList" :key="index"> |
|
|
<div class="subject-item" v-for="(item,index) in subjectList" :key="index"> |
|
|
<div class="subject-item-name">{{item.name}}({{item.leader}})</div> |
|
|
|
|
|
|
|
|
<div class="subject-item-name">{{item.deptName}}({{item.leaderName}})</div> |
|
|
<div class="subject-item-add"> |
|
|
<div class="subject-item-add"> |
|
|
<el-button type="primary" plain>{{$t('page.business.study.studyEnter.yq')}}</el-button> |
|
|
|
|
|
|
|
|
<el-button type="primary" plain @click="yq(item)">{{$t('page.business.study.studyEnter.yq')}}</el-button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="infoDialog.title" :visible.sync="infoDialog.visible" width="800px" append-to-body> |
|
|
|
|
|
<el-table v-loading="infoDialog.loading" :data="infoDialog.list"> |
|
|
|
|
|
<el-table-column label="" type="index" width="50"> |
|
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
|
<el-checkbox v-model="scope.row.select"></el-checkbox> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column :label="$t('page.business.study.studyEnter.xk')" prop="deptName" align="center" /> |
|
|
|
|
|
<el-table-column :label="$t('page.business.study.studyEnter.czfzr')" align="center"> |
|
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
|
<div class="subject-table-box"> |
|
|
|
|
|
<div class="subject-table-left"> |
|
|
|
|
|
<el-input v-model="scope.row.leaderName" maxlength="100" readonly /> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="subject-table-right"> |
|
|
|
|
|
<el-button type="primary" plain @click="chooseLeader(scope.row)">{{$t('page.business.study.studyEnter.xzfzr')}}</el-button> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
</el-table> |
|
|
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
|
|
<el-button type="primary" @click="save">{{$t('form.saveConfirm')}}</el-button> |
|
|
|
|
|
<el-button @click="infoDialog.visible = false">{{$t('form.cancel')}}</el-button> |
|
|
|
|
|
</div> |
|
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
<SelectDeptUserDialog ref="selectSubjectDeptUserDialog" v-model="infoDialog.subject.leader" :name="infoDialog.subject.leaderName" @change="changeSubject" /> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
import { |
|
|
import { |
|
|
study_list, |
|
|
|
|
|
study_info, |
|
|
|
|
|
study_save, |
|
|
|
|
|
study_delete |
|
|
|
|
|
} from '@/api/business/study/study' |
|
|
|
|
|
|
|
|
studySubject_listByStudyId, |
|
|
|
|
|
studySubject_getAllListByStudyId, |
|
|
|
|
|
studySubject_save |
|
|
|
|
|
} from '@/api/business/study/studySubject' |
|
|
|
|
|
import SelectDeptUserDialog from '../../comps/select/SelectDeptUserDialog.vue'; |
|
|
export default { |
|
|
export default { |
|
|
name: 'StudyYtbd', |
|
|
|
|
|
|
|
|
name: 'StudySubject', |
|
|
props: { |
|
|
props: { |
|
|
study:{ |
|
|
study:{ |
|
|
type:Object, |
|
|
type:Object, |
|
|
@ -41,20 +70,91 @@ export default { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
components: {}, |
|
|
|
|
|
|
|
|
watch: { |
|
|
|
|
|
study: { |
|
|
|
|
|
immediate: true, |
|
|
|
|
|
handler(v) { |
|
|
|
|
|
this.getList() |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
}, |
|
|
|
|
|
components: {SelectDeptUserDialog}, |
|
|
computed: {}, |
|
|
computed: {}, |
|
|
filters: {}, |
|
|
filters: {}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
subjectList:[ |
|
|
|
|
|
{name:'色谱',leader:'谭飞'}, |
|
|
|
|
|
{name:'供试品',leader:'韩龙'}, |
|
|
|
|
|
{name:'细胞',leader:'何栋'} |
|
|
|
|
|
] |
|
|
|
|
|
|
|
|
subjectList:[], |
|
|
|
|
|
infoDialog:{ |
|
|
|
|
|
title:this.$t('page.business.study.studyEnter.xzxk'), |
|
|
|
|
|
visible:false, |
|
|
|
|
|
|
|
|
|
|
|
loading:false, |
|
|
|
|
|
list:[], |
|
|
|
|
|
subject:{ |
|
|
|
|
|
leader:'', |
|
|
|
|
|
leaderName:'', |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
created() {}, |
|
|
created() {}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
getList(){ |
|
|
|
|
|
studySubject_listByStudyId({studyId:this.study.id}).then(response => { |
|
|
|
|
|
this.subjectList = response.data; |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
editSubject(){ |
|
|
|
|
|
this.infoDialog.list = [] |
|
|
|
|
|
this.infoDialog.loading = true |
|
|
|
|
|
studySubject_getAllListByStudyId({studyId:this.study.id}).then(response => { |
|
|
|
|
|
this.infoDialog.list = response.data; |
|
|
|
|
|
this.infoDialog.visible = true; |
|
|
|
|
|
}).finally(()=>{ |
|
|
|
|
|
this.infoDialog.loading = false; |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
save(){ |
|
|
|
|
|
let postList = _.filter(this.infoDialog.list, (o)=> { return o.select }) |
|
|
|
|
|
if(postList.length>0){ |
|
|
|
|
|
for(let i=0;i<postList.length;i++){ |
|
|
|
|
|
let item = postList[i] |
|
|
|
|
|
if(!item.leader || !item.leaderName){ |
|
|
|
|
|
this.$message.error(`${item.deptName}还没设置负责人`) |
|
|
|
|
|
return false |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
this.$modal.loading() |
|
|
|
|
|
studySubject_save({ |
|
|
|
|
|
studyId:this.study.id, |
|
|
|
|
|
subjectList:postList |
|
|
|
|
|
}).then(() => { |
|
|
|
|
|
this.infoDialog.visible = false |
|
|
|
|
|
this.getList() |
|
|
|
|
|
}).finally(() => { |
|
|
|
|
|
this.$modal.closeLoading() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
chooseLeader(row){ |
|
|
|
|
|
this.infoDialog.subject = row |
|
|
|
|
|
this.$refs.selectSubjectDeptUserDialog.show() |
|
|
|
|
|
}, |
|
|
|
|
|
changeSubject(val){ |
|
|
|
|
|
this.infoDialog.subject.leader = val.id |
|
|
|
|
|
this.infoDialog.subject.leaderName = val.name |
|
|
|
|
|
this.infoDialog.subject.select = true |
|
|
|
|
|
let index = _.findIndex(this.infoDialog.list,(item)=>{ |
|
|
|
|
|
return item.deptId===this.infoDialog.subject.deptId |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
if(index>-1){ |
|
|
|
|
|
this.infoDialog.list.splice(index,1,this.infoDialog.subject) |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
yq(item){ |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
@ -131,4 +231,17 @@ export default { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
.subject-table-box{ |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: row; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
.subject-table-left{ |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
width: 60%; |
|
|
|
|
|
} |
|
|
|
|
|
.subject-table-right{ |
|
|
|
|
|
flex-grow: 1; |
|
|
|
|
|
margin-left: 5px; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |