Vue_New/src/xt_pages/user/firstDisease.vue

<template>
  <div class="patient-container">
    <patient-sidebar :id="patient_id" defaultActive="1-11"></patient-sidebar>
    <div v-loading="loading">
      <div class="patient-app-container advice-container app-container">

        <div>
                    <span style="margin-left: 10px;float:right;">
                        <el-button type="primary" icon="el-icon-circle-plus-outline" size="small"
                                   @click="addAction">新增</el-button>

                        <el-button type="primary" icon="el-icon-edit-outline" size="small"
                                   @click="toEdit">修改</el-button>
                      <el-button type="primary" icon="el-icon-printer" size="small"
                                 @click="print">打印</el-button>
                      <el-button size="small"  type="danger" @click="deleteAction">删除</el-button>
                    </span>
        </div>
      
        <div class="cell clearfix">
          <label class="title"><span class="name">日期查询</span> : </label>
          <el-date-picker v-model="start_time" prefix-icon="el-icon-date" :editable="false" style="width: 196px;"
                          type="date" placeholder="选择日期时间" align="right" format="yyyy-MM-dd"
                          value-format="yyyy-MM-dd" @change="startTimeChange"></el-date-picker>
          <span class="">-</span>
          <el-date-picker v-model="end_time" prefix-icon="el-icon-date" :editable="false" style="width: 196px;"
                          type="date" placeholder="选择日期时间" align="right" format="yyyy-MM-dd"
                          value-format="yyyy-MM-dd" @change="endTimeChange"></el-date-picker>
        </div>
        <div class="record">
          <el-row :gutter="15">
            <el-col :span="10">
              <el-table :header-cell-style="{
                  backgroundColor: 'rgb(245, 247, 250)',
                  color: '#606266'
                }"
                :row-style="{ color: '#303133' }" ref="monthlyPlanTable" :data="tableData"
                        border highlight-current-row @current-change="changeCurrentRecordTwo"
                        @selection-change="selectSummary"
                        :row-class-name="tableRow"
              >
                <el-table-column type="selection" width="60" align="center"></el-table-column>
                <el-table-column label="标题" align="center">
                  <template slot-scope="scope">
                    {{scope.row.title}}
                  </template>
                </el-table-column>
                <el-table-column label="记录日期" align="center">
                  <template slot-scope="scope">
                    {{getTimeOne(scope.row.record_date)}}
                  </template>
                </el-table-column>
                <el-table-column label="记录医师" align="center">
                  <template slot-scope="scope">
                    {{getDoctor(scope.row.doctor)}}
                  </template>
                </el-table-column>
              </el-table>
            </el-col>
            <el-col :span="14">
              <div class="record_content_panel">
                <div style="background-color:rgb(245, 247, 250)" class="title">出院小结内容</div>
                <div style="padding:10px;border-bottom:1px solid #DCDFE6;">标题:
                   {{hosDetail.title}}
                </div>
            
                
                <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">记录医师:
                   {{getDoctor(hosDetail.doctor)}}
                </div>
                
                 
                
                 <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">主诉内容:
                   <span v-html="hosDetail.main_content"></span> 
                 </div>
                 <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">病例特点:
                   <span v-html="hosDetail.patient_case"></span> 
                 </div>
                 <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">初步诊断:
                    <span v-html="hosDetail.tentative_diagnosis"></span>
                 </div>
                 <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">诊断依据:
                    <span v-html="hosDetail.diagnostic_basis"></span>
                 </div>
                   <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">鉴别诊断:
                    <span v-html="hosDetail.differential_diagnosis"></span>
                 </div>
                 <div style="padding:10px;border-bottom:1px solid #DCDFE6;line-height:20px;">诊疗计划:
                    <span v-html="hosDetail.treatment_plan"></span>
                 </div>
               
              </div>
            </el-col>
          </el-row>
        </div>
      </div>

  
     
      <el-dialog title="新增首次病程记录" width="60%" top="5vh" :visible.sync="show_dialog">
        <div>
          <div class="new_record_form">
            <div class="cell clearfix">
              <label class="title"><span class="name">标题</span> : </label>
               <el-input v-model="form.title" style="width:200px"></el-input>

              <label class="title"><span class="name">记录医师</span>:</label>
               <el-select v-model="form.doctor" placeholder="请选择">
                  <el-option
                  v-for="item in doctorList"
                  :key="item.admin_user_id"
                  :label="item.user_name"
                  :value="item.admin_user_id">
                  </el-option>
              </el-select>
            
              <label class="title"><span class="name">记录日期</span> : </label>
              <el-date-picker v-model="form.record_date"
                    prefix-icon="el-icon-date" 
                    style="width: 200px;"
                    type="datetime" placeholder="选择日期时间" align="right" format="yyyy-MM-dd HH:mm"
                    value-format="yyyy-MM-dd HH:mm">
              </el-date-picker>   
            </div>
           
        
      
            <div class="cell clearfix" style="margin-top:10px">
              <label class="title"><span class="name">主诉内容</span> : </label>
                <el-select v-model="form.main_content_id" placeholder="可选择病程模板" @change="changeMainContent">
                  <el-option v-for="(option, index) in mainContentList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editor"
                              id="editor"
                              style="width: 800px"
                              v-bind:r_content="form.main_content">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">病例特点</span> : </label>
                <el-select v-model="form.patient_case_id" placeholder="可选择病程模板" @change="changePatientCase">
                  <el-option v-for="(option, index) in patientCaseList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorOne"
                              id="editorOne"
                              style="width: 800px"
                              v-bind:r_content="form.patient_case">
                      </editor>
                    </keep-alive>
                </div>

                 <label class="title"><span class="name">初步诊断</span> : </label>
                <el-select v-model="form.tentative_diagnosis_id" placeholder="可选择病程模板" @change="changeTentativeDiagnosis">
                  <el-option v-for="(option, index) in tentativeDiagnosisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTwo"
                              id="editorTwo"
                              style="width: 800px"
                              v-bind:r_content="form.tentative_diagnosis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">诊断依据</span> : </label>
                <el-select v-model="form.diagnostic_basis_id" placeholder="可选择病程模板" @change="changeDiagnosticBasis">
                  <el-option v-for="(option, index) in diagnosticBasisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorThree"
                              id="editorThree"
                              style="width: 800px"
                              v-bind:r_content="form.diagnostic_basis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">鉴别诊断</span> : </label>
                <el-select v-model="form.differential_diagnosis_id" placeholder="可选择病程模板" @change="changeDifferentialDiagnosis">
                  <el-option v-for="(option, index) in differentialDiagnosisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorFour"
                              id="editorFour"
                              style="width: 800px"
                              v-bind:r_content="form.differential_diagnosis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">诊疗计划</span> : </label>
                <el-select v-model="form.treatment_plan_id" placeholder="可选择病程模板" @change="changeTreateMentContent">
                  <el-option v-for="(option, index) in treateMentList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorFive"
                              id="editorFive"
                              style="width: 800px"
                              v-bind:r_content="form.treatment_plan">
                      </editor>
                    </keep-alive>
                </div>
            </div>

    
            <div style="text-align: right; padding-right: 0px; padding-top: 10px; padding-bottom: 10px;">
              <el-button @click="show_dialog = false">取消</el-button>
              <el-button type="primary"
                         @click="createAction" :loading="uploading_new_record">保存
              </el-button>
            </div>
          </div>
        </div>
      </el-dialog>
      
      <el-dialog title="编辑首次病程记录" width="60%" top="5vh" :visible.sync="edit_show_dialog">
        <div>
          <div class="new_record_form">
            <div class="cell clearfix">
              <label class="title"><span class="name">标题</span> : </label>
               <el-input v-model="form.title" style="width:200px"></el-input>

              <label class="title"><span class="name">记录医师</span>:</label>
               <el-select v-model="form.doctor" placeholder="请选择">
                  <el-option
                  v-for="item in doctorList"
                  :key="item.admin_user_id"
                  :label="item.user_name"
                  :value="item.admin_user_id">
                  </el-option>
              </el-select>
            
              <label class="title"><span class="name">记录日期</span> : </label>
              <el-date-picker v-model="form.record_date"
                    prefix-icon="el-icon-date" 
                    style="width: 200px;"
                    type="datetime" placeholder="选择日期时间" align="right" format="yyyy-MM-dd HH:mm"
                    value-format="yyyy-MM-dd HH:mm">
              </el-date-picker>   

              
            </div>

             <div class="cell clearfix" style="margin-top:10px">
              <label class="title"><span class="name">主诉内容</span> : </label>
                <el-select v-model="form.main_content_id" placeholder="可选择病程模板" @change="changeMainContent">
                  <el-option v-for="(option, index) in mainContentList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTen"
                              id="editorTen"
                              style="width: 800px"
                              v-bind:r_content="form.main_content">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">病例特点</span> : </label>
                <el-select v-model="form.patient_case_id" placeholder="可选择病程模板" @change="changePatientCase">
                  <el-option v-for="(option, index) in patientCaseList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTenOne"
                              id="editorTenOne"
                              style="width: 800px"
                              v-bind:r_content="form.patient_case">
                      </editor>
                    </keep-alive>
                </div>

                 <label class="title"><span class="name">初步诊断</span> : </label>
                <el-select v-model="form.tentative_diagnosis_id" placeholder="可选择病程模板" @change="changeTentativeDiagnosis">
                  <el-option v-for="(option, index) in tentativeDiagnosisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTenTwo"
                              id="editorTenTwo"
                              style="width: 800px"
                              v-bind:r_content="form.tentative_diagnosis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">诊断依据</span> : </label>
                <el-select v-model="form.diagnostic_basis_id" placeholder="可选择病程模板" @change="changeDiagnosticBasis">
                  <el-option v-for="(option, index) in diagnosticBasisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTenThree"
                              id="editorTenThree"
                              style="width: 800px"
                              v-bind:r_content="form.diagnostic_basis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">鉴别诊断</span> : </label>
                <el-select v-model="form.differential_diagnosis_id" placeholder="可选择病程模板" @change="changeDifferentialDiagnosis">
                  <el-option v-for="(option, index) in differentialDiagnosisList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTenFour"
                              id="editorTenFour"
                              style="width: 800px"
                              v-bind:r_content="form.differential_diagnosis">
                      </editor>
                    </keep-alive>
                </div>

                <label class="title"><span class="name">诊疗计划</span> : </label>
                <el-select v-model="form.treatment_plan_id" placeholder="可选择病程模板" @change="changeTreateMentContent">
                  <el-option v-for="(option, index) in treateMentList" :key="index" :label="option.title"
                            :value="option.content"></el-option>
                </el-select>
                
                 <div class="textarea_panel">
                    <keep-alive>
                      <editor ref="editorTenFive"
                              id="editorTenFive"
                              style="width: 800px"
                              v-bind:r_content="form.treatment_plan">
                      </editor>
                    </keep-alive>
                </div>
            </div>

             <div style="text-align: right; padding-right: 0px; padding-top: 10px; padding-bottom: 10px;">
              <el-button @click="edit_show_dialog = false">取消</el-button>
              <el-button type="primary"
                         @click="updateAction" :loading="uploading_new_record">保存
              </el-button>
            </div>
          </div>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
  import PatientSidebar from './components/PatientSidebar'
  import Editor from '@/components/Editor'

  import { createFirstDisease,getFirstDiseaseList,getFirstDetail,updateFirstDisease,deleteFirstDisease} from '@/api/patient'
  import { parseTime } from '@/utils'
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import { uParseTime } from '@/utils/tools'
  import { getDataConfig } from '@/utils/data'
  import multiSelectBox from '../dialysis/details/dialog/MultiSelectBox'
 import MsgTip from '../dialysis/details/dialog/MsgTip'
  import { getAllDoctorList } from "@/api/device"
  const moment = require('moment')
  export default {
    name: 'hospitalSummary',
    components: {
      PatientSidebar,
      BreadCrumb,
      Editor,
      MsgTip,
      multiSelectBox,
    },
    data() {
      return {
        InnerDialogProps: {
          values: [],
          visibility: false,
          isShowTextArea: true,
          customContent: '',
          titles: '',
          type: '' // 不同弹框类型，用来匹配数据
        },
        loading: false,
        title: '',
        patient_id: 0,
        date: [],
        start_time: '',
        end_time: '',
        course_of_disease_time: '',
        records: [],
        doctors: [],
        current_select_record: null,
        show_dialog: false,
        show_edit_dialog: false,
        uploading_new_record: false,
        edit_show_dialog:false,
        mainContentList: this.$store.getters.configlist.main_content,
        patientCaseList:this.$store.getters.configlist.patient_case,
        tentativeDiagnosisList:this.$store.getters.configlist.tentative_diagnosis,
        diagnosticBasisList:this.$store.getters.configlist.diagnostic_basis,
        differentialDiagnosisList:this.$store.getters.configlist.differential_diagnosis,
        treateMentList:this.$store.getters.configlist.treatment_plan,
        select_template: '',
        new_content: '',
        edit_new_content: '',
        edit_course_of_disease_time: '',
        selectingRows: [],
        table_current_index: -1,
        edit_current_id: 0,
        edit_title: '',
        value:'',
        form:{
          id:0,
          title:"",
          doctor:this.$store.getters.xt_user.user.id,
          record_date:this.getTimeOne(new Date()),
          pathology:"",
          record_time:"",
          main_content_id:"",
          main_content:"",
          patient_case_id:"",
          patient_case:"",
          tentative_diagnosis_id:"",
          tentative_diagnosis:"",
          diagnostic_basis_id:"",
          diagnostic_basis:"",
          differential_diagnosis_id:"",
          differential_diagnosis:"",
          treatment_plan_id:"",
          treatment_plan:""
        },
       tableData:[],
       docList:[],
       doctorList:[],
       hosDetail:{},
       ids:"",
       patient:{},
      }
    },
    created() {
     
      this.patient_id = this.$route.params && this.$route.params.id
     
     
      var now = new Date()
      this.date = [now.getTime() - (7 * 24 * 60 * 60 * 1000), now.getTime()]

      var nowDate = new Date()
      var nowYear = nowDate.getFullYear()
      var nowMonth = nowDate.getMonth() + 1

      var nowDay = nowDate.getDate()
      this.end_time =
        nowYear +
        '-' +
        (nowMonth < 10 ? '0' + nowMonth : nowMonth) +
        '-' +
        (nowDay < 10 ? '0' + nowDay : nowDay)
      nowDate.setMonth(nowDate.getMonth() - 1)
      nowYear = nowDate.getFullYear()
      nowMonth = nowDate.getMonth() + 1
      nowDay = nowDate.getDate()
      this.start_time =
        nowYear +
        '-' +
        (nowMonth < 10 ? '0' + nowMonth : nowMonth) +
        '-' +
        (nowDay < 10 ? '0' + nowDay : nowDay)
      this.other_start_time = nowYear +'-' +(nowMonth < 10 ? '0' + nowMonth : nowMonth) +'-' + (nowDay < 10 ? '0' + nowDay : nowDay)
      
     this.getAllDoctorList()
     this.getlist()
    
    },
    methods: {
      getTime(val) {
       if(val == "" || val == undefined){
          return ""
         }else {
          return uParseTime(val, '{y}-{m}-{d}')
         }
      },

      getTimeOne(val) {
       if(val == "" || val == undefined){
          return ""
         }else {
          return uParseTime(val, '{y}-{m}-{d} {h}:{i}')
         }
      },

      startTimeChange(val){
       
       this.start_time = val
       this.getlist()
      },
      endTimeChange(val){
       this.end_time = val
       this.getlist()
      },
      print(){
        this.$router.push({path:"/patient/patient/firstDisease/print?id="+this.form.id+"&patient_id="+this.patient_id})
      },
      tableRow(){

       },
      changeCurrentRecordTwo(row){
       
        this.form.id = 0
        if(row!=null){
          this.form.id = row.id 
          this.getFirstDetail(row.id)
        }
      },
      selectSummary(row){
        var arr = []
        for(let i=0;i<row.length;i++){
          arr.push(row[i].id)
        }
       var ids = arr.join(",")
       this.ids = ids
      },
     
      changeMainContent(content){
       this.form.main_content = content
      },
      changePatientCase(content){
       this.form.patient_case = content
      },
      changeTentativeDiagnosis(content){
      this.form.tentative_diagnosis = content
      },
      changeDiagnosticBasis(content){
       this.form.diagnostic_basis =content
      },
      changeDifferentialDiagnosis(content){
        this.form.differential_diagnosis = content
      },
      changeTreateMentContent(content){
        this.form.treatment_plan = content
      },
      
      createAction(){
       
         if(this.form.doctor == ""){
            this.form.doctor = 0
         }
         var params = {
          patient_id:parseInt(this.patient_id),
          title:this.form.title,
          main_content:this.$refs.editor.content,
          patient_case:this.$refs.editorOne.content,
          tentative_diagnosis:this.$refs.editorTwo.content,
          diagnostic_basis:this.$refs.editorThree.content,
          differential_diagnosis:this.$refs.editorFour.content,
          treatment_plan:this.$refs.editorFive.content,
          record_date:this.form.record_date,
          doctor:this.form.doctor,
         }
         console.log("params",params)
        
         createFirstDisease(params).then(response=>{
            if(response.data.state == 1){
              var list = response.data.data.firstDisease
             
              this.$message.success("保存成功!")
              this.show_dialog = false
              this.getlist()
            }
         })
      },
      getAllDoctorList(){
       getAllDoctorList().then(response=>{
          if(response.data.state == 1){
            var list = response.data.data.list

            this.doctorList = list
          }
       })
      },
      getTime(val) {
         if(val == ""){
          return ""
         }else {
          return uParseTime(val, '{y}-{m}-{d}')
         }
      },

      getlist(){
          var params = {
            start_time:this.start_time,
            end_time:this.end_time,
            patient_id:parseInt(this.patient_id),
          }
        getFirstDiseaseList(params).then(response=>{
           if(response.data.state ==1){
             var list =  response.data.data.list
             this.tableData = list
           }
        })
      },
      getDoctor(id){
        var name = ""
        for(let i=0;i<this.doctorList.length;i++){
          if(id == this.doctorList[i].admin_user_id){
             name = this.doctorList[i].user_name
          }
        }
        return name
      },
      getFirstDetail(id){
        getFirstDetail(id).then(response=>{
           if(response.data.state == 1){
             var detail = response.data.data.detail
            
             this.hosDetail = detail
           }
        })
      },
      getHospitalSummaryDetailOne(id){
        getFirstDetail(id).then(response=>{
           if(response.data.state == 1){
             var detail = response.data.data.detail
             console.log("detial------",detail)
             if(detail.doctor == 0){
               this.form.doctor = ""
             }
             this.form.id = detail.id
             this.form.title = detail.title
             this.form.record_date = this.getTimeOne(detail.record_date)
             this.form.doctor = detail.doctor
             this.form.main_content = detail.main_content
             this.form.patient_case = detail.patient_case
             this.form.tentative_diagnosis = detail.tentative_diagnosis
             this.form.diagnostic_basis = detail.diagnostic_basis
             this.form.differential_diagnosis = detail.differential_diagnosis
             this.form.treatment_plan =detail.treatment_plan
             this.edit_show_dialog = true
           }
        })
      },
      toEdit(){
        this.getHospitalSummaryDetailOne(this.form.id)
      },
      updateAction(){
    
        if(this.form.doctor == ""){
            this.form.doctor = 0
         }
         if(this.form.dean == ""){
           this.form.dean = 0
         }
      
         var params = {
          id:this.form.id,
          patient_id:parseInt(this.patient_id),
          title:this.form.title,
          doctor:this.form.doctor,
          record_date:this.form.record_date,
          main_content:this.$refs.editorTen.content,
          patient_case:this.$refs.editorTenOne.content,
          tentative_diagnosis:this.$refs.editorTenTwo.content,
          diagnostic_basis:this.$refs.editorTenThree.content,
          differential_diagnosis:this.$refs.editorTenFour.content,
          treatment_plan:this.$refs.editorTenFive.content,
         }
         console.log("poarams2323322323",params)
        updateFirstDisease(params).then(response=>{
          if(response.data.state == 1){
            var detail = response.data.data.detail
            this.edit_show_dialog = false
            // this.$refs.monthlyPlanTable.setCurrentRow(detail)
            this.getlist()
          }
        }) 
      },
      deleteAction(){
          if(this.ids.length == 0){
            this.$message.error("请勾选需要删除的数据")
            return false
          }
          this.$confirm('确认删除吗?', '删除', {
            confirmButtonText: '确 定',
            cancelButtonText: '取 消',
            type: 'warning'
         }).then(() => {
            var params = {
              ids:this.ids,
            }
            deleteFirstDisease(params).then(response => {
              if (response.data.state == 1) {
                  var msg = response.data.data.msg
                  this.getlist()
                  this.$message.success("删除成功")
              } else {
                  this.$message.error("删除失败")
              }
            })
          }).catch(() => {
          }) 
      },
      addAction(){
        this.form.title = ""
        this.form.main_content = ""
        this.form.patient_case = ""
        this.form.tentative_diagnosis = ""
        this.form.diagnostic_basis = ""
        this.form.differential_diagnosis = ""
        this.form.treatment_plan = ""
        
        this.show_dialog = true
      },
     
    },
    watch: {
      tableData: function() {
        this.$nextTick(function() {
          this.$refs.monthlyPlanTable.setCurrentRow(this.tableData[0])
        })
      }
    },
  
    
  }
</script>

<style rel="stylesheet/css" lang="scss" scoped>
  .borderBox{
    border: 1px solid #DCDFE6;
    padding: 10px;
    margin-top: 10px;
    border-radius: 4px;
    p{
      font-weight: bold;
      font-size: 20px;
      margin: 10px 0;
    }
  }
  .container {
    margin-left: 180px;
    padding: 20px;
    background: #fff;
    min-height: calc(100vh - 173px);
    margin-bottom: 15px;

  .record {
    padding-top: 20px;
  }

  }
  .record_content_panel {
    border-width: 1px;
    border-style: solid;
    border-color: #ebeef5;
    min-height: 200px;

  .title {
    font-size: 14px;
    font-weight: 500;
    color: #909399;
    line-height: 44px;
    height: 44px;
    text-align: center;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #ebeef5;
  }

  .content {
    padding: 12px 15px;
    font-size: 15px;
    color: gray;
    line-height: 22px;
  }

  }

  .new_record_form {

  /*/ / padding: 10 px, 25 px;*/

  .textarea_panel {
    margin-top: 10px;
  }

  }
</style>
<style>
.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group {
  border-color: #d0d3da;
}
.el-table--border::after,
.el-table--group::after,
.el-table::before {
  background-color: #d0d3da;
}
.el-select-dropdown {
  max-width: 1000px !important;
}
</style>