query-detail.vue

<template lang="pug">
el-dialog( :close-on-click-modal="false", :visible.sync="visible", :append-to-body="true", :before-close="handleClose" )
  .title-bold(slot="title") {{'详情' }}
  el-form( :model="dataForm", :rules="dataRule", ref="dataForm", label-width="100px" )
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="所属机构:", prop="orgId")
          el-input.mywidth(v-model="dataForm.orgId" readonly)
      el-col(:span="12")
        el-form-item(label="用户姓名:", prop="name")
          el-input.mywidth(v-model="dataForm.name" readonly)
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="用户账号:", prop="username")
          el-input.mywidth( v-model="dataForm.username" readonly)
      el-col(:span="12")
        el-form-item(label="用户岗位:", prop="job")
          el-input.mywidth(v-model="dataForm.jobName" readonly)
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="工种:", prop="work")
          el-input.mywidth(v-model="dataForm.work" readonly)
      el-col(:span="12")
        el-form-item(label="手机号码:", prop="mobile")
          el-input.mywidth(v-model="dataForm.mobile" readonly)
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="身份证号:", prop="idCard")
          el-input.mywidth(v-model="dataForm.idCard" readonly)
      el-col(:span="12")
        el-form-item(label="电子邮箱:", prop="email")
          el-input.mywidth( v-model="dataForm.email" readonly )
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="学历:", prop="education")
          el-input.mywidth(v-model="dataForm.education" readonly)
      el-col(:span="12")
        el-form-item(label="民族:", prop="nation")
          el-input.mywidth(v-model="dataForm.nationName" readonly)
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="入职时间:", prop="entryTime")
          el-date-picker.mywidth(v-model="dataForm.entryTime", value-format="yyyy-MM-dd", type="date" readonly)
      el-col(:span="12")
        el-form-item(label="工号:", prop="jobNumber")
          el-input.mywidth( v-model="dataForm.jobNumber" readonly )
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="政治面貌:", prop="politicCountenances")
          el-input.mywidth(v-model="dataForm.politicCountenance" readonly)
    el-row(:span="24")
      el-col(:span="12")
        el-form-item(label="性别:", size="mini", prop="gender")
          el-radio-group.my_radio(disabled v-model="dataForm.gender")
            el-radio(:label="1") 男
            el-radio(:label="0") 女
      el-col(:span="12")
        el-form-item(label="账号状态:", size="mini", prop="status")
          el-radio-group.my_radio(disabled v-model="dataForm.status")
            el-radio(:label="1") 正常
            el-radio(:label="0") 禁用
  div(slot="footer")
    el-button(type="primary", size="medium" @click='visible = false') 关闭
</template>

<script>
export default {
  data() {
    return {
      id: '',
      show: false,
      clickFlag: false,
      visible: false,
      roleList: [],
      allJob: [],
      treeData: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      nations: [],
      checkedNode: {},
      sysOrgList: [],
      dataListSelections: [],
      educations: [
        { id: '1', name: '高中' },
        { id: '2', name: '中专' },
        { id: '3', name: '大专' },
        { id: '4', name: '本科' },
        { id: '5', name: '硕士研究生' },
        { id: '6', name: '博士研究生' },
        { id: '7', name: '其它' }
      ],
      politicCountenances: [
        { id: '1', name: '共青团员' },
        { id: '2', name: '预备党员' },
        { id: '3', name: '党员' },
        { id: '4', name: '群众' },
        { id: '5', name: '其它' }
      ],
      dataForm: {
        userId: '',
        orgId: '',
        name: '',
        username: '',
        password: '',
        comfirmPassword: '',
        job: '',
        work: '',
        mobile: '',
        idCard: '',
        email: '',
        education: '',
        nation: '',
        entryTime: '',
        jobNumber: '',
        politicCountenance: '',
        gender: 1,
        status: 1,
        stationId: localStorage.getItem('stationId')
        // byx1:'',
      },
      dataRule: {}
    }
  },
  mounted() {
    this.getAllJob()
    this.getNation()
  },
  methods: {
    init(id) {
      this.clickFlag = false
      this.visible = true
      this.id = id || ''
      if (id) {
        //移除输入密码框
        this.show = false
        this.dataForm.password = null
        this.dataForm.comfirmPassword = null
        this.$http({
          url: this.$http.adornUrl('/sys/user/info/' + id),
          method: 'get',
          params: this.$http.adornParams()
        }).then((data) => {
          // console.log(data)
          this.dataForm = data.user || {}
          this.dataForm.stationId = localStorage.getItem('stationId')
          this.allJob.map((item) => {
            if (item.id === this.dataForm.job) {
              this.dataForm.jobName = item.name
            }
          })
          this.nations.map((item) => {
            if (item.id.toString() === this.dataForm.nation) {
              this.dataForm.nationName = item.name
            }
          })
        })
      } else {
        this.show = true
        this.dataForm = {
          user_id: '',
          orgId: '',
          name: '',
          username: '',
          password: '',
          comfirmPassword: '',
          job: '',
          jobName: '',
          work: '',
          mobile: '',
          idCard: '',
          email: '',
          education: '',
          nation: '',
          nationName: '',
          entryTime: '',
          jobNumber: '',
          politicCountenance: '',
          gender: 1,
          status: 1,
          stationId: localStorage.getItem('stationId')
          // byx1: ''
        }
      }
    },
    //关闭前
    handleClose() {
      this.visible = false
      this.$refs.dataForm.resetFields()
    },
    //获取民族信息
    getNation() {
      this.$http({
        url: this.$http.adornUrl('/sys/user/getAllNation'),
        method: 'get'
      }).then((data) => {
        // console.log("data", data);
        if (data && data.code === 0) {
          this.nations = data.result
        }
      })
    },
    //获取职业字典信息
    getAllJob() {
      this.$http({
        url: this.$http.adornUrl('/sysDictionary/getAllJobList'),
        method: 'get',
        params: this.$http.adornParams({
          stationId: localStorage.getItem('stationId')
        })
      }).then((data) => {
        if (data && data.code === 0) {
          this.allJob = data.list
        } else {
          this.$message.error(data.msg)
        }
      })
    }
  }
}
</script>
<style>
.el-table__header {
  width: 100% !important;
}

.el-table__body {
  width: 100% !important;
}
</style>