ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-16 06:08:11 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Feature/eslint plugin vue (#2548)

Browse Source 
* Use eslint-plugin-vue to lint vue files
This commit is contained in:
David Tsay
2019-12-04 12:39:09 -08:00
committed by Andrew Henry
parent 14ce5e159b
commit 14a0f84c1b
99 changed files with 5818 additions and 4877 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
src/plugins/displayLayout/components/BoxView.vue
View File

@ -21,15 +21,18 @@
*****************************************************************************/
<template>
<layout-frame :item="item"
:grid-size="gridSize"
@move="(gridDelta) => $emit('move', gridDelta)"
@endMove="() => $emit('endMove')">
<div class="c-box-view"
:style="style">
</div>
</layout-frame>
</template>
<layout-frame
:item="item"
:grid-size="gridSize"
@move="(gridDelta) => $emit('move', gridDelta)"
@endMove="() => $emit('endMove')"
>
<div
class="c-box-view"
:style="style"
></div>
</layout-frame>
</template>
<style lang="scss">
@import '~styles/sass-base';
@ -44,60 +47,70 @@
}
</style>
<script>
import LayoutFrame from './LayoutFrame.vue'
<script>
import LayoutFrame from './LayoutFrame.vue'
export default {
makeDefinition() {
export default {
makeDefinition() {
return {
fill: '#717171',
stroke: 'transparent',
x: 1,
y: 1,
width: 10,
height: 5
};
},
inject: ['openmct'],
components: {
LayoutFrame
},
props: {
item: {
type: Object,
required: true
},
gridSize: {
type: Array,
required: true,
validator: (arr) => arr && arr.length === 2
&& arr.every(el => typeof el === 'number')
},
index: {
type: Number,
required: true
},
initSelect: Boolean
},
computed: {
style() {
return {
fill: '#717171',
stroke: 'transparent',
x: 1,
y: 1,
width: 10,
height: 5
backgroundColor: this.item.fill,
border: '1px solid ' + this.item.stroke
};
},
inject: ['openmct'],
components: {
LayoutFrame
},
props: {
item: Object,
gridSize: Array,
index: Number,
initSelect: Boolean
},
computed: {
style() {
return {
backgroundColor: this.item.fill,
border: '1px solid ' + this.item.stroke
};
}
},
watch: {
index(newIndex) {
if (!this.context) {
return;
}
},
watch: {
index(newIndex) {
if (!this.context) {
return;
}
this.context.index = newIndex;
}
},
mounted() {
this.context = {
layoutItem: this.item,
index: this.index
};
this.removeSelectable = this.openmct.selection.selectable(
this.$el, this.context, this.initSelect);
},
destroyed() {
if (this.removeSelectable) {
this.removeSelectable();
}
this.context.index = newIndex;
}
},
mounted() {
this.context = {
layoutItem: this.item,
index: this.index
};
this.removeSelectable = this.openmct.selection.selectable(
this.$el, this.context, this.initSelect);
},
destroyed() {
if (this.removeSelectable) {
this.removeSelectable();
}
}
</script>
}
</script>