FamilyInfo.vue 1.88 KB
<template>
  <div class="family-info">
    <el-table v-loading="loading" :data="familyList" style="width: 100%">
      <el-table-column label="关系" prop="relationship" align="center" />
      <el-table-column label="姓名" prop="familyPersonName" align="center" />
      <el-table-column label="身份证号" prop="cardId" align="center" />
      <el-table-column label="性别" align="center">
        <template slot-scope="scope">
          {{ scope.row.sex === '0' ? '男' : '女' }}
        </template>
      </el-table-column>
      <el-table-column label="联系方式" prop="phonenummber" align="center" />
      <el-table-column label="政治面貌" prop="politicalStatus" align="center" >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.ddic_per_political_status" :value="scope.row.politicalStatus" />
        </template>
      </el-table-column>
      <el-table-column label="工作单位" prop="workCompany" align="center" />
      <el-table-column label="备注" prop="remark" align="center" :show-overflow-tooltip="true" />
    </el-table>
  </div>
</template>

<script>
import { getFamilyInfo } from "@/api/resource/person";

export default {
  name: "FamilyInfo",
  dicts: ['ddic_per_political_status'],
  props: {
    personId: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      loading: false,
      familyList: []
    };
  },
  created() {
    this.getFamilyInfo();
  },
  methods: {
    getFamilyInfo() {
      this.loading = true;
      getFamilyInfo(this.personId).then(response => {
        this.familyList = response.data;
        this.loading = false;
      }).catch(() => {
        this.loading = false;
      });
    }
  }
};
</script>

<style scoped>
.image-slot {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: #f5f7fa;
  color: #909399;
  font-size: 30px;
}
</style>