Fix remaining vue-compat warnings (#6966)

* PascalCase files * emit warnings * minor updates * merge conflict resolve pt 1 * part 2 * update to eventbus * eventbus spelling * fix: import * fix: eventBus injection * fix: import * fix(test): provide eventBus in overlay plot tests * refactor: EventBus as composable * chore: lint:fix * chore: require vue event hyphenation * fix: revert event renames * refactor: use PascalCase name * fix: ensure `$attrs` are properly bound * fix: emit `click` event from SearchComponent * chore: remove rules already included in `vue/vue3-recommended` ruleset * fix: remove `Vue` import * chore: remove unused files * fix: fix lint scripts and make them cross-platform * refactor: rename `DataImagery.vue` -> `ImageryInspectorView.vue` * refactor: rename `NumericData.vue` -> `NumericDataInspectorView.vue` * refactor: rename components * refactor: rename `GeneralIndicators.vue` -> `StatusIndicators.vue` * refactor: rename components --------- Co-authored-by: Jesse Mazzella <jesse.d.mazzella@nasa.gov>
2025-06-18 23:28:14 +00:00 · 2023-10-10 16:29:01 -04:00
parent 6b32c63039
commit 97b2ebc0bb
187 changed files with 731 additions and 533 deletions
--- a/src/plugins/timeConductor/ConductorAxis.vue
+++ b/src/plugins/timeConductor/ConductorAxis.vue
@ -55,6 +55,7 @@ export default {
      required: true
    }
  },
+  emits: ['pan-axis', 'end-pan', 'zoom-axis', 'end-zoom'],
  data() {
    return {
      inPanMode: false,
@ -206,11 +207,11 @@ export default {
    },
    pan() {
      const panBounds = this.getPanBounds();
-      this.$emit('panAxis', panBounds);
+      this.$emit('pan-axis', panBounds);
    },
    endPan() {
      const panBounds = this.isChangingViewBounds() ? this.getPanBounds() : undefined;
-      this.$emit('endPan', panBounds);
+      this.$emit('end-pan', panBounds);
      this.inPanMode = false;
    },
    getPanBounds() {
@ -232,7 +233,7 @@ export default {
        left: `${this.dragStartX - this.left}px`
      };

-      this.$emit('zoomAxis', {
+      this.$emit('zoom-axis', {
        start: x,
        end: x
      });
@ -245,7 +246,7 @@ export default {
        width: `${zoomRange.end - zoomRange.start}px`
      };

-      this.$emit('zoomAxis', {
+      this.$emit('zoom-axis', {
        start: this.scaleToBounds(zoomRange.start),
        end: this.scaleToBounds(zoomRange.end)
      });
@ -261,7 +262,7 @@ export default {
      }

      this.zoomStyle = {};
-      this.$emit('endZoom', zoomBounds);
+      this.$emit('end-zoom', zoomBounds);
    },
    getZoomRange() {
      const leftBound = this.left;
--- a/src/plugins/timeConductor/ConductorClock.vue
+++ b/src/plugins/timeConductor/ConductorClock.vue
@ -58,6 +58,7 @@ export default {
      }
    }
  },
+  emits: ['clock-updated'],
  data() {
    const activeClock = this.getActiveClock();

@ -109,7 +110,7 @@ export default {
      const offsets = this.openmct.time.getClockOffsets() ?? configuration.clockOffsets;
      option.offsets = offsets;

-      this.$emit('clockUpdated', option);
+      this.$emit('clock-updated', option);
    },
    getMatchingConfig(options) {
      const matchers = {
--- a/src/plugins/timeConductor/ConductorComponent.vue
+++ b/src/plugins/timeConductor/ConductorComponent.vue
@ -44,10 +44,10 @@
      :view-bounds="viewBounds"
      :is-fixed="isFixed"
      :alt-pressed="altPressed"
-      @endPan="endPan"
-      @endZoom="endZoom"
-      @panAxis="pan"
-      @zoomAxis="zoom"
+      @end-pan="endPan"
+      @end-zoom="endZoom"
+      @pan-axis="pan"
+      @zoom-axis="zoom"
    />
    <div
      role="button"
@ -62,11 +62,11 @@
      :position-x="positionX"
      :position-y="positionY"
      :is-fixed="isFixed"
-      @popupLoaded="initializePopup"
-      @modeUpdated="saveMode"
-      @clockUpdated="saveClock"
-      @fixedBoundsUpdated="saveFixedBounds"
-      @clockOffsetsUpdated="saveClockOffsets"
+      @popup-loaded="initializePopup"
+      @mode-updated="saveMode"
+      @clock-updated="saveClock"
+      @fixed-bounds-updated="saveFixedBounds"
+      @clock-offsets-updated="saveClockOffsets"
      @dismiss="clearPopup"
    />
  </div>
--- a/src/plugins/timeConductor/ConductorInputsFixed.vue
+++ b/src/plugins/timeConductor/ConductorInputsFixed.vue
@ -84,6 +84,7 @@ export default {
      }
    }
  },
+  emits: ['bounds-updated', 'dismiss-inputs-fixed'],
  data() {
    const timeSystem = this.openmct.time.getTimeSystem();
    const timeFormatter = this.getFormatter(timeSystem.timeFormat);
@ -166,13 +167,13 @@ export default {
      }).formatter;
    },
    setBoundsFromView(bounds) {
-      this.$emit('boundsUpdated', {
+      this.$emit('bounds-updated', {
        start: bounds.start,
        end: bounds.end
      });
    },
    dismiss() {
-      this.$emit('dismissInputsFixed');
+      this.$emit('dismiss-inputs-fixed');
    }
  }
 };
--- a/src/plugins/timeConductor/ConductorInputsRealtime.vue
+++ b/src/plugins/timeConductor/ConductorInputsRealtime.vue
@ -93,6 +93,7 @@ export default {
      }
    }
  },
+  emits: ['offsets-updated', 'dismiss-inputs-realtime'],
  data() {
    const timeSystem = this.openmct.time.getTimeSystem();
    const durationFormatter = this.getFormatter(
@ -240,13 +241,13 @@ export default {
      let startOffset = 0 - this.durationFormatter.parse(this.offsets.start);
      let endOffset = this.durationFormatter.parse(this.offsets.end);

-      this.$emit('offsetsUpdated', {
+      this.$emit('offsets-updated', {
        start: startOffset,
        end: endOffset
      });
    },
    dismiss() {
-      this.$emit('dismissInputsRealtime');
+      this.$emit('dismiss-inputs-realtime');
    },
    copy(object) {
      return JSON.parse(JSON.stringify(object));
--- a/src/plugins/timeConductor/ConductorMode.vue
+++ b/src/plugins/timeConductor/ConductorMode.vue
@ -64,6 +64,7 @@ export default {
      }
    }
  },
+  emits: ['mode-updated'],
  data() {
    const mode = this.openmct.time.getMode();

@ -101,7 +102,7 @@ export default {
    setMode(mode) {
      this.setViewFromMode(mode);

-      this.$emit('modeUpdated', mode);
+      this.$emit('mode-updated', mode);
    }
  }
 };
--- a/src/plugins/timeConductor/ConductorPopUp.vue
+++ b/src/plugins/timeConductor/ConductorPopUp.vue
@ -6,14 +6,14 @@
        class="c-conductor__mode-select"
        title="Sets the Time Conductor's mode."
        :mode="timeOptionMode"
-        @independentModeUpdated="saveIndependentMode"
+        @independent-mode-updated="saveIndependentMode"
      />
      <ConductorMode
        v-else
        class="c-conductor__mode-select"
        title="Sets the Time Conductor's mode."
        :button-css-class="'c-icon-button'"
-        @modeUpdated="saveMode"
+        @mode-updated="saveMode"
      />
      <IndependentClock
        v-if="isIndependent"
@ -21,14 +21,14 @@
        title="Sets the Time Conductor's clock."
        :clock="timeOptionClock"
        :button-css-class="'c-icon-button'"
-        @independentClockUpdated="saveIndependentClock"
+        @independent-clock-updated="saveIndependentClock"
      />
      <ConductorClock
        v-else
        class="c-conductor__mode-select"
        title="Sets the Time Conductor's clock."
        :button-css-class="'c-icon-button'"
-        @clockUpdated="saveClock"
+        @clock-updated="saveClock"
      />
      <!-- TODO: Time system and history must work even with ITC later -->
      <ConductorTimeSystem
@ -48,15 +48,15 @@
      v-if="isFixed"
      :input-bounds="bounds"
      :object-path="objectPath"
-      @boundsUpdated="saveFixedBounds"
-      @dismissInputsFixed="dismiss"
+      @bounds-updated="saveFixedBounds"
+      @dismiss-inputs-fixed="dismiss"
    />
    <conductor-inputs-realtime
      v-else
      :input-bounds="bounds"
      :object-path="objectPath"
-      @offsetsUpdated="saveClockOffsets"
-      @dismissInputsRealtime="dismiss"
+      @offsets-updated="saveClockOffsets"
+      @dismiss-inputs-realtime="dismiss"
    />
  </div>
 </template>
@ -128,6 +128,16 @@ export default {
      }
    }
  },
+  emits: [
+    'popup-loaded',
+    'dismiss',
+    'independent-clock-updated',
+    'fixed-bounds-updated',
+    'clock-offsets-updated',
+    'clock-updated',
+    'mode-updated',
+    'independent-mode-updated'
+  ],
  data() {
    const bounds = this.openmct.time.getBounds();
    const timeSystem = this.openmct.time.getTimeSystem();
@ -181,7 +191,7 @@ export default {
    }
  },
  mounted() {
-    this.$emit('popupLoaded');
+    this.$emit('popup-loaded');
    this.setTimeContext();
  },
  beforeUnmount() {
@ -216,22 +226,22 @@ export default {
      }
    },
    saveFixedBounds(bounds) {
-      this.$emit('fixedBoundsUpdated', bounds);
+      this.$emit('fixed-bounds-updated', bounds);
    },
    saveClockOffsets(offsets) {
-      this.$emit('clockOffsetsUpdated', offsets);
+      this.$emit('clock-offsets-updated', offsets);
    },
    saveClock(clockOptions) {
-      this.$emit('clockUpdated', clockOptions);
+      this.$emit('clock-updated', clockOptions);
    },
    saveMode(mode) {
-      this.$emit('modeUpdated', mode);
+      this.$emit('mode-updated', mode);
    },
    saveIndependentMode(mode) {
-      this.$emit('independentModeUpdated', mode);
+      this.$emit('independent-mode-updated', mode);
    },
    saveIndependentClock(clockKey) {
-      this.$emit('independentClockUpdated', clockKey);
+      this.$emit('independent-clock-updated', clockKey);
    },
    dismiss() {
      this.$emit('dismiss');
--- a/src/plugins/timeConductor/DatePicker.vue
+++ b/src/plugins/timeConductor/DatePicker.vue
@ -118,6 +118,7 @@ export default {
      }
    }
  },
+  emits: ['date-selected'],
  data: function () {
    return {
      picker: {
--- a/src/plugins/timeConductor/TimePopupFixed.vue
+++ b/src/plugins/timeConductor/TimePopupFixed.vue
@ -115,6 +115,7 @@ export default {
      required: true
    }
  },
+  emits: ['update', 'dismiss'],
  data() {
    let timeSystem = this.openmct.time.getTimeSystem();
    let durationFormatter = this.getFormatter(
--- a/src/plugins/timeConductor/TimePopupRealtime.vue
+++ b/src/plugins/timeConductor/TimePopupRealtime.vue
@ -150,6 +150,7 @@ export default {
      required: true
    }
  },
+  emits: ['update', 'dismiss'],
  data() {
    return {
      startInputHrs: '00',
--- a/src/plugins/timeConductor/independent/IndependentClock.vue
+++ b/src/plugins/timeConductor/independent/IndependentClock.vue
@ -57,6 +57,7 @@ export default {
      }
    }
  },
+  emits: ['independent-clock-updated'],
  data() {
    const activeClock = this.getActiveClock();

@ -114,7 +115,7 @@ export default {
    setClock(clockKey) {
      this.setViewFromClock(clockKey);

-      this.$emit('independentClockUpdated', clockKey);
+      this.$emit('independent-clock-updated', clockKey);
    },
    setViewFromClock(clockOrKey) {
      let clock = clockOrKey;
--- a/src/plugins/timeConductor/independent/IndependentMode.vue
+++ b/src/plugins/timeConductor/independent/IndependentMode.vue
@ -55,6 +55,7 @@ export default {
      }
    }
  },
+  emits: ['independent-mode-updated'],
  data: function () {
    return {
      selectedMode: this.getModeMetadata(this.mode),
@ -94,7 +95,7 @@ export default {
    setMode(mode) {
      this.setViewFromMode(mode);

-      this.$emit('independentModeUpdated', mode);
+      this.$emit('independent-mode-updated', mode);
    }
  }
 };
--- a/src/plugins/timeConductor/independent/IndependentTimeConductor.vue
+++ b/src/plugins/timeConductor/independent/IndependentTimeConductor.vue
@ -70,11 +70,11 @@
      :bottom="true"
      :position-x="positionX"
      :position-y="positionY"
-      @popupLoaded="initializePopup"
-      @independentModeUpdated="saveMode"
-      @independentClockUpdated="saveClock"
-      @fixedBoundsUpdated="saveFixedBounds"
-      @clockOffsetsUpdated="saveClockOffsets"
+      @popup-loaded="initializePopup"
+      @independent-mode-updated="saveMode"
+      @independent-clock-updated="saveClock"
+      @fixed-bounds-updated="saveFixedBounds"
+      @clock-offsets-updated="saveClockOffsets"
      @dismiss="clearPopup"
    />
  </div>
@ -116,6 +116,7 @@ export default {
      required: true
    }
  },
+  emits: ['updated'],
  data() {
    const fixedOffsets = this.openmct.time.getBounds();
    const clockOffsets = this.openmct.time.getClockOffsets();
--- a/src/plugins/timeConductor/plugin.js
+++ b/src/plugins/timeConductor/plugin.js
@ -23,7 +23,7 @@
 import { markRaw } from 'vue';

 import { FIXED_MODE_KEY, REALTIME_MODE_KEY } from '../../api/time/constants';
-import Conductor from './Conductor.vue';
+import Conductor from './ConductorComponent.vue';

 function isTruthy(a) {
  return Boolean(a);