ln.ethercat/ln.ethercat.service/www/static/js/sdoselect.js

61 lines
2.1 KiB
JavaScript

(function(){
Vue.component('sdo-select',{
props: {
descriptors: {
type: Array,
required: true,
},
},
data: function(){
return {
filters: {
slave: null,
name: "",
index: null,
datatype: null,
},
selectedIndex: null,
manualIndex: "",
};
},
methods: {
getFilteredDescriptors: function(){
if (this.filters.name)
return this.descriptors.filter((sdo)=>(sdo.name.toLowerCase().includes(this.filters.name.toLowerCase())) );
else
return this.descriptors;
// &&
// (!this.filters.index || sdo.index.toString(16).toLowerCase().includes(this.filters.index.toLowerCase())) &&
// (!this.filters.datatype || sdo.datatype.toLowerCase().includes(this.filters.datatype.toLowerCase())) &&
// (!this.filters.slave || sdo.address.slave.toLowerCase().includes(this.filters.slave.toLowerCase()))
// );
},
addManualIndex: function(){
if (this.manualIndex)
{
this.$emit("selected", parseInt(this.manualIndex, 16));
}
}
},
template: `
<sdoselect class="flex" style="flex-direction: column;">
<fieldset>
<input type="text" pattern="[a-fA-F0-9]{4}" v-model="manualIndex">
<button @click="addManualIndex();">+</button>
</fieldset>
<input type="text" v-model="filters.name">
<select size="15" v-model="selectedIndex" @dblclick="if (selectedIndex>=0) $emit('selected', selectedIndex);">
<option
v-for="descriptor,key in this.getFilteredDescriptors()"
:value="descriptor.index"
>{{ descriptor.index.toString(16) }} : {{ descriptor.name }}
</option>
</select>
</sdoselect>
`,
});
})();