<template>
|
<div>
|
<el-input placeholder="请选择" :value="name" disabled>
|
{{ currentId }}
|
<el-button slot="append" v-if="currentId" icon="el-icon-circle-close" @click="handleClear"></el-button>
|
<el-button slot="append" v-else icon="el-icon-thumb" @click="handleClick"></el-button>
|
</el-input>
|
<el-dialog title="外设单元" :visible.sync="open" width="800px" :append-to-body="true" :destroy-on-close="true">
|
<peripheral-unit-list v-if="open" ref="peripheralRef" @setCurrentRow="getCurrentRow"></peripheral-unit-list>
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
<el-button @click="open = false">取 消</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import peripheralUnitList from "./list";
|
import {getPeripheralUnit} from "@/api/oa/peripheralUnit";
|
|
/**
|
* 外设单元
|
*/
|
export default {
|
name: "manufacturerInput",
|
components: {
|
peripheralUnitList
|
},
|
model: {
|
prop: 'value',
|
event: 'change'
|
},
|
props: {
|
value: {
|
type: [Number, String],
|
default: undefined
|
}
|
},
|
data() {
|
return {
|
open: false,
|
name: '',
|
currentId: ''
|
}
|
},
|
watch: {
|
'value': function (v) {
|
if (v) {
|
getPeripheralUnit(v).then(response => {
|
this.name = response.data.name;
|
this.currentId = response.data.id;
|
});
|
} else {
|
this.name = '';
|
this.currentId = ''
|
}
|
}
|
},
|
created() {
|
if (this.value) {
|
getPeripheralUnit(this.value).then(response => {
|
this.name = response.data.name;
|
this.currentId = response.data.id;
|
});
|
}
|
},
|
methods: {
|
handleClear () {
|
this.currentId = '';
|
this.name = undefined;
|
this.$emit("change", '');
|
},
|
getCurrentRow (e) {
|
this.currentId = e.id
|
},
|
handleClick() {
|
this.open = true;
|
},
|
submitForm() {
|
const row = this.$refs.peripheralRef.currentRow;
|
if (!row) {
|
this.$message.warning("请选择一条数据")
|
this.buttonLoading = false;
|
return;
|
}
|
this.name = row.name;
|
this.open = false;
|
this.$emit("change", row.id);
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
