selection-input.vue
3.11 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<template>
<div class="epi-form" style="width:300px; display:inline-block;">
<div class="group-row" style="height:40px;">
<div class="form-group">
<!-- <div class="div-select-item"></div>
-->
<div class="control select-style" style="position:relative; width: 200px;right: 45px;">
<input type="text"
v-model="txtName"
class="input_1"
style="border-right: 0;position: absolute; top: 0px; width:150px; z-index:4"
@change="changeSelectValue"
value="{{txtNameValue}}">
<select v-model="selected"
@click="selectChange(selected||json)"
style="position: absolute;"
@change="getDTemplate(selected)">
<option v-if="empty" value="">{{emptytext}}</option>
<option v-for="item in list" :value="(item.value || item)">{{ item.label || item }}</option>
</select>
</div>
</div>
</div>
</div>
</template>
<script>
module.exports = {
props: {
list: {
type: Array,
require: true
},
selected: {
twoWay: true
},
selectedId: {
twoWay: true
},
empty: {
type: Boolean,
default: true
},
emptytext: {
type: String,
default: '--请选择--'
},
changedobject:{
type: Object,
twoWay: true
}
},
data: function (){
return{
txtNameValue:'',
txtName:''
};
},
computed: {
txtNameValue: function () {
var self = this;
if (self.selected!=null && self.selected!=undefined){
self.selectChange(self.selected);
}
return '';
}
},
methods: {
selectChange: function(value){
var self = this;
for (var i=0;i<this.list.length;i++) {
if (value == this.list[i].value) {
self.$set('txtName',this.list[i].label);
self.$set('selected',this.list[i].value);
}
}
},
changeSelectValue: function(){
var self = this;
var flag = false;
for (var i=0;i<this.list.length;i++) {
if (self.txtName == this.list[i].label) {
flag = true;
//self.$set('txtValue',this.list[i].value);
}
}
if (!flag) {
//self.$set('txtValue','');
self.$set('selected',self.txtName+"New");
}
},
getDTemplate: function(id){
var self =this;
//self.$set("changedobject.selectedHeadArray",[]);
//self.$set("changedobject.selectedArray",[]);
//self.$set('changedobject.resourceList', []);
Ajax.get('/user/getDTemplate/'+id)
.then(function (response){
var data = response.data.data;
if (data!=null && data!=undefined) {
self.$set('changedobject.resourceList', data.resourceList);
self.$set("changedobject.selectedHeadArray",data.selectedHeadArray);
self.$set("changedobject.selectedArray",data.selectedArray);
}
});
},
}
};
</script>