bfg-common 1.3.19 → 1.3.21

package/components/common/wizards/network/add/modals/SelectStandardSwitch.vue

@@ -1,125 +1,125 @@
-<template>
-  <div class="select-table-modal">
-    <atoms-modal
-      :width="props.width"
-      :height="props.height"
-      :show="props.show"
-      :title="props.title"
-      @hide="onHideModal"
-    >
-      <template #modalBody>
-        <atoms-alert
-          v-if="isShowErrorMessageAlert"
-          status="alert-danger"
-          :items="[localization.noSwitchIsSelectedSelectSwitchToContinue]"
-          @remove="onHideErrorMessageAlert"
-        />
-        <div class="table-top-margin-container">
-          <atoms-table-simple-table
-            :head-items="headItems"
-            :body-items="bodyItems"
-            editable
-            @select="onSelectRow"
-          />
-        </div>
-      </template>
-      <template #modalFooter>
-        <button class="btn btn-outline" @click="onHideModal">Cancel</button>
-        <button class="btn btn-primary" @click="onSelectSwitch">Ok</button>
-      </template>
-    </atoms-modal>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { UI_I_Localization } from '~/lib/models/interfaces'
-import {
-    UI_I_Switch,
-    UI_I_SelectedSwitch, UI_I_BodyItems,
-} from '~/components/common/wizards/network/add/lib/models/interfaces'
-import {
-  selectStandardSwitchTableHeadFunc
-} from '~/components/common/wizards/network/add/lib/config'
-
-interface I_SelectSwitchModalProps {
-  show: boolean
-  modalName: string
-  title?: string
-  width?: string
-  height?: string
-  withCollapse?: boolean
-  standardSwitchesInitial: UI_I_Switch[]
-}
-
-const props = withDefaults(defineProps<I_SelectSwitchModalProps>(), {
-  width: '576px',
-  height: '420px',
-  title: '--',
-})
-
-// UI_I_Localization
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedRowData = ref<UI_I_SelectedSwitch[]>()
-
-const standardSwitches = ref<UI_I_Switch[]>(props.standardSwitchesInitial)
-
-const headItems = selectStandardSwitchTableHeadFunc(localization.value)
-
-const bodyItems = computed<UI_I_BodyItems[][]>(() =>
-  standardSwitches.value.map((switchData: UI_I_Switch) => [
-    {
-      editable: false,
-      text: switchData.name,
-      id: switchData.id,
-    },
-  ])
-)
-
-watch(
-  () => props.standardSwitchesInitial,
-  (newStandardSwitches: UI_I_Switch[]) => {
-    standardSwitches.value = newStandardSwitches
-  },
-  { deep: true, immediate: true }
-)
-
-const isShowErrorMessageAlert = ref<boolean>(false)
-const onHideErrorMessageAlert = (): void => {
-  selectedRowData.value = []
-  isShowErrorMessageAlert.value = false
-}
-
-const onSelectRow = (index: number): void => {
-  selectedRowData.value = bodyItems.value[index]
-}
-
-const onSelectSwitch = (): void => {
-  const selectedSwitchId =
-    selectedRowData.value &&
-    selectedRowData.value[0] &&
-    selectedRowData.value[0].id
-  if (!selectedSwitchId) {
-    isShowErrorMessageAlert.value = true
-    return
-  }
-  emits('select-standard-switch', selectedSwitchId)
-  onHideErrorMessageAlert()
-  emits('hide')
-}
-
-const emits = defineEmits<{
-  (event: 'hide'): void
-  (event: 'select-standard-switch', switchId: string): void
-}>()
-const onHideModal = (): void => {
-  onHideErrorMessageAlert()
-  emits('hide')
-}
-</script>
-
-<style scoped lang="scss">
-:deep(.table-wrap) {
-  height: 100%;
-}
-</style>
+<template>
+  <div class="select-table-modal">
+    <atoms-modal
+      :width="props.width"
+      :height="props.height"
+      :show="props.show"
+      :title="props.title"
+      @hide="onHideModal"
+    >
+      <template #modalBody>
+        <atoms-alert
+          v-if="isShowErrorMessageAlert"
+          status="alert-danger"
+          :items="[localization.noSwitchIsSelectedSelectSwitchToContinue]"
+          @remove="onHideErrorMessageAlert"
+        />
+        <div class="table-top-margin-container">
+          <atoms-table-simple-table
+            :head-items="headItems"
+            :body-items="bodyItems"
+            editable
+            @select="onSelectRow"
+          />
+        </div>
+      </template>
+      <template #modalFooter>
+        <button class="btn btn-outline" @click="onHideModal">Cancel</button>
+        <button class="btn btn-primary" @click="onSelectSwitch">Ok</button>
+      </template>
+    </atoms-modal>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { UI_I_Localization } from '~/lib/models/interfaces'
+import {
+    UI_I_Switch,
+    UI_I_SelectedSwitch, UI_I_BodyItems,
+} from '~/components/common/wizards/network/add/lib/models/interfaces'
+import {
+  selectStandardSwitchTableHeadFunc
+} from '~/components/common/wizards/network/add/lib/config'
+
+interface I_SelectSwitchModalProps {
+  show: boolean
+  modalName: string
+  title?: string
+  width?: string
+  height?: string
+  withCollapse?: boolean
+  standardSwitchesInitial: UI_I_Switch[]
+}
+
+const props = withDefaults(defineProps<I_SelectSwitchModalProps>(), {
+  width: '576px',
+  height: '420px',
+  title: '--',
+})
+
+// UI_I_Localization
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const selectedRowData = ref<UI_I_SelectedSwitch[]>()
+
+const standardSwitches = ref<UI_I_Switch[]>(props.standardSwitchesInitial)
+
+const headItems = selectStandardSwitchTableHeadFunc(localization.value)
+
+const bodyItems = computed<UI_I_BodyItems[][]>(() =>
+  standardSwitches.value.map((switchData: UI_I_Switch) => [
+    {
+      editable: false,
+      text: switchData.name,
+      id: switchData.id,
+    },
+  ])
+)
+
+watch(
+  () => props.standardSwitchesInitial,
+  (newStandardSwitches: UI_I_Switch[]) => {
+    standardSwitches.value = newStandardSwitches
+  },
+  { deep: true, immediate: true }
+)
+
+const isShowErrorMessageAlert = ref<boolean>(false)
+const onHideErrorMessageAlert = (): void => {
+  selectedRowData.value = []
+  isShowErrorMessageAlert.value = false
+}
+
+const onSelectRow = (index: number): void => {
+  selectedRowData.value = bodyItems.value[index]
+}
+
+const onSelectSwitch = (): void => {
+  const selectedSwitchId =
+    selectedRowData.value &&
+    selectedRowData.value[0] &&
+    selectedRowData.value[0].id
+  if (!selectedSwitchId) {
+    isShowErrorMessageAlert.value = true
+    return
+  }
+  emits('select-standard-switch', selectedSwitchId)
+  onHideErrorMessageAlert()
+  emits('hide')
+}
+
+const emits = defineEmits<{
+  (event: 'hide'): void
+  (event: 'select-standard-switch', switchId: string): void
+}>()
+const onHideModal = (): void => {
+  onHideErrorMessageAlert()
+  emits('hide')
+}
+</script>
+
+<style scoped lang="scss">
+:deep(.table-wrap) {
+  height: 100%;
+}
+</style>

package/components/common/wizards/network/add/modals/SelectSwitch.vue

@@ -1,114 +1,114 @@
-<template>
-  <div class="select-table-modal">
-    <atoms-modal
-      :width="props.width"
-      :height="props.height"
-      :show="props.show"
-      :title="props.title"
-      @hide="onHideModal"
-    >
-      <template #modalBody>
-        <atoms-alert
-          v-if="isShowErrorMessageAlert"
-          status="alert-danger"
-          :items="[localization.noSwitchIsSelectedSelectSwitchToContinue]"
-          @remove="onHideErrorMessageAlert"
-        />
-        <div class="table-top-margin-container">
-          <atoms-table-simple-table
-            :head-items="headItems"
-            :body-items="bodyItems"
-            editable
-            @select="onSelectRow"
-          />
-        </div>
-      </template>
-      <template #modalFooter>
-        <button class="btn btn-outline" @click="onHideModal">Cancel</button>
-        <button class="btn btn-primary" @click="onSelectSwitch">Ok</button>
-      </template>
-    </atoms-modal>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { UI_I_Localization } from '~/lib/models/interfaces'
-import {
-  UI_I_Switch,
-  UI_I_SelectedSwitch,
-  UI_I_BodyItems,
-} from '~/components/common/wizards/network/add/lib/models/interfaces'
-import { selectSwitchTableHeadFunc } from '~/components/common/wizards/network/add/lib/config'
-
-interface I_SelectSwitchModalProps {
-  show: boolean
-  modalName: string
-  title?: string
-  width?: string
-  height?: string
-  withCollapse?: boolean
-  data: UI_I_Switch[]
-}
-
-const props = withDefaults(defineProps<I_SelectSwitchModalProps>(), {
-  width: '576px',
-  height: '420px',
-  title: '--',
-})
-
-// UI_I_Localization
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedRowData = ref<UI_I_SelectedSwitch[]>()
-
-const headItems = selectSwitchTableHeadFunc(localization.value)
-
-const bodyItems = computed<UI_I_BodyItems[][]>(() =>
-  props.data.map((switchData: UI_I_Switch) => [
-    {
-      editable: false,
-      text: switchData.name,
-      id: switchData.id,
-    },
-    {
-      editable: false,
-      text: '--',
-    },
-  ])
-)
-
-const isShowErrorMessageAlert = ref<boolean>(false)
-const onHideErrorMessageAlert = (): void => {
-  selectedRowData.value = []
-  isShowErrorMessageAlert.value = false
-}
-
-const onSelectRow = (index: number): void => {
-  selectedRowData.value = bodyItems.value[index]
-}
-
-const onSelectSwitch = (): void => {
-  const selectedSwitchId =
-    selectedRowData.value &&
-    selectedRowData.value[0] &&
-    selectedRowData.value[0].id
-  if (!selectedSwitchId) {
-    isShowErrorMessageAlert.value = true
-    return
-  }
-  emits('select-switch', selectedSwitchId)
-  onHideErrorMessageAlert()
-  emits('hide')
-}
-
-const emits = defineEmits<{
-  (event: 'hide'): void
-  (event: 'select-switch', switchId: string): void
-}>()
-const onHideModal = (): void => {
-  onHideErrorMessageAlert()
-  emits('hide')
-}
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+  <div class="select-table-modal">
+    <atoms-modal
+      :width="props.width"
+      :height="props.height"
+      :show="props.show"
+      :title="props.title"
+      @hide="onHideModal"
+    >
+      <template #modalBody>
+        <atoms-alert
+          v-if="isShowErrorMessageAlert"
+          status="alert-danger"
+          :items="[localization.noSwitchIsSelectedSelectSwitchToContinue]"
+          @remove="onHideErrorMessageAlert"
+        />
+        <div class="table-top-margin-container">
+          <atoms-table-simple-table
+            :head-items="headItems"
+            :body-items="bodyItems"
+            editable
+            @select="onSelectRow"
+          />
+        </div>
+      </template>
+      <template #modalFooter>
+        <button class="btn btn-outline" @click="onHideModal">Cancel</button>
+        <button class="btn btn-primary" @click="onSelectSwitch">Ok</button>
+      </template>
+    </atoms-modal>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { UI_I_Localization } from '~/lib/models/interfaces'
+import {
+  UI_I_Switch,
+  UI_I_SelectedSwitch,
+  UI_I_BodyItems,
+} from '~/components/common/wizards/network/add/lib/models/interfaces'
+import { selectSwitchTableHeadFunc } from '~/components/common/wizards/network/add/lib/config'
+
+interface I_SelectSwitchModalProps {
+  show: boolean
+  modalName: string
+  title?: string
+  width?: string
+  height?: string
+  withCollapse?: boolean
+  data: UI_I_Switch[]
+}
+
+const props = withDefaults(defineProps<I_SelectSwitchModalProps>(), {
+  width: '576px',
+  height: '420px',
+  title: '--',
+})
+
+// UI_I_Localization
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const selectedRowData = ref<UI_I_SelectedSwitch[]>()
+
+const headItems = selectSwitchTableHeadFunc(localization.value)
+
+const bodyItems = computed<UI_I_BodyItems[][]>(() =>
+  props.data.map((switchData: UI_I_Switch) => [
+    {
+      editable: false,
+      text: switchData.name,
+      id: switchData.id,
+    },
+    {
+      editable: false,
+      text: '--',
+    },
+  ])
+)
+
+const isShowErrorMessageAlert = ref<boolean>(false)
+const onHideErrorMessageAlert = (): void => {
+  selectedRowData.value = []
+  isShowErrorMessageAlert.value = false
+}
+
+const onSelectRow = (index: number): void => {
+  selectedRowData.value = bodyItems.value[index]
+}
+
+const onSelectSwitch = (): void => {
+  const selectedSwitchId =
+    selectedRowData.value &&
+    selectedRowData.value[0] &&
+    selectedRowData.value[0].id
+  if (!selectedSwitchId) {
+    isShowErrorMessageAlert.value = true
+    return
+  }
+  emits('select-switch', selectedSwitchId)
+  onHideErrorMessageAlert()
+  emits('hide')
+}
+
+const emits = defineEmits<{
+  (event: 'hide'): void
+  (event: 'select-switch', switchId: string): void
+}>()
+const onHideModal = (): void => {
+  onHideErrorMessageAlert()
+  emits('hide')
+}
+</script>
+
+<style scoped lang="scss"></style>