ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-16 22:28:13 +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

125
src/plugins/timeConductor/DatePicker.vue
View File

@ -20,41 +20,68 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
<template>
<div class="c-ctrl-wrapper c-ctrl-wrapper--menus-up c-datetime-picker__wrapper" ref="calendarHolder">
<a class="c-icon-button icon-calendar"
@click="toggle"></a>
<div class="c-menu c-menu--mobile-modal c-datetime-picker"
v-if="open">
<div class="c-datetime-picker__close-button">
<button class="c-click-icon icon-x-in-circle"
@click="toggle"></button>
</div>
<div class="c-datetime-picker__pager c-pager l-month-year-pager">
<div class="c-pager__prev c-icon-button icon-arrow-left"
@click.stop="changeMonth(-1)"></div>
<div class="c-pager__month-year">{{model.month}} {{model.year}}</div>
<div class="c-pager__next c-icon-button icon-arrow-right"
@click.stop="changeMonth(1)"></div>
</div>
<div class="c-datetime-picker__calendar c-calendar">
<ul class="c-calendar__row--header l-cal-row">
<li v-for="day in ['Su','Mo','Tu','We','Th','Fr','Sa']"
:key="day">{{day}}</li>
</ul>
<ul class="c-calendar__row--body"
v-for="(row, index) in table"
:key="index">
<li v-for="(cell, index) in row"
:key="index"
@click="select(cell)"
:class="{ 'is-in-month': isInCurrentMonth(cell), selected: isSelected(cell) }">
<div class="c-calendar__day--prime">{{cell.day}}</div>
<div class="c-calendar__day--sub">{{cell.dayOfYear}}</div>
</li>
</ul>
<div
ref="calendarHolder"
class="c-ctrl-wrapper c-ctrl-wrapper--menus-up c-datetime-picker__wrapper"
>
<a
class="c-icon-button icon-calendar"
@click="toggle"
></a>
<div
v-if="open"
class="c-menu c-menu--mobile-modal c-datetime-picker"
>
<div class="c-datetime-picker__close-button">
<button
class="c-click-icon icon-x-in-circle"
@click="toggle"
></button>
</div>
<div class="c-datetime-picker__pager c-pager l-month-year-pager">
<div
class="c-pager__prev c-icon-button icon-arrow-left"
@click.stop="changeMonth(-1)"
></div>
<div class="c-pager__month-year">
{{ model.month }} {{ model.year }}
</div>
<div
class="c-pager__next c-icon-button icon-arrow-right"
@click.stop="changeMonth(1)"
></div>
</div>
<div class="c-datetime-picker__calendar c-calendar">
<ul class="c-calendar__row--header l-cal-row">
<li
v-for="day in ['Su','Mo','Tu','We','Th','Fr','Sa']"
:key="day"
>
{{ day }}
</li>
</ul>
<ul
v-for="(row, tableIndex) in table"
:key="tableIndex"
class="c-calendar__row--body"
>
<li
v-for="(cell, rowIndex) in row"
:key="rowIndex"
:class="{ 'is-in-month': isInCurrentMonth(cell), selected: isSelected(cell) }"
@click="select(cell)"
>
<div class="c-calendar__day--prime">
{{ cell.day }}
</div>
<div class="c-calendar__day--sub">
{{ cell.dayOfYear }}
</div>
</li>
</ul>
</div>
</div>
</div>
</template>
<style lang="scss">
@ -163,10 +190,10 @@ import moment from 'moment';
import toggleMixin from '../../ui/mixins/toggle-mixin';
const TIME_NAMES = {
'hours': "Hour",
'minutes': "Minute",
'seconds': "Second"
};
'hours': "Hour",
'minutes': "Minute",
'seconds': "Second"
};
const MONTHS = moment.months();
const TIME_OPTIONS = (function makeRanges() {
let arr = [];
@ -184,8 +211,14 @@ export default {
inject: ['openmct'],
mixins: [toggleMixin],
props: {
defaultDateTime: String,
formatter: Object
defaultDateTime: {
type: String,
default: undefined
},
formatter: {
type: Object,
required: true
}
},
data: function () {
return {
@ -196,13 +229,17 @@ export default {
},
model: {
year: undefined,
month: undefined,
month: undefined
},
table: undefined,
date: undefined,
time: undefined
}
},
mounted: function () {
this.updateFromModel(this.defaultDateTime);
this.updateViewForMonth();
},
methods: {
generateTable() {
let m = moment.utc({ year: this.picker.year, month: this.picker.month }).day(0),
@ -233,9 +270,7 @@ export default {
},
updateFromModel(defaultDateTime) {
let m;
m = moment.utc(defaultDateTime);
let m = moment.utc(defaultDateTime);
this.date = {
year: m.year(),
@ -314,11 +349,7 @@ export default {
optionsFor(key) {
return TIME_OPTIONS[key];
},
},
mounted: function () {
this.updateFromModel(this.defaultDateTime);
this.updateViewForMonth();
}
}
}
</script>