652 lines
		
	
	
		
			24 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			652 lines
		
	
	
		
			24 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						|
  <div v-loading="loading" class="form-container">
 | 
						|
    <div class="title-wrapper">
 | 
						|
      <p>Education (in chronological order)</p>
 | 
						|
      <el-button class="add" :disabled="$route.query.ReviewStatus === '1'" size="small" @click="handleAddEducation">Add</el-button>
 | 
						|
    </div>
 | 
						|
    <el-table
 | 
						|
      ref="educationTbl"
 | 
						|
      :data="educationList"
 | 
						|
      border
 | 
						|
      class="table"
 | 
						|
      size="small"
 | 
						|
    >
 | 
						|
      <el-table-column type="index" width="30" />
 | 
						|
      <el-table-column
 | 
						|
        prop="BeginDateStr"
 | 
						|
        label="Start"
 | 
						|
        min-width="55"
 | 
						|
        show-overflow-tooltip
 | 
						|
      />
 | 
						|
      <el-table-column
 | 
						|
        prop="EndDateStr"
 | 
						|
        label="End"
 | 
						|
        min-width="55"
 | 
						|
        show-overflow-tooltip
 | 
						|
      />
 | 
						|
      <el-table-column prop="Degree" label="Degree" min-width="70" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.DegreeCN?`${scope.row.Degree} / ${scope.row.DegreeCN}`:scope.row.Degree }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Major" label="Major" min-width="120" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.MajorCN?`${scope.row.Major} / ${scope.row.MajorCN}`:scope.row.Major }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column
 | 
						|
        prop="Organization"
 | 
						|
        label="Institution"
 | 
						|
        min-width="150"
 | 
						|
        show-overflow-tooltip
 | 
						|
      >
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.OrganizationCN?`${scope.row.Organization} / ${scope.row.OrganizationCN}`:scope.row.Organization }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="City" label="City" min-width="90" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.CityCN?`${scope.row.City} / ${scope.row.CityCN}`:scope.row.City }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Province" label="State/Province" min-width="90" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.ProvinceCN?`${scope.row.Province} / ${scope.row.ProvinceCN}`:scope.row.Province }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Country" label="Country" min-width="80" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.CountryCN?`${scope.row.Country} / ${scope.row.CountryCN}`:scope.row.Country }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column label="Operation" min-width="120">
 | 
						|
        <template slot-scope="scope">
 | 
						|
          <el-button type="text" size="small" :disabled="$route.query.ReviewStatus === '1'" @click="handleEducationEdit(scope.row)">Edit</el-button>
 | 
						|
          <el-button type="text" size="small" :disabled="$route.query.ReviewStatus === '1'" @click="handleEducationDelete(scope.row)">Delete</el-button>
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
    </el-table>
 | 
						|
 | 
						|
    <div class="title-wrapper" style="margin-top:40px;">
 | 
						|
      <p>Postgraduate Training (in chronological order)</p>
 | 
						|
      <el-button class="add" size="small" :disabled="$route.query.ReviewStatus === '1'" @click="handleAddPostgraduate">Add</el-button>
 | 
						|
    </div>
 | 
						|
    <el-table
 | 
						|
      ref="postgraduateTbl"
 | 
						|
      :data="postgraduateList"
 | 
						|
      border
 | 
						|
      class="table"
 | 
						|
      size="small"
 | 
						|
    >
 | 
						|
      <el-table-column type="index" width="30" />
 | 
						|
      <el-table-column
 | 
						|
        prop="BeginDateStr"
 | 
						|
        label="Start"
 | 
						|
        min-width="55"
 | 
						|
        show-overflow-tooltip
 | 
						|
      />
 | 
						|
      <el-table-column
 | 
						|
        prop="EndDateStr"
 | 
						|
        label="End"
 | 
						|
        min-width="55"
 | 
						|
        show-overflow-tooltip
 | 
						|
      />
 | 
						|
      <el-table-column prop="Training" label="Training" min-width="70" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.TrainingCN?`${scope.row.Training} / ${scope.row.TrainingCN}`:scope.row.Training }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column
 | 
						|
        prop="Major"
 | 
						|
        label="Specialty/Research Field"
 | 
						|
        min-width="155"
 | 
						|
        show-overflow-tooltip
 | 
						|
      >
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.MajorCN?`${scope.row.Major} / ${scope.row.MajorCN}`:scope.row.Major }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Hospital" label="Hospital" min-width="120" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.HospitalCN?`${scope.row.Hospital} / ${scope.row.HospitalCN}`:scope.row.Hospital }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="School" label="University" min-width="120" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.SchoolCN?`${scope.row.School} / ${scope.row.SchoolCN}`:scope.row.School }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="City" label="City" min-width="100" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.CityCN?`${scope.row.City} / ${scope.row.CityCN}`:scope.row.City }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Province" label="State/Province" min-width="100" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.ProvinceCN?`${scope.row.Province} / ${scope.row.ProvinceCN}`:scope.row.Province }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column prop="Country" label="Country" min-width="90" show-overflow-tooltip>
 | 
						|
        <template slot-scope="scope">
 | 
						|
          {{ scope.row.CountryCN?`${scope.row.Country} / ${scope.row.CountryCN}`:scope.row.Country }}
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column label="Operation" min-width="120">
 | 
						|
        <template slot-scope="scope">
 | 
						|
          <el-button type="text" size="small" :disabled="$route.query.ReviewStatus === '1'" @click="handlePostgraduateEdit(scope.row)">Edit</el-button>
 | 
						|
          <el-button type="text" size="small" :disabled="$route.query.ReviewStatus === '1'" @click="handlePostgraduateDelete(scope.row)">Delete</el-button>
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
    </el-table>
 | 
						|
 | 
						|
    <el-dialog
 | 
						|
      v-if="educationDialogVisible"
 | 
						|
      :title="educationDialogTitle"
 | 
						|
      :visible.sync="educationDialogVisible"
 | 
						|
      width="40%"
 | 
						|
      :close-on-click-modal="false"
 | 
						|
    >
 | 
						|
      <el-form v-if="educationDialogVisible" ref="educationForm" size="small" label-width="120px" :model="educationForm" :rules="educationRules">
 | 
						|
        <el-form-item label="Start" prop="BeginDate">
 | 
						|
          <el-date-picker
 | 
						|
            v-model="educationForm.BeginDate"
 | 
						|
            type="month"
 | 
						|
            placeholder="select date"
 | 
						|
            value-format="yyyy-MM"
 | 
						|
            format="yyyy-MM"
 | 
						|
            size="small"
 | 
						|
            :picker-options="beginPickerOption"
 | 
						|
          />
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="End" prop="EndDate">
 | 
						|
          <el-date-picker
 | 
						|
            v-model="educationForm.EndDate"
 | 
						|
            type="month"
 | 
						|
            placeholder="select date"
 | 
						|
            value-format="yyyy-MM"
 | 
						|
            format="yyyy-MM"
 | 
						|
            size="small"
 | 
						|
            :picker-options="endpickerOption"
 | 
						|
          />
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Degree" prop="Degree">
 | 
						|
          <el-select v-model="educationForm.Degree" placeholder="Please select" size="small">
 | 
						|
            <el-option
 | 
						|
              v-for="item in degreeOptions"
 | 
						|
              :key="item.value"
 | 
						|
              :label="item.value"
 | 
						|
              :value="item.value"
 | 
						|
            />
 | 
						|
          </el-select>
 | 
						|
        </el-form-item>
 | 
						|
 | 
						|
        <el-form-item label="Major" prop="Major">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.Major" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.MajorCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Institution" prop="Organization">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.Organization" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.OrganizationCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="City" prop="City">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.City" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.CityCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="State/Province" prop="Province">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.Province" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.ProvinceCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Country" prop="Country">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.Country" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="educationForm.CountryCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
      </el-form>
 | 
						|
      <span slot="footer" class="dialog-footer">
 | 
						|
        <el-button type="primary" size="small" :loading="isDisabled" @click="handleEducationSave">Save</el-button>
 | 
						|
      </span>
 | 
						|
    </el-dialog>
 | 
						|
 | 
						|
    <el-dialog
 | 
						|
      v-if="postgraduateDialogVisible"
 | 
						|
      :title="postgraduateDialogTitle"
 | 
						|
      :visible.sync="postgraduateDialogVisible"
 | 
						|
      width="40%"
 | 
						|
      :close-on-click-modal="false"
 | 
						|
    >
 | 
						|
      <el-form v-if="postgraduateDialogVisible" ref="postgraduateForm" size="small" label-width="190px" :model="postgraduateForm" :rules="postgraduateRules">
 | 
						|
        <el-form-item label="Start" prop="BeginDate">
 | 
						|
          <el-date-picker
 | 
						|
            v-model="postgraduateForm.BeginDate"
 | 
						|
            type="month"
 | 
						|
            placeholder="select date"
 | 
						|
            value-format="yyyy-MM"
 | 
						|
            format="yyyy-MM"
 | 
						|
            :picker-options="postgraduateBeginPickerOption"
 | 
						|
            size="small"
 | 
						|
          />
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="End" prop="EndDate">
 | 
						|
          <el-date-picker
 | 
						|
            v-model="postgraduateForm.EndDate"
 | 
						|
            type="month"
 | 
						|
            placeholder="select date"
 | 
						|
            value-format="yyyy-MM"
 | 
						|
            format="yyyy-MM"
 | 
						|
            :picker-options="postgraduateEndpickerOption"
 | 
						|
            size="small"
 | 
						|
          />
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Training" prop="Training">
 | 
						|
          <el-select v-model="postgraduateForm.Training" placeholder="Please select" size="small">
 | 
						|
            <el-option
 | 
						|
              v-for="item in TrainingOptions"
 | 
						|
              :key="item.value"
 | 
						|
              :label="item.label"
 | 
						|
              :value="item.value"
 | 
						|
            />
 | 
						|
          </el-select>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Specialty / Research Field" prop="Major">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.Major" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.MajorCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Hospital" prop="Hospital">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.Hospital" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.HospitalCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="University" prop="School">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.School" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.SchoolCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
 | 
						|
        <el-form-item label="City" prop="City">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.City" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.CityCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="State/Province" prop="Province">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.Province" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.ProvinceCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
        <el-form-item label="Country" prop="Country">
 | 
						|
          <el-row type="flex" justify="space-between">
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.Country" placeholder="Please specify in English" size="small" />
 | 
						|
            </el-col>
 | 
						|
            <el-col :span="11">
 | 
						|
              <el-input v-model="postgraduateForm.CountryCN" placeholder="请用中文注明" size="small" />
 | 
						|
            </el-col>
 | 
						|
          </el-row>
 | 
						|
        </el-form-item>
 | 
						|
      </el-form>
 | 
						|
      <span slot="footer" class="dialog-footer">
 | 
						|
        <el-button size="small" type="primary" :loading="isDisabled" @click="handlePostgraduateSave">Save</el-button>
 | 
						|
      </span>
 | 
						|
    </el-dialog>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
import { getEducation, addOrUpdateEducationInfo, deleteEducationInfo, addOrUpdatePostgraduateInfo, deletePostgraduateInfo } from '@/api/reviewers'
 | 
						|
const getEducationDefault = () => {
 | 
						|
  return {
 | 
						|
    Id: '',
 | 
						|
    DoctorId: '',
 | 
						|
    BeginDate: '',
 | 
						|
    EndDate: '',
 | 
						|
    Degree: '',
 | 
						|
    Major: '',
 | 
						|
    MajorCN: '',
 | 
						|
    Organization: '',
 | 
						|
    OrganizationCN: '',
 | 
						|
    City: '',
 | 
						|
    CityCN: '',
 | 
						|
    Province: '',
 | 
						|
    ProvinceCN: '',
 | 
						|
    Country: '',
 | 
						|
    CountryCN: ''
 | 
						|
  }
 | 
						|
}
 | 
						|
const getPostgraduateDefault = () => {
 | 
						|
  return {
 | 
						|
    Id: '',
 | 
						|
    DoctorId: '',
 | 
						|
    BeginDate: '',
 | 
						|
    EndDate: '',
 | 
						|
    Training: '',
 | 
						|
    Major: '',
 | 
						|
    MajorCN: '',
 | 
						|
    Hospital: '',
 | 
						|
    HospitalCN: '',
 | 
						|
    School: '',
 | 
						|
    SchoolCN: '',
 | 
						|
    City: '',
 | 
						|
    CityCN: '',
 | 
						|
    Province: '',
 | 
						|
    ProvinceCN: '',
 | 
						|
    Country: '',
 | 
						|
    CountryCN: ''
 | 
						|
  }
 | 
						|
}
 | 
						|
export default {
 | 
						|
  name: 'EducationTraining',
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      educationList: [],
 | 
						|
      postgraduateList: [],
 | 
						|
      educationDialogTitle: '',
 | 
						|
      educationForm: getEducationDefault(),
 | 
						|
      educationRules: {
 | 
						|
        BeginDate: [{ required: true, message: 'Please select a start date', trigger: 'blur' }],
 | 
						|
        EndDate: [{ required: true, message: 'Please select a valid date', trigger: 'blur' }],
 | 
						|
        Degree: [
 | 
						|
          { required: true, message: 'Please enter the degree', trigger: 'blur' },
 | 
						|
          { max: 100, message: 'The maximum length is 100' }
 | 
						|
        ],
 | 
						|
        Major: [
 | 
						|
          { required: true, message: 'Please enter the major', trigger: 'blur' },
 | 
						|
          { max: 100, message: 'The maximum length is 100' }
 | 
						|
        ],
 | 
						|
        Organization: [
 | 
						|
          { required: true, message: 'Please enter the institution', trigger: 'blur' },
 | 
						|
          { max: 100, message: 'The maximum length is 100' }
 | 
						|
        ],
 | 
						|
        City: [
 | 
						|
          { required: true, message: 'Please enter the city', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ],
 | 
						|
        Province: [
 | 
						|
          { required: true, message: 'Please enter the state/province', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ],
 | 
						|
        Country: [
 | 
						|
          { required: true, message: 'Please enter the country', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ]
 | 
						|
      },
 | 
						|
      educationDialogVisible: false,
 | 
						|
      degreeOptions: [{ value: 'Bachelor' }, { value: 'Master' }, { value: 'Doctorate' }],
 | 
						|
      TrainingOptions: [{ value: 'Residency' }, { value: 'Fellowship' }, { value: 'Post-Doc' }, { value: 'Visiting Scholar' }],
 | 
						|
      beginPickerOption: {
 | 
						|
        disabledDate: time => {
 | 
						|
          if (this.educationForm.EndDate) {
 | 
						|
            return time.getTime() > new Date(this.educationForm.EndDate).getTime()
 | 
						|
          } else {
 | 
						|
            return time.getTime() > Date.now()
 | 
						|
          }
 | 
						|
        }
 | 
						|
      },
 | 
						|
      endpickerOption: {
 | 
						|
        disabledDate: time => {
 | 
						|
          if (this.educationForm.BeginDate) {
 | 
						|
            return time.getTime() > Date.now() || time.getTime() <= new Date(this.educationForm.BeginDate).getTime()
 | 
						|
          } else {
 | 
						|
            return time.getTime() > Date.now()
 | 
						|
          }
 | 
						|
        }
 | 
						|
      },
 | 
						|
      postgraduateDialogTitle: '',
 | 
						|
      postgraduateDialogVisible: false,
 | 
						|
      postgraduateForm: getPostgraduateDefault(),
 | 
						|
      postgraduateRules: {
 | 
						|
        BeginDate: [{ required: true, message: 'Please select a start date', trigger: 'blur' }],
 | 
						|
        EndDate: [{ required: true, message: 'Please select a valid date', trigger: 'blur' }],
 | 
						|
        Training: [
 | 
						|
          { required: true, message: 'Please enter the degree', trigger: 'blur' },
 | 
						|
          { max: 100, message: 'The maximum length is 100' }
 | 
						|
        ],
 | 
						|
        Major: [
 | 
						|
          { required: true, message: 'Please enter the major', trigger: 'blur' },
 | 
						|
          { max: 100, message: 'The maximum length is 100' }
 | 
						|
        ],
 | 
						|
        City: [
 | 
						|
          { required: true, message: 'Please enter the city', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ],
 | 
						|
        Province: [
 | 
						|
          { required: true, message: 'Please enter the state/province', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ],
 | 
						|
        Country: [
 | 
						|
          { required: true, message: 'Please enter the country', trigger: 'blur' },
 | 
						|
          { max: 50, message: 'The maximum length is 50' }
 | 
						|
        ]
 | 
						|
      },
 | 
						|
      postgraduateBeginPickerOption: {
 | 
						|
        disabledDate: time => {
 | 
						|
          if (this.postgraduateForm.EndDate) {
 | 
						|
            return time.getTime() > new Date(this.postgraduateForm.EndDate).getTime()
 | 
						|
          } else {
 | 
						|
            return time.getTime() > Date.now()
 | 
						|
          }
 | 
						|
        }
 | 
						|
      },
 | 
						|
      postgraduateEndpickerOption: {
 | 
						|
        disabledDate: time => {
 | 
						|
          if (this.postgraduateForm.BeginDate) {
 | 
						|
            return time.getTime() > Date.now() || time.getTime() <= new Date(this.postgraduateForm.BeginDate).getTime()
 | 
						|
          } else {
 | 
						|
            return time.getTime() > Date.now()
 | 
						|
          }
 | 
						|
        }
 | 
						|
      },
 | 
						|
      isDisabled: false,
 | 
						|
      loading: false
 | 
						|
    }
 | 
						|
  },
 | 
						|
  mounted() {
 | 
						|
    this.initPage()
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    initPage() {
 | 
						|
      const id = this.$route.query.Id
 | 
						|
      if (id) {
 | 
						|
        this.loading = true
 | 
						|
        getEducation(id).then(res => {
 | 
						|
          this.educationList = res.Result.EducationList
 | 
						|
          this.postgraduateList = res.Result.PostgraduateList
 | 
						|
          this.loading = false
 | 
						|
        }).catch(() => {
 | 
						|
          this.loading = false
 | 
						|
        })
 | 
						|
      }
 | 
						|
    },
 | 
						|
    handleAddEducation() {
 | 
						|
      this.educationDialogTitle = 'New'
 | 
						|
      this.educationDialogVisible = true
 | 
						|
      Object.assign(this.educationForm, getEducationDefault())
 | 
						|
    },
 | 
						|
    handleEducationEdit(row) {
 | 
						|
      // eslint-disable-next-line no-unused-vars
 | 
						|
      const { BeginDateStr, EndDateStr, ...param } = row
 | 
						|
      this.educationDialogTitle = 'Edit'
 | 
						|
      this.educationDialogVisible = true
 | 
						|
      this.educationForm = param
 | 
						|
    },
 | 
						|
 | 
						|
    handleEducationSave() {
 | 
						|
      this.$refs.educationForm.validate(valid => {
 | 
						|
        if (valid) {
 | 
						|
          this.isDisabled = true
 | 
						|
          this.educationForm.DoctorId = this.$route.query.Id
 | 
						|
 | 
						|
          if (this.educationForm.Degree === 'Bachelor') {
 | 
						|
            this.educationForm.DegreeCN = '学士'
 | 
						|
          } else if (this.educationForm.Degree === 'Master') {
 | 
						|
            this.educationForm.DegreeCN = '硕士'
 | 
						|
          } else if (this.educationForm.Degree === 'Doctorate') {
 | 
						|
            this.educationForm.DegreeCN = '博士'
 | 
						|
          }
 | 
						|
          addOrUpdateEducationInfo(this.educationForm).then(res => {
 | 
						|
            this.isDisabled = false
 | 
						|
            this.educationDialogVisible = false
 | 
						|
            this.initPage()
 | 
						|
            if (this.educationForm.Id) {
 | 
						|
              this.$message({
 | 
						|
                message: 'Updated successfully',
 | 
						|
                type: 'success'
 | 
						|
              })
 | 
						|
            } else {
 | 
						|
              this.$message({
 | 
						|
                message: 'Addedd successfully',
 | 
						|
                type: 'success'
 | 
						|
              })
 | 
						|
            }
 | 
						|
 | 
						|
            this.$refs['educationForm'].resetFields()
 | 
						|
          })
 | 
						|
            .catch(() => {
 | 
						|
              this.isDisabled = false
 | 
						|
            })
 | 
						|
        }
 | 
						|
      })
 | 
						|
    },
 | 
						|
    handleEducationDelete(row) {
 | 
						|
      this.$confirm('Confirm to delete?', {
 | 
						|
        type: 'warning',
 | 
						|
        distinguishCancelAndClose: true,
 | 
						|
        confirmButtonText: 'OK',
 | 
						|
        cancelButtonText: 'Cancel'
 | 
						|
      })
 | 
						|
        .then(() => {
 | 
						|
          deleteEducationInfo(row.Id)
 | 
						|
            .then(res => {
 | 
						|
              this.educationList.splice(this.educationList.findIndex(item => item.Id === row.Id), 1)
 | 
						|
              this.$message.success('Deleted successfully !')
 | 
						|
            })
 | 
						|
        })
 | 
						|
        .catch(action => {})
 | 
						|
    },
 | 
						|
 | 
						|
    handleAddPostgraduate() {
 | 
						|
      this.postgraduateDialogTitle = 'New'
 | 
						|
      this.postgraduateDialogVisible = true
 | 
						|
      Object.assign(this.postgraduateForm, getPostgraduateDefault())
 | 
						|
    },
 | 
						|
    handlePostgraduateEdit(row) {
 | 
						|
      // eslint-disable-next-line no-unused-vars
 | 
						|
      const { BeginDateStr, EndDateStr, ...param } = row
 | 
						|
      this.postgraduateDialogTitle = 'Edit'
 | 
						|
      this.postgraduateDialogVisible = true
 | 
						|
      this.postgraduateForm = param
 | 
						|
    },
 | 
						|
    handlePostgraduateSave() {
 | 
						|
      this.$refs.postgraduateForm.validate(valid => {
 | 
						|
        if (valid) {
 | 
						|
          this.isDisabled = true
 | 
						|
          this.postgraduateForm.DoctorId = this.$route.query.Id
 | 
						|
 | 
						|
          if (this.postgraduateForm.Training === 'Residency') {
 | 
						|
            this.postgraduateForm.TrainingCN = '规培'
 | 
						|
          } else if (this.postgraduateForm.Training === 'Fellowship') {
 | 
						|
            this.postgraduateForm.TrainingCN = '专科培训'
 | 
						|
          } else if (this.postgraduateForm.Training === 'Post-Doc') {
 | 
						|
            this.postgraduateForm.TrainingCN = '博士后'
 | 
						|
          } else if (this.postgraduateForm.Training === 'Visiting Scholar') {
 | 
						|
            this.postgraduateForm.TrainingCN = '访问学者'
 | 
						|
          }
 | 
						|
          addOrUpdatePostgraduateInfo(this.postgraduateForm).then(res => {
 | 
						|
            this.isDisabled = false
 | 
						|
            this.postgraduateDialogVisible = false
 | 
						|
            this.initPage()
 | 
						|
            if (this.postgraduateForm.Id) {
 | 
						|
              this.$message({
 | 
						|
                message: 'Updated successfully',
 | 
						|
                type: 'success'
 | 
						|
              })
 | 
						|
            } else {
 | 
						|
              this.$message({
 | 
						|
                message: 'Addedd successfully',
 | 
						|
                type: 'success'
 | 
						|
              })
 | 
						|
            }
 | 
						|
 | 
						|
            this.$refs['postgraduateForm'].resetFields()
 | 
						|
          })
 | 
						|
            .catch(err => {
 | 
						|
              this.isDisabled = false
 | 
						|
              console.log(err)
 | 
						|
            })
 | 
						|
        }
 | 
						|
      })
 | 
						|
    },
 | 
						|
    handlePostgraduateDelete(row) {
 | 
						|
      this.$confirm('Confirm to delete?', {
 | 
						|
        type: 'warning',
 | 
						|
        distinguishCancelAndClose: true,
 | 
						|
        confirmButtonText: 'OK',
 | 
						|
        cancelButtonText: 'Cancel'
 | 
						|
      })
 | 
						|
        .then(() => {
 | 
						|
          deletePostgraduateInfo(row.Id)
 | 
						|
            .then(res => {
 | 
						|
              this.postgraduateList.splice(this.postgraduateList.findIndex(item => item.Id === row.Id), 1)
 | 
						|
              this.$message.success('Deleted successfully !')
 | 
						|
            })
 | 
						|
        })
 | 
						|
        .catch(action => {})
 | 
						|
    }
 | 
						|
  }
 | 
						|
}
 | 
						|
</script>
 | 
						|
 |