<template>
<el-dialog title="详情"
           :close-on-click-modal="false" append-to-body
           :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll
           width="600px">
<el-row :gutter="15" class="">
<el-form ref="formRef" :model="dataForm" size="small" label-width="150px" label-position="right" >
    <template v-if="!loading">
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="批次ID"  
 prop="batchId"  >
                    <JnpfInput    v-model="dataForm.batchId"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.batchId">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="人员编码"  
 prop="code"  >
                    <JnpfInput    v-model="dataForm.code"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.code">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="姓名"  
 prop="name"  >
                    <JnpfInput    v-model="dataForm.name"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.name">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="账户"  
 prop="namePinyin"  >
                    <JnpfInput    v-model="dataForm.namePinyin"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.namePinyin">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="人员类型"  
 prop="personnelType"  >
                        <p>{{dataForm.personnelType}}</p>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="性别"  
 prop="gender"  >
                        <p>{{dataForm.gender}}</p>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="联系电话"  
 prop="mobile"  >
                    <JnpfInput    v-model="dataForm.mobile"
 placeholder="请输入"  :maxlength="11"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.mobile">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="邮箱"  
 prop="email"  >
                    <JnpfInput    v-model="dataForm.email"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.email">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="岗位状态"  
 prop="jobStatus"  >
                        <p>{{dataForm.jobStatus}}</p>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="人员状态"  
 prop="personStatus"  >
                        <p>{{dataForm.personStatus}}</p>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="微信unionid"  
 prop="unionid"  >
                    <JnpfInput    v-model="dataForm.unionid"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.unionid">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="所属组织编码"  
 prop="organizationCode"  >
                    <JnpfInput    v-model="dataForm.organizationCode"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.organizationCode">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="所属组织名称"  
 prop="organizationName"  >
                    <JnpfInput    v-model="dataForm.organizationName"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.organizationName">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="部门编码"  
 prop="departmentCode"  >
                    <JnpfInput    v-model="dataForm.departmentCode"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.departmentCode">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="部门名称"  
 prop="departmentName"  >
                    <JnpfInput    v-model="dataForm.departmentName"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.departmentName">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="Itsm用户id"  
 prop="itsmUserId"  >
                    <JnpfInput    v-model="dataForm.itsmUserId"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.itsmUserId">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="itsm用户姓名"  
 prop="itsmUserName"  >
                    <JnpfInput    v-model="dataForm.itsmUserName"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.itsmUserName">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="itsm用户别名"  
 prop="itsmUserAlias"  >
                    <JnpfInput    v-model="dataForm.itsmUserAlias"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.itsmUserAlias">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="企微账号"  
 prop="enterpriseWechat"  >
                    <JnpfInput    v-model="dataForm.enterpriseWechat"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.enterpriseWechat">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="响应数据编码"  
 prop="resCode"  >
                    <JnpfInput    v-model="dataForm.resCode"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.resCode">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="响应状态"  
 prop="resStatus"  >
                        <p>{{dataForm.resStatus}}</p>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="响应数据描述"  
 prop="resMessage"  >
                    <JnpfInput    v-model="dataForm.resMessage"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.resMessage">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
            <el-col :span="24"  >
                <jnpf-form-tip-item  label="响应数据版本"  
 prop="resVersion"  >
                    <JnpfInput    v-model="dataForm.resVersion"
 placeholder="请输入"  disabled
 detailed  clearable  :style='{"width":"100%"}' :maskConfig = "maskConfig.resVersion">
                </JnpfInput>
                </jnpf-form-tip-item>
            </el-col>
    </template>
</el-form>
    </el-row>
    <span slot="footer" class="dialog-footer">
        <el-button @click="visible = false"> 取 消</el-button>
    </span>
    <Detail v-if="detailVisible" ref="Detail" @close="detailVisible = false" />
    </el-dialog>
</template>
<script>
    import request from '@/utils/request'

    import { getConfigData } from '@/api/onlineDev/visualDev'
    import jnpf from '@/utils/jnpf'
    import Detail from '@/views/basic/dynamicModel/list/detail'
    import { thousandsFormat } from "@/components/Generator/utils/index"
    export default {
        components: { Detail},
        props: [],
        data() {
            return {
                visible: false,
                detailVisible: false,
                loading: false,

                //掩码配置
                maskConfig: {
                            batchId: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            code: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            name: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            namePinyin: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            mobile: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            email: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            unionid: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            organizationCode: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            organizationName: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            departmentCode: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            departmentName: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            itsmUserId: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            itsmUserName: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            itsmUserAlias: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            enterpriseWechat: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            resCode: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            resMessage: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                            resVersion: {"prefixType":1,"useUnrealMask":false,"maskType":1,"unrealMaskLength":1,"prefixLimit":0,"suffixLimit":0,"filler":"*","prefixSpecifyChar":"","suffixType":1,"ignoreChar":"","suffixSpecifyChar":""} ,
                },
                //定位属性
                locationScope: {
                },

            dataForm: {

            },
                        personnelTypeProps:{"label":"fullName","value":"enCode"  },
                        genderProps:{"label":"fullName","value":"enCode"  },
                        jobStatusProps:{"label":"fullName","value":"enCode"  },
                        personStatusProps:{"label":"fullName","value":"enCode"  },
                        resStatusProps:{"label":"fullName","value":"enCode"  },

        }
        },
        computed: {},
        watch: {},
        created() {

        },
        mounted() {},
        methods: {
            toDetail(defaultValue, modelId) {
                if (!defaultValue) return
                getConfigData(modelId).then(res => {
                    if (!res.data || !res.data.formData) return
                    let formData = JSON.parse(res.data.formData)
                    formData.popupType = 'general'
                    this.detailVisible = true
                    this.$nextTick(() => {
                        this.$refs.Detail.init(formData, modelId, defaultValue)
                    })
                })
            },
            dataInfo(dataAll){
                let _dataAll =dataAll
                this.dataForm = _dataAll
            },

            init(id) {
                this.dataForm.id = id || 0;
                this.visible = true;
                this.$nextTick(() => {
                    if(this.dataForm.id){
                        this.loading = true
                        request({
                            url: '/api/jnpf/MdmUserDetail/detail/'+this.dataForm.id,
                            method: 'get'
                        }).then(res => {
                            this.dataInfo(res.data)
                            this.loading = false
                        })
                    }

                })
            },
        },
    }

</script>
