|
|
@ -1,10 +1,56 @@ |
|
|
<template> |
|
|
<template> |
|
|
<div class="study-syxx"> |
|
|
<div class="study-syxx"> |
|
|
物资列表 |
|
|
|
|
|
|
|
|
<div class="syxx-top" v-show="!showDetail" style="margin-bottom: 10px;"> |
|
|
|
|
|
<div class="syxx-operate"> |
|
|
|
|
|
<div class="operate-img"></div> |
|
|
|
|
|
<div class="operate-left">{{ $t('page.business.study.studyFormPlan.syxx') }}</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<el-form ref="form" label-width="90px"> |
|
|
|
|
|
<el-row> |
|
|
|
|
|
<el-col :span="6"> |
|
|
|
|
|
<el-form-item :label="$t('page.business.study.studyFormPlan.symc')"> |
|
|
|
|
|
{{ studyInfo.name }} |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
<el-col :span="6"> |
|
|
|
|
|
<el-form-item :label="$t('page.business.study.studyFormPlan.sybh')"> |
|
|
|
|
|
{{ studyInfo.sn }} |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
<el-col :span="6"> |
|
|
|
|
|
<el-form-item :label="$t('page.business.study.studyFormPlan.syfzr')"> |
|
|
|
|
|
{{ studyInfo.leaderName }} |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
<el-col :span="6"> |
|
|
|
|
|
<el-form-item :label="$t('page.business.study.studyFormPlan.cjsj')"> |
|
|
|
|
|
{{ studyInfo.createTime }} |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
</el-row> |
|
|
|
|
|
</el-form> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="syxx-content"> |
|
|
|
|
|
<div class="search-box" v-show="!showDetail"> |
|
|
|
|
|
<div class="search-item" :class="active === item.key ? 'active' : ''" v-for="(item, index) in tabList" |
|
|
|
|
|
:key="index" @click="changeTab(item)"> |
|
|
|
|
|
{{ item.name }} |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="content-box"> |
|
|
|
|
|
<gyzjList v-if="active === 'gyzjlb'" :study="studyInfo" @showDetail="showDetailCallback" /> |
|
|
|
|
|
<mjyList v-if="active === 'mjylb'" :study="studyInfo" @showDetail="showDetailCallback"/> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
|
|
|
import { checkPermi, checkRole } from "@/utils/permission"; |
|
|
|
|
|
import { study_info } from "@/api/business/study/study" |
|
|
|
|
|
import gyzjList from '@/views/business/study/comp/wzlb/gyzjList.vue' |
|
|
|
|
|
import mjyList from '@/views/business/study/comp/wzlb/mjyList.vue' |
|
|
export default { |
|
|
export default { |
|
|
name: 'StudyWzlb', |
|
|
name: 'StudyWzlb', |
|
|
props: { |
|
|
props: { |
|
|
@ -19,20 +65,126 @@ export default { |
|
|
study: { |
|
|
study: { |
|
|
immediate: true, |
|
|
immediate: true, |
|
|
handler(v) { |
|
|
handler(v) { |
|
|
|
|
|
this.studyId = v.id |
|
|
|
|
|
this.getStudyInfo() |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
components: { }, |
|
|
|
|
|
|
|
|
components: {gyzjList,mjyList}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
|
|
|
showDetail: false, |
|
|
|
|
|
studyId: '', |
|
|
|
|
|
studyInfo: {}, |
|
|
|
|
|
tabList: [ |
|
|
|
|
|
{ key: 'sjlb', name: this.$t('page.business.study.studyEnter.sjlb') }, |
|
|
|
|
|
{ key: 'gsplb', name: this.$t('page.business.study.studyEnter.gsplb') }, |
|
|
|
|
|
{ key: 'gyzjlb', name: this.$t('page.business.study.studyEnter.gyzjlb') }, |
|
|
|
|
|
{ key: 'mjylb', name: this.$t('page.business.study.studyEnter.mjylb') }, |
|
|
|
|
|
], |
|
|
|
|
|
active: 'sjlb', |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
created() { |
|
|
created() { |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
|
|
|
|
|
|
checkPermi, |
|
|
|
|
|
checkRole, |
|
|
|
|
|
getStudyInfo() { |
|
|
|
|
|
this.$modal.loading() |
|
|
|
|
|
study_info({ id: this.studyId }).then(response => { |
|
|
|
|
|
this.studyInfo = response.data |
|
|
|
|
|
this.$modal.closeLoading() |
|
|
|
|
|
}).finally(() => { |
|
|
|
|
|
this.$modal.closeLoading() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
showDetailCallback(val) { |
|
|
|
|
|
this.showDetail = val |
|
|
|
|
|
this.$emit('showDetail', val) |
|
|
|
|
|
}, |
|
|
|
|
|
changeTab(item) { |
|
|
|
|
|
if (this.active !== item.key) { |
|
|
|
|
|
this.active = item.key |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
|
|
|
.study-syxx { |
|
|
|
|
|
.search-box { |
|
|
|
|
|
background: #fff; |
|
|
|
|
|
padding: 0; |
|
|
|
|
|
border-radius: 3px; |
|
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: row; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
|
|
.search-item { |
|
|
|
|
|
padding: 10px 20px; |
|
|
|
|
|
font-size: 14px; |
|
|
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
|
|
|
|
&.active { |
|
|
|
|
|
background: #1890ff; |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
|
background: #46a6ff; |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:first-child { |
|
|
|
|
|
border-top-left-radius: 3px; |
|
|
|
|
|
border-bottom-left-radius: 3px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
|
border-top-right-radius: 3px; |
|
|
|
|
|
border-bottom-right-radius: 3px; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
.syxx-top { |
|
|
|
|
|
background: #fff; |
|
|
|
|
|
padding: 20px; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
|
|
.syxx-operate { |
|
|
|
|
|
margin: 0px 0 10px 0; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: row; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
color: #409eff; |
|
|
|
|
|
|
|
|
|
|
|
.operate-img { |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
height: 15px; |
|
|
|
|
|
background: #409eff; |
|
|
|
|
|
width: 3px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.operate-left { |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
font-weight: bold; |
|
|
|
|
|
padding-left: 10px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.operate-right { |
|
|
|
|
|
flex-grow: 1; |
|
|
|
|
|
text-align: right; |
|
|
|
|
|
|
|
|
|
|
|
.operate-icon { |
|
|
|
|
|
cursor: pointer; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.syxx-content {} |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |
15881625488@163.com
3 days ago