linwe
2025-10-28 0b7c058f89b458fed7f2eb889c04e8b4992c5e05
src/components/prmDialog/index.vue
@@ -1,189 +1,189 @@
<template>
    <el-dialog class="syld-details-box prm-dialog-popup business-detail-box" :title="'从业人员详情'" append-to-body
        :close-on-click-modal="false" :visible.sync="popupShow" center @close="popupClose">
        <div class="all-box">
            <div class="item-box">
                <div class="label">工作场所名称:</div>
                <div class="value">{{ rowDetail.placeName }}</div>
  <el-dialog class="syld-details-box prm-dialog-popup business-detail-box" :title="'从业人员详情'" append-to-body
    :close-on-click-modal="false" :visible.sync="popupShow" center @close="popupClose">
    <div class="all-box">
      <div class="item-box">
        <div class="label">工作场所名称:</div>
        <div class="value">{{ rowDetail.placeName }}</div>
      </div>
      <div class="item-box">
        <div class="label">工作场所地址:</div>
        <div class="value">{{ rowDetail.location }}</div>
      </div>
      <div class="item-box">
        <div class="label">工作场所负责人:</div>
        <div class="value">{{ rowDetail.principal }}</div>
      </div>
      <div class="item-box">
        <div class="label">负责人电话:</div>
        <div class="value">{{ rowDetail.principalPhone }}</div>
      </div>
      <div class="item-box">
        <div class="label">姓名:</div>
        <div class="value">{{ rowDetail.name }}</div>
      </div>
      <div class="item-box">
        <div class="label">性别:</div>
        <div class="value">{{ rowDetail.gender == 1 ? '男' : '女' }}</div>
      </div>
      <div class="item-box">
        <div class="label">民族:</div>
        <div class="value">{{ rowDetail.ethnicty }}</div>
      </div>
      <div class="item-box">
        <div class="label">身份证号:</div>
        <div class="value">{{ rowDetail.idCard }}</div>
      </div>
      <div class="item-box">
        <div class="label">电话号码:</div>
        <div class="value">{{ rowDetail.telephone }}</div>
      </div>
      <div class="item-box">
        <div class="label">年龄:</div>
        <div class="value">{{ rowDetail.age }}</div>
      </div>
      <div class="item-box">
        <div class="label">岗位:</div>
        <div class="value">{{ rowDetail.jobNature }}</div>
      </div>
      <div class="item-box">
        <div class="label">从业人员照片:</div>
        <div class="value">
          <el-image
            :style="{ width: rowDetail.employerImg != '' ? '100px' : '', height: rowDetail.employerImg != '' ? '100px' : '' }"
            :src="rowDetail.employerImg" :preview-src-list="rowDetail.employerImg">
            <div slot="error" class="image-slot">
              <i class="el-icon-picture-outline"></i> 暂无图片
            </div>
            <div class="item-box">
                <div class="label">工作场所地址:</div>
                <div class="value">{{ rowDetail.location }}</div>
            </div>
            <div class="item-box">
                <div class="label">工作场所负责人:</div>
                <div class="value">{{ rowDetail.principal }}</div>
            </div>
            <div class="item-box">
                <div class="label">负责人电话:</div>
                <div class="value">{{ rowDetail.principalPhone }}</div>
            </div>
            <div class="item-box">
                <div class="label">姓名:</div>
                <div class="value">{{ rowDetail.name }}</div>
            </div>
            <div class="item-box">
                <div class="label">性别:</div>
                <div class="value">{{ rowDetail.gender == 1 ? '男' : '女' }}</div>
            </div>
            <div class="item-box">
                <div class="label">民族:</div>
                <div class="value">{{ rowDetail.ethnicty }}</div>
            </div>
            <div class="item-box">
                <div class="label">身份证号:</div>
                <div class="value">{{ rowDetail.idCard }}</div>
            </div>
            <div class="item-box">
                <div class="label">电话号码:</div>
                <div class="value">{{ rowDetail.telephone }}</div>
            </div>
            <div class="item-box">
                <div class="label">年龄:</div>
                <div class="value">{{ rowDetail.age }}</div>
            </div>
            <div class="item-box">
                <div class="label">岗位:</div>
                <div class="value">{{ rowDetail.jobNature }}</div>
            </div>
            <div class="item-box">
                <div class="label">从业人员照片:</div>
                <div class="value">
                    <el-image
                        :style="{ width: rowDetail.employerImg != '' ? '100px' : '', height: rowDetail.employerImg != '' ? '100px' : '' }"
                        :src="rowDetail.employerImg" :preview-src-list="rowDetail.employerImg">
                        <div slot="error" class="image-slot">
                            <i class="el-icon-picture-outline"></i> 暂无图片
                        </div>
                    </el-image>
                </div>
            </div>
            <div class="item-box">
                <div class="label">工作单位:</div>
                <div class="value">{{ rowDetail.employer }}</div>
            </div>
            <div class="item-box">
                <div class="label">在职状态:</div>
                <div class="value">{{ rowDetail.resignationFlag == 1 ? '在职' : '离职' }}</div>
            </div>
            <div class="item-box">
                <div class="label">入职时间:</div>
                <div class="value">{{ rowDetail.employmentTime }}</div>
            </div>
            <div class="item-box">
                <div class="label">离职时间:</div>
                <div class="value">{{ rowDetail.resignationTime }}</div>
            </div>
            <div class="item-box">
                <div class="label">现有住址:</div>
                <div class="value">{{ rowDetail.tempAddress }}</div>
            </div>
            <div class="item-box">
                <div class="label">是否有前科:</div>
                <div class="value">{{ rowDetail.criminalRecordFlag == 1 ? '是' : '否' }}</div>
            </div>
            <div class="item-box">
                <div class="label">前科类型:</div>
                <div class="value">{{ rowDetail.anoTypeName }}</div>
            </div>
          </el-image>
        </div>
    </el-dialog>
      </div>
      <div class="item-box">
        <div class="label">工作单位:</div>
        <div class="value">{{ rowDetail.employer }}</div>
      </div>
      <div class="item-box">
        <div class="label">在职状态:</div>
        <div class="value">{{ rowDetail.resignationFlag == 1 ? '在职' : '离职' }}</div>
      </div>
      <div class="item-box">
        <div class="label">入职时间:</div>
        <div class="value">{{ rowDetail.employmentTime }}</div>
      </div>
      <div class="item-box">
        <div class="label">离职时间:</div>
        <div class="value">{{ rowDetail.resignationTime }}</div>
      </div>
      <div class="item-box">
        <div class="label">现有住址:</div>
        <div class="value">{{ rowDetail.tempAddress }}</div>
      </div>
      <div class="item-box">
        <div class="label">是否有前科:</div>
        <div class="value">{{ rowDetail.criminalRecordFlag == 1 ? '是' : '否' }}</div>
      </div>
      <div class="item-box">
        <div class="label">前科类型:</div>
        <div class="value">{{ rowDetail.anoTypeName }}</div>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import { getDetail, getCardType } from "@/api/practitionersManage/index.js"
export default {
    name: 'PrmDialogPopup',
  name: 'PrmDialogPopup',
    data () {
        return {
            popupShow: false,
            rowDetail: {},
            cardTypeOptions: []
        }
  data () {
    return {
      popupShow: false,
      rowDetail: {},
      cardTypeOptions: []
    }
  },
  created () {
    this.getCardType()
  },
  methods: {
    // 打开弹窗初始化数据
    initOpen (row) {
      this.popupShow = true
      getDetail({ id: row.id }).then(res => {
        let data = res.data.data
        data.employerImg = this.getImgUrls(data.employerImg)
        this.cardTypeOptions.forEach(item => {
          if (item.key == data.cardType) {
            data.cardType = item.title
          }
        })
        this.rowDetail = data
      })
    },
    created () {
        this.getCardType()
    // 关闭弹窗按钮
    popupClose () {
      this.popupShow = false
    },
    methods: {
        // 打开弹窗初始化数据
        initOpen (row) {
            this.popupShow = true
            getDetail({ id: row.id }).then(res => {
                let data = res.data.data
                data.employerImg = this.getImgUrls(data.employerImg)
                this.cardTypeOptions.forEach(item => {
                    if (item.key == data.cardType) {
                        data.cardType = item.title
                    }
                })
                this.rowDetail = data
            })
        },
        // 关闭弹窗按钮
        popupClose () {
            this.popupShow = false
        },
        // 图片转换
        getImgUrls (imageUrls) {
            if (imageUrls && imageUrls != '' && imageUrls.length > 0) {
                imageUrls = imageUrls.split(',').filter(ele => ele != '').map(ele => {
                    return 'http://10.141.11.11/place/' + ele
                    // return 'https://srgdjczzxtpt.com:2080/gminio/jczz/' + ele
                })
            }
            return imageUrls || []
        },
        // 获取证件类型字典
        getCardType () {
            getCardType().then(res => {
                this.cardTypeOptions = res.data.data
            })
        },
    // 图片转换
    getImgUrls (imageUrls) {
      if (imageUrls && imageUrls != '' && imageUrls.length > 0) {
        imageUrls = imageUrls.split(',').filter(ele => ele != '').map(ele => {
          return 'http://47.217.32.232:80/place/' + ele
          // return 'https://srgdjczzxtpt.com:2080/gminio/jczz/' + ele
        })
      }
      return imageUrls || []
    },
    // 获取证件类型字典
    getCardType () {
      getCardType().then(res => {
        this.cardTypeOptions = res.data.data
      })
    },
  },
}
</script>
<style lang="scss" scoped>
:deep(.el-image__error) {
    height: 120px;
  height: 120px;
}
.flex {
    display: flex;
  display: flex;
}
.f-d-c {
    flex-direction: column;
  flex-direction: column;
}
.flex-1 {
    height: 0;
    flex: 1;
  height: 0;
  flex: 1;
}
.all-box {
  display: flex;
  flex-wrap: wrap;
  .item-box {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    .item-box {
        width: 50%;
        display: flex;
        // height: 40px;
        margin-bottom: 20px;
    // height: 40px;
    margin-bottom: 20px;
        .label {
            min-width: 120px;
            text-align: right;
            padding-right: 10px;
        }
    .label {
      min-width: 120px;
      text-align: right;
      padding-right: 10px;
    }
  }
}
</style>