<template>
|
<div>
|
<el-col :md="12" :lg="8" v-if="name.visible">
|
<el-form-item :label="name.filedDescription" :prop="name.name+'.value'" :rules="rules">
|
<!-- <el-input v-model="nameVal" readonly @focus="handelDialog($event)"></el-input> -->
|
<el-select
|
v-model="nameVal"
|
filterable
|
remote
|
:disabled='!name.writeAble'
|
@change="EnterpriseList"
|
reserve-keyword
|
placeholder="请输入关键词"
|
:remote-method="remoteMethod"
|
:loading="loading"
|
@focus="focus"
|
>
|
<el-option
|
v-for="(item,index) in headOfficeEnpList"
|
:key="index"
|
:label="item.enterprisename"
|
:value="item.enterprisename">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<!-- 总公司组织机构代码 -->
|
<el-col :md="12" :lg="8" v-if="code.visible">
|
<el-form-item :label="code.filedDescription" :prop="code.name+'.value'" >
|
<!-- <el-input v-model="codeVal" readonly @focus="handelDialog"></el-input> -->
|
<el-input v-model="codeVal" readonly></el-input>
|
</el-form-item>
|
</el-col>
|
<!-- 总公司统一社会信用代码 -->
|
<el-col :md="12" :lg="8" v-if="reditcode.visible">
|
<el-form-item :label="reditcode.filedDescription" :prop="reditcode.name+'.value'" >
|
<!-- <el-input v-model="reditcodeVal" readonly @focus="handelDialog"></el-input> -->
|
<el-input v-model="reditcodeVal" readonly></el-input>
|
</el-form-item>
|
</el-col>
|
<head-office-dialog :show-dialog.sync="showDialog" @setInputValue="setInputValue"></head-office-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { qryHeadOfficeEnpList } from '@/api/area/enterprise' // 引入查询总公司列表api
|
import HeadOfficeDialog from './HeadOfficeDialog'
|
export default {
|
components: { HeadOfficeDialog },
|
props: ['name', 'code', 'reditcode'],
|
data: function() {
|
return {
|
showDialog: false,
|
loading: false,
|
rules: { required: true, message: '请输入', trigger: 'blur' },
|
headOfficeEnpList: [],
|
listQuery: {
|
currentPage: 1,
|
pageSize: 500
|
}
|
}
|
},
|
created() {
|
this.selectEnpList()
|
},
|
computed: {
|
nameVal: {
|
get() {
|
return this.name.value
|
},
|
set(newVal) {
|
this.name.value = newVal
|
this.$emit('update:name', this.name)
|
}
|
},
|
codeVal: {
|
get() {
|
return this.code.value
|
},
|
set(newVal) {
|
this.code.value = newVal
|
this.$emit('update:code', this.code)
|
}
|
},
|
reditcodeVal: {
|
get() {
|
return this.reditcode.value
|
},
|
set(newVal) {
|
this.reditcode.value = newVal
|
this.$emit('update:reditcode', this.reditcode)
|
}
|
}
|
},
|
methods: {
|
async selectEnpList() {
|
let params = {}
|
Object.assign(params, this.listQuery)
|
let res = await qryHeadOfficeEnpList(params)
|
this.headOfficeEnpList = res.result.records
|
},
|
EnterpriseList(value) {
|
let res = this.headOfficeEnpList.filter(item => item.enterprisename === value)
|
this.codeVal = res[0].organizationcode
|
this.reditcodeVal = res[0].reditcode
|
},
|
handelDialog() {
|
this.showDialog = true
|
},
|
setInputValue(value) {
|
this.nameVal = value.enterprisename
|
this.codeVal = value.organizationcode
|
this.reditcodeVal = value.reditcode
|
},
|
remoteMethod(query) {
|
if (query !== '') {
|
let params = {
|
currentPage: 1,
|
pageSize: 10,
|
enterprisename: query
|
}
|
this.loading = true
|
setTimeout(() => {
|
qryHeadOfficeEnpList(params).then(res => {
|
if (res.code === '00') {
|
this.headOfficeEnpList = res.result.records
|
this.loading = false
|
}
|
})
|
}, 200)
|
} else {
|
this.headOfficeEnpList = []
|
}
|
},
|
focus() {
|
if (this._.isEmpty(this.headOfficeEnpList)) {
|
let params = {
|
currentPage: 1,
|
pageSize: 500,
|
enterprisename: ''
|
}
|
setTimeout(() => {
|
qryHeadOfficeEnpList(params).then(res => {
|
if (res.code === '00') {
|
this.headOfficeEnpList = res.result.records
|
}
|
})
|
}, 300)
|
}
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
