修改基本信息

src/views/patients/mypatients-manage/basic-info.vue

+<template>
+  <div class="resident-list">
+    <bread-crumb
+      :curmbFirst="curmbFirst"
+      :curmbSecond="curmbSecond"
+      :curmbThird="curmbThird"
+      :jumPathThird="jumPathThird">
+    </bread-crumb>
+    <div class="f-main-content screenSet">
+      <div class="header-title">
+        <span>基本信息</span>
+        <p><el-button plain size="small">取消</el-button><el-button type="primary" size="small">保存</el-button></p>
+      </div>
+      <edit-information></edit-information>
+    </div>
+  </div>
+</template>
+
+<script>
+  import BreadCrumb from '@/components/breadcrumb'
+  import editInformation from './components/edit-information'
+  import { mapGetters } from 'vuex'
+  import { getDiseasesList, getPatientDetail, getRemindPatient, deletePatient,savePatientInfo } from '@/utils/patients/patientsapi'
+  export default {
+    name: "basicInfo",
+    components: {
+      BreadCrumb,
+      editInformation
+    },
+    data() {
+      return {
+        /*面包屑配置*/
+        curmbFirst: '居民管理',
+        curmbSecond: '我的居民',
+        curmbThird: '居民详情',
+        jumPathThird: '/patients-manage/mypatients-manage/patients-list',
+        patientId: '99997786', //暂时写死一个居民的patientId
+        patientInfo: {
+          isWechatBind: 1,
+          remark: '',
+        },
+        showLabelName: '',
+        showDiseaseName: '',
+        birthTimeDisplay: '',
+        recordList: [{}],
+      }
+    },
+    created() {
+      this.init();
+      // getDiseasesList().then(({data}) => {
+      //   console.log('获取所有疾病',data)
+      // })
+
+    },
+    computed: {
+      // ...mapState('planManage',{
+      //   remarkOption: state => state.remarkOption,
+      //   templateOptions: state => state.templateOptions,
+      // })
+      ...mapGetters([
+        '_token',
+      ])
+    },
+    methods: {
+      // ...mapActions('planManage', ['getTimeNodeList','getRemarkOption','getFollowupTemplate']),
+      init() {
+        getPatientDetail(this.patientId).then((data) => {
+          if(data.code == '000000') {
+            this.patientInfo = data.data;
+            if(this.patientInfo){
+              let customLabels = this.patientInfo.customLabels;
+              let diseases = this.patientInfo.diseases;
+              let groupLabelNames = [];
+              let groupDiseaseNames = [];
+              //对出生日期的处理
+              if(this.patientInfo.birthTime){
+                let timeArr = this.patientInfo.birthTime.split('-');
+                let mm = parseInt(timeArr[1]) < 10 ? `0${parseInt(timeArr[1])}` : parseInt(timeArr[1]);
+                let dd = parseInt(timeArr[2]) < 10 ? `0${parseInt(timeArr[2])}` : parseInt(timeArr[2]);
+                this.birthTimeDisplay = `${timeArr[0]}-${mm}-${dd}`;
+              }else {
+                this.birthTimeDisplay = '';
+              }
+              // 对分组的处理
+              if(customLabels) {
+                customLabels.forEach(item => {
+                  groupLabelNames.push(item.label)
+                });
+                this.showLabelName = groupLabelNames.join('；');
+              } else {
+                this.showLabelName = '';
+              }
+              // 对诊断疾病的处理
+              if(diseases) {
+                diseases.forEach(item => {
+                  groupDiseaseNames.push(item.diseaseName)
+                });
+                this.showDiseaseName = groupDiseaseNames.join('；');
+              } else {
+                this.showDiseaseName = '';
+              }
+            }
+          }
+        })
+      },
+      //提醒绑定
+      remindBind() {
+        let remindMobileWechatPara = {
+          qrcodeType: 1,
+          patientId: this.patientId,
+          // deviceInfo: window.getDeviceInfo()
+        }
+        getRemindPatient({
+          ...remindMobileWechatPara
+        }).then( data => {
+          if(data.code == '000000') {
+            this.$message.success(data.data.respMsg);
+          }else {
+            this.$message.error(data.message);
+          }
+        })
+      },
+      //保存备注
+      saveRemark() {
+        savePatientInfo(this.patientInfo).then(data => {
+          if(data.code == '000000'){
+            this.$message.success('保存备注成功')
+          }else {
+            this.$message.error(data.message);
+          }
+        })
+      },
+    },
+    filters: {
+      emptyFilter: function(value) {
+        if (!value) {
+          return '-';
+        } else {
+          return value;
+        }
+      },
+      sexFileter: function(value) {
+        if (!value && value != 0) {
+          return '-';
+        } else {
+          let hash = {
+            1: '男',
+            2: '女'
+          };
+          return hash[value];
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+  @import '../../../style/patients-style/element-reset.css';
+
+  .f-main-content{
+    background: #ffffff;
+    padding: 30px;
+    .header-title{
+      display: flex;
+      display: -webkit-flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 2px solid #E4E7ED;
+      padding-bottom: 10px;
+    }
+
+    .right-btn-group{
+      position: absolute;
+      right: 60px;
+      z-index: 1800;
+    }
+    .section{
+      .item{
+        display: flex;
+        font-size: 14px;
+        div{
+          display: flex;
+          flex: 1;
+          line-height: 36px;
+          .title{
+            width: 180px;
+            text-align: right;
+          }
+          .info{
+            color: #999;
+            padding-left: 15px;
+            width: 100%;
+          }
+        }
+        &.wrap-p{
+          div{
+            line-height: 28px;
+          }
+        }
+        .btn-right{
+          width: 35%;
+          padding-left:10px;
+        }
+      }
+      .has-header{
+        display: flex;
+        justify-content: space-between;
+        padding: 15px 0;
+        margin-bottom: 15px;
+        border-bottom: 1px dashed #888;
+        .right-p{
+          display: inline-block;
+          text-align: right;
+          color: #999;
+          font-size: 14px;
+          span:last-child{
+            margin-left: 15px;
+          }
+        }
+      }
+    }
+    .health-record-list{
+      .item{
+        width: 100%;
+        margin-bottom: 15px;
+        .record-date{
+          color: #999;
+          padding-bottom: 10px;
+        }
+        .record-content{
+          width: 100%;
+          border: 1px solid #E4E7ED;
+          border-radius: 5px;
+          padding: 10px 15px 13px;
+          .record-title{
+            display: flex;
+            justify-content: space-between;
+            padding: 5px 0;
+            span{
+              color: #999;
+              font-size: 14px;
+            }
+          }
+          .list-visit{
+            line-height: 28px;
+            padding: 6px 0 2px;
+            display: flex;
+            display: -webkit-flex;
+            align-items: flex-start;
+            font-size: 14px;
+            color: #999;
+            .left-label{
+              line-height: 28px;
+            }
+            .right-item{
+              flex: 1;
+              line-height: 28px;
+              p{
+                line-height: 28px;
+                .check-btn{
+                  color: #449284;
+                  cursor: pointer;
+                  margin-left: 15px;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    .no-record-content{
+      @media screen and (min-width:1240px) and (max-width:1545px){
+        height: 300px;
+      }
+      @media screen and (min-width:1545px) and (max-width:1600px){
+        height: 500px;
+      }
+      @media screen and (min-width:1600px){
+        height: 600px;
+      }
+      text-align: center;
+      padding: 50px 0 60px;
+      img{
+        width: 120px;
+      }
+      p{
+        color: #B9B9C6;
+        font-size: 20px;
+      }
+    }
+    .ml10{
+      margin-left: 10px;
+    }
+  }
+</style>

src/views/patients/mypatients-manage/components/edit-information.vue

@@ -83,6 +83,44 @@
           </el-form-item>
         </el-col>
       </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="常驻类型" prop="diseaseIdList">
+            <el-select v-model="patientInfoForm.diseaseIdList" multiple placeholder="请选择居民疾病诊断">
+              <el-option
+                v-for="item in diseasesList"
+                :key="item.diseaseId"
+                :label="item.diseaseName"
+                :value="item.diseaseId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="民族" prop="labelIdList">
+            <el-select v-model="patientInfoForm.labelIdList" multiple placeholder="请选择居民分组">
+              <el-option
+                v-for="item in labelsList"
+                :key="item.labelId"
+                :label="item.labelName"
+                :value="item.labelId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="医保号" prop="socialCard">
+            <el-input v-model="patientInfoForm.socialCard" placeholder="请输入居民医保卡号码"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="健康档案编号" prop="fileLocator">
+            <el-input v-model="patientInfoForm.fileLocator" placeholder="请输入居民健康档案编号"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
   </div>
 </template>
@@ -104,6 +142,8 @@
           idNo: '',
           birthTime: '',
           age: '',
+          socialCard: '',
+          fileLocator: '',
         },
         rules: {
           nickname: [{required: true, message: '请输入居民姓名', trigger: ['change', 'blur'] }],