irc_web/src/views/reviewers/curriculumVitae/components/info/continuingTraining.vue

213 lines
6.3 KiB
Vue

<template>
<div class="continuingTraining">
<div class="title">
<span>{{ $t('curriculumVitae:continuingTraining:title') }}</span>
<el-button type="text" class="editBtn" @click.stop="openEdit">
{{ $t('common:button:add') }}
</el-button>
</div>
<el-table
:data="tableData"
style="width: 100%"
:header-cell-style="{ background: '#eee', color: '#606266' }"
>
<el-table-column
prop="date"
:label="$t('curriculumVitae:continuingTraining:table:time')"
>
</el-table-column>
<el-table-column
prop="date"
:label="$t('curriculumVitae:continuingTraining:table:type')"
>
</el-table-column>
<el-table-column
prop="date"
:label="$t('curriculumVitae:continuingTraining:table:direction')"
>
</el-table-column>
<el-table-column
prop="date"
:label="$t('curriculumVitae:continuingTraining:table:school')"
>
</el-table-column>
<el-table-column
prop="date"
:label="$t('curriculumVitae:continuingTraining:table:city')"
>
</el-table-column>
<el-table-column prop="date" :label="$t('common:action:action')">
<template slot-scope="scope">
<el-button type="text" class="editBtn" @click.stop="openEdit(scope)">
{{ $t('common:button:edit') }}
</el-button>
<el-button type="text" class="editBtn" @click.stop="openEdit">
{{ $t('common:button:delete') }}
</el-button>
</template>
</el-table-column>
</el-table>
<base-model :config="model_cfg">
<template slot="dialog-body">
<el-form
ref="continuingTrainingFrom"
v-loading="loading"
:model="form"
:rules="rules"
label-width="80px"
size="small"
>
<el-form-item
:label="$t('curriculumVitae:continuingTraining:form:time')"
prop="InternationalizationType"
>
<el-date-picker
clearable
v-model="daterange"
type="daterange"
:range-separator="$t('curriculumVitae:daterange:rangeSeparator')"
:start-placeholder="$t('curriculumVitae:daterange:startTime')"
:end-placeholder="$t('curriculumVitae:daterange:endTime')"
>
</el-date-picker>
</el-form-item>
<el-form-item
:label="$t('curriculumVitae:continuingTraining:form:type')"
prop="InternationalizationType"
>
<el-select v-model="form.Sex" clearable placeholder="">
<el-option
v-for="item in $d.sex"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item
:label="$t('curriculumVitae:continuingTraining:form:direction')"
prop="InternationalizationType"
>
<el-row>
<el-col :span="12" style="margin-right: 5px">
<el-input
clearable
:placeholder="
$t(
'curriculumVitae:continuingTraining:placeholder:direction'
)
"
></el-input>
</el-col>
<el-col :span="11">
<el-input
clearable
:placeholder="
$t(
'curriculumVitae:continuingTraining:placeholder:directionEN'
)
"
></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item
:label="$t('curriculumVitae:continuingTraining:form:school')"
prop="InternationalizationType"
>
<el-row>
<el-col :span="12" style="margin-right: 5px">
<el-input
clearable
:placeholder="
$t('curriculumVitae:continuingTraining:placeholder:school')
"
></el-input>
</el-col>
<el-col :span="11">
<el-input
clearable
:placeholder="
$t(
'curriculumVitae:continuingTraining:placeholder:schoolEN'
)
"
></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item
:label="$t('curriculumVitae:continuingTraining:form:city')"
prop="InternationalizationType"
>
<el-select v-model="form.Sex" clearable placeholder="">
<el-option
v-for="item in $d.sex"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-form>
</template>
<template slot="dialog-footer">
<el-button size="small" type="primary" @click="handleCancle">
{{ $t('common:button:cancel') }}
</el-button>
<el-button size="small" type="primary" @click="handleSave">
{{ $t('common:button:save') }}
</el-button>
</template>
</base-model>
</div>
</template>
<script>
import BaseModel from '@/components/BaseModel'
export default {
name: 'continuingTraining',
components: { BaseModel },
data() {
return {
tableData: [],
model_cfg: {
visible: false,
showClose: true,
width: '600px',
title: this.$t('curriculumVitae:continuingTraining:form:title'),
appendToBody: true,
},
form: {},
rules: {},
loading: false,
daterange: [],
}
},
methods: {
openEdit() {
this.model_cfg.visible = true
},
handleCancle() {
this.model_cfg.visible = false
},
handleSave() {
this.model_cfg.visible = false
},
},
}
</script>
<style lang="scss" scoped>
.continuingTraining {
min-height: 100px;
.title {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
}
}
.el-select,
.el-date-editor {
width: 97%;
}
</style>