irc_web/.svn/pristine/cb/cb4cc708ba93675156fcf1ca8d2...

125 lines
3.7 KiB
Plaintext

<template>
<div class="app-container">
<el-tabs v-model="active" :before-leave="checkLeave" @tab-click="clickTab">
<el-tab-pane label="Basic Info" name="BasicInfo">
<basic-info v-if="load.BasicInfo" />
</el-tab-pane>
<el-tab-pane label="Employment" name="Employment">
<Employment v-if="load.Employment" />
</el-tab-pane>
<el-tab-pane label="Specialty" name="Specialty">
<specialty v-if="load.Specialty" />
</el-tab-pane>
<el-tab-pane label="Education & Training" name="EducationTraining">
<education-training v-if="load.EducationTraining" />
</el-tab-pane>
<el-tab-pane label="Research & Publication" name="ResearchPublication">
<research-publication v-if="load.ResearchPublication" />
</el-tab-pane>
<el-tab-pane label="Trial Experience" name="TrialExperience">
<trial-experience v-if="load.TrialExperience" />
</el-tab-pane>
<el-tab-pane label="Credentials" name="Credentials">
<Credentials v-if="load.Credentials" />
</el-tab-pane>
<el-tab-pane label="Resumes" name="Resumes">
<Resumes v-if="load.Resumes" />
</el-tab-pane>
<el-tab-pane label="Agreements" name="Agreements">
<Agreements v-if="load.Agreements" />
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import BasicInfo from './components/BasicInfo'
import Employment from './components/Employment'
import Specialty from './components/Specialty'
import EducationTraining from './components/EducationTraining'
import ResearchPublication from './components/ResearchPublication'
import TrialExperience from './components/TrialExperience'
import Credentials from './components/Credentials'
import Resumes from './components/Resumes'
import Agreements from './components/Agreements'
import Setting from './components/Setting'
import { changeURLStatic, getQueryString } from '@/utils/history.js'
export default {
components: {
BasicInfo,
Employment,
Specialty,
EducationTraining,
ResearchPublication,
TrialExperience,
Credentials,
Resumes,
Agreements,
Setting
},
data() {
return {
active: 'BasicInfo',
load: {
BasicInfo: true,
Employment: false,
Specialty: false,
EducationTraining: false,
ResearchPublication: false,
TrialExperience: false,
Credentials: false,
Resumes: false,
Agreements: false,
Setting: false
}
}
},
mounted() {
this.active = this.$route.query.tabActive
if (this.$route.query.Id === '' && this.active !== 'BasicInfo') {
this.$router.push({ path: '/ReviewersResearch' })
}
this.load[this.active] = true
},
methods: {
clickTab(tab, event) {
if (this.load[tab.name] === false) {
this.load[tab.name] = true
}
changeURLStatic('tabActive', tab.name)
const id = getQueryString('Id')
this.$router.push({ path: `/ReviewersResearchForm?Id=${id}&tabActive=${tab.name}&ReviewStatus=${getQueryString('ReviewStatus')}` })
},
checkLeave() {
const id = getQueryString('Id')
if (!id) {
this.$message({
message: 'Please fill in the basic information first',
type: 'warning'
})
return false
} else { return true }
},
getQueryString(name) {
console.log(window.location.href)
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
var r = window.location.search.substr(1).match(reg)
if (r != null) {
return unescape(r[2])
} else {
return null
}
}
}
}
</script>
<style lang="scss" scoped>
.el-tabs{
height: 100%;
.el-tabs__content{
height: calc(100%-50px);
overflow-y: auto;
}
}
</style>