From 1b8d6d756c9dff14d3dd8298ecae7d6fe73192e5 Mon Sep 17 00:00:00 2001
From: Maksim Zakharov <m.zakharov@IBS.RU>
Date: Mon, 6 Jun 2022 18:39:19 +0300
Subject: Delete main-container, add global scroll to pages, add global style
 for logs.

---
 .../PowerSupplies/DynamicInfo/PowerDynamicPage.vue | 777 ++++++++++-----------
 .../Specification/PowerStaticPage.vue              |  78 +--
 2 files changed, 410 insertions(+), 445 deletions(-)

(limited to 'src/views/PowerSupplies')

diff --git a/src/views/PowerSupplies/DynamicInfo/PowerDynamicPage.vue b/src/views/PowerSupplies/DynamicInfo/PowerDynamicPage.vue
index 3039bebb..02a209d5 100644
--- a/src/views/PowerSupplies/DynamicInfo/PowerDynamicPage.vue
+++ b/src/views/PowerSupplies/DynamicInfo/PowerDynamicPage.vue
@@ -23,425 +23,392 @@
         </button>
       </div>
     </div>
-    <div class="main-container">
-      <date-switch
-        :switch-time-scale="switchTimeScale"
-        :time-scale="timeScale"
-      />
-      <!-- Temperature Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_1
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/temperature-icon.svg" />
-          <span class="bold-16px">{{ $t('subHeader.temperature') }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_1" class="nav-item__nav">
-          <!-- Temperature Limit Inputs -->
-          <div class="limit-container">
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/non-normal.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.nonNormalMode')
-              }}</span>
-              <b-form-input
-                v-model="temperatureNonNormalInput"
-                type="number"
-                :min="0"
-                :max="temperatureCritical"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/critical.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.criticalMode')
-              }}</span>
-              <b-form-input
-                v-model="temperatureCritical"
-                type="number"
-                :min="temperatureNonNormalInput"
-                :max="temperatureWarningInput"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.temperatureWarning')
-              }}</span>
-              <b-form-input
-                v-model="temperatureWarningInput"
-                type="number"
-                :min="temperatureCritical"
-                :max="100"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updateTemperature"
+    <date-switch :switch-time-scale="switchTimeScale" :time-scale="timeScale" />
+    <!-- Temperature Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_1
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/temperature-icon.svg" />
+        <span class="bold-16px">{{ $t('subHeader.temperature') }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_1" class="nav-item__nav">
+        <!-- Temperature Limit Inputs -->
+        <div class="limit-container">
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/non-normal.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.nonNormalMode')
+            }}</span>
+            <b-form-input
+              v-model="temperatureNonNormalInput"
+              type="number"
+              :min="0"
+              :max="temperatureCritical"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Temperature Tables -->
-          <temperature-table
-            :time-scale="timeScale"
-            :warning="temperatureWarning"
-            :non-normal="temperatureNonNormal"
-            :critical="temperatureCritical"
-          />
-          <accessory-table :records="accessoryData.temperatureTable" />
-        </b-collapse>
-      </div>
-      <!-- using Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_2
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/usage-icon.svg" />
-          <span class="bold-16px">{{ $t('pagePower.usingPercent') }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_2" class="nav-item__nav">
-          <!-- using Limit Inputs -->
-          <div class="limit-container">
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.warningPercent')
-              }}</span>
-              <b-form-input
-                v-model="usingNonNormalInput"
-                type="number"
-                :min="0"
-                :max="usingCritical"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/non-normal.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.nonNormalModePercent')
-              }}</span>
-              <b-form-input
-                v-model="usingCritical"
-                type="number"
-                :min="usingNonNormalInput"
-                :max="usingWarningInput"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="trmperature-limt">
-              <img src="@/assets/images/labels/critical.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.criticalModePercent')
-              }}</span>
-              <b-form-input
-                v-model="usingWarningInput"
-                type="number"
-                :min="usingCritical"
-                :max="100"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updateUsage"
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/critical.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.criticalMode')
+            }}</span>
+            <b-form-input
+              v-model="temperatureCritical"
+              type="number"
+              :min="temperatureNonNormalInput"
+              :max="temperatureWarningInput"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- using Tables -->
-          <using-table
-            :time-scale="timeScale"
-            :warning="usingWarning"
-            :non-normal="usingNonNormal"
-            :critical-start="usingCritical"
-          />
-          <accessory-table :records="accessoryData.usingTable" />
-        </b-collapse>
-      </div>
-      <!-- Input Voltage Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_3
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/voltage-icon.svg" />
-          <span class="bold-16px">{{
-            $t('tablesDescription.inputVoltage')
-          }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_3" class="nav-item__nav">
-          <div class="limit-container">
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageWarning')
-              }}</span>
-              <b-form-input
-                v-model="powerWarningInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/shutdown.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageShutdown')
-              }}</span>
-              <b-form-input
-                v-model="powerShutdownInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updatePower"
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.temperatureWarning')
+            }}</span>
+            <b-form-input
+              v-model="temperatureWarningInput"
+              type="number"
+              :min="temperatureCritical"
+              :max="100"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Input Voltage Tables -->
-          <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
-          <accessory-table :records="accessoryData.voltageTable" />
-        </b-collapse>
-      </div>
-      <!-- Input Power Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_4
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/power-icon.svg" />
-          <span class="bold-16px">{{
-            $t('tablesDescription.inputPower')
-          }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_4" class="nav-item__nav">
-          <div class="limit-container">
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.powerWarning')
-              }}</span>
-              <b-form-input
-                v-model="powerWarningInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/shutdown.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.powerShutdown')
-              }}</span>
-              <b-form-input
-                v-model="powerShutdownInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updatePower"
+          <b-button
+            class="save-button"
+            variant="primary"
+            @click="updateTemperature"
+          >
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Temperature Tables -->
+        <temperature-table
+          :time-scale="timeScale"
+          :warning="temperatureWarning"
+          :non-normal="temperatureNonNormal"
+          :critical="temperatureCritical"
+        />
+        <accessory-table :records="accessoryData.temperatureTable" />
+      </b-collapse>
+    </div>
+    <!-- using Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_2
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/usage-icon.svg" />
+        <span class="bold-16px">{{ $t('pagePower.usingPercent') }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_2" class="nav-item__nav">
+        <!-- using Limit Inputs -->
+        <div class="limit-container">
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.warningPercent')
+            }}</span>
+            <b-form-input
+              v-model="usingNonNormalInput"
+              type="number"
+              :min="0"
+              :max="usingCritical"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Input Power Table -->
-          <power-table
-            :time-scale="timeScale"
-            :warning="powerWarning"
-            :shutdown="powerShutdown"
-          />
-          <accessory-table :records="accessoryData.powerTable" />
-        </b-collapse>
-      </div>
-      <!-- Output Voltage Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_5
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/voltage-icon.svg" />
-          <span class="bold-16px">{{
-            $t('tablesDescription.outputVoltage')
-          }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_5" class="nav-item__nav">
-          <div class="limit-container">
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageWarning')
-              }}</span>
-              <b-form-input
-                v-model="powerWarningInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/shutdown.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageShutdown')
-              }}</span>
-              <b-form-input
-                v-model="powerShutdownInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updatePower"
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/non-normal.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.nonNormalModePercent')
+            }}</span>
+            <b-form-input
+              v-model="usingCritical"
+              type="number"
+              :min="usingNonNormalInput"
+              :max="usingWarningInput"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Output Voltage Tables -->
-          <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
-          <accessory-table :records="accessoryData.voltageTable" />
-        </b-collapse>
-      </div>
-      <!-- Output Power Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_6
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/power-icon.svg" />
-          <span class="bold-16px">{{
-            $t('tablesDescription.outputPower')
-          }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_6" class="nav-item__nav">
-          <div class="limit-container">
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.powerWarning')
-              }}</span>
-              <b-form-input
-                v-model="powerWarningInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/shutdown.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.powerShutdown')
-              }}</span>
-              <b-form-input
-                v-model="powerShutdownInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updatePower"
+          <div class="trmperature-limt">
+            <img src="@/assets/images/labels/critical.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.criticalModePercent')
+            }}</span>
+            <b-form-input
+              v-model="usingWarningInput"
+              type="number"
+              :min="usingCritical"
+              :max="100"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Output Power Table -->
-          <power-table
-            :time-scale="timeScale"
-            :warning="powerWarning"
-            :shutdown="powerShutdown"
-          />
-          <accessory-table :records="accessoryData.powerTable" />
-        </b-collapse>
-      </div>
-      <!-- Amperage Section -->
-      <div class="page-collapse-decorator">
-        <b-button
-          v-b-toggle.toggle-collapse_7
-          variant="link"
-          class="collapse-button semi-bold-16px"
-        >
-          <img src="@/assets/images/amperage-icon.svg" />
-          <span class="bold-16px">{{ $t('tablesDescription.amperage') }}</span>
-          <component :is="iconChevronUp" class="icon-expand" />
-        </b-button>
-        <b-collapse id="toggle-collapse_7" class="nav-item__nav">
-          <div class="limit-container">
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/warning.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageWarning')
-              }}</span>
-              <b-form-input
-                v-model="powerWarningInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <div class="frequency-limt">
-              <img src="@/assets/images/labels/shutdown.svg" />
-              <span class="semi-bold-12px">{{
-                $t('tablesDescription.voltageShutdown')
-              }}</span>
-              <b-form-input
-                v-model="powerShutdownInput"
-                type="number"
-                class="form-control medium-12px"
-              >
-              </b-form-input>
-            </div>
-            <b-button
-              class="save-button"
-              variant="primary"
-              @click="updatePower"
+          <b-button class="save-button" variant="primary" @click="updateUsage">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- using Tables -->
+        <using-table
+          :time-scale="timeScale"
+          :warning="usingWarning"
+          :non-normal="usingNonNormal"
+          :critical-start="usingCritical"
+        />
+        <accessory-table :records="accessoryData.usingTable" />
+      </b-collapse>
+    </div>
+    <!-- Input Voltage Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_3
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/voltage-icon.svg" />
+        <span class="bold-16px">{{
+          $t('tablesDescription.inputVoltage')
+        }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_3" class="nav-item__nav">
+        <div class="limit-container">
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageWarning')
+            }}</span>
+            <b-form-input
+              v-model="powerWarningInput"
+              type="number"
+              class="form-control medium-12px"
             >
-              {{ $t('global.action.save') }}
-            </b-button>
+            </b-form-input>
           </div>
-          <!-- Amperage Table -->
-          <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
-          <accessory-table :records="accessoryData.voltageTable" />
-        </b-collapse>
-      </div>
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/shutdown.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageShutdown')
+            }}</span>
+            <b-form-input
+              v-model="powerShutdownInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <b-button class="save-button" variant="primary" @click="updatePower">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Input Voltage Tables -->
+        <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
+        <accessory-table :records="accessoryData.voltageTable" />
+      </b-collapse>
+    </div>
+    <!-- Input Power Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_4
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/power-icon.svg" />
+        <span class="bold-16px">{{ $t('tablesDescription.inputPower') }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_4" class="nav-item__nav">
+        <div class="limit-container">
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.powerWarning')
+            }}</span>
+            <b-form-input
+              v-model="powerWarningInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/shutdown.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.powerShutdown')
+            }}</span>
+            <b-form-input
+              v-model="powerShutdownInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <b-button class="save-button" variant="primary" @click="updatePower">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Input Power Table -->
+        <power-table
+          :time-scale="timeScale"
+          :warning="powerWarning"
+          :shutdown="powerShutdown"
+        />
+        <accessory-table :records="accessoryData.powerTable" />
+      </b-collapse>
+    </div>
+    <!-- Output Voltage Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_5
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/voltage-icon.svg" />
+        <span class="bold-16px">{{
+          $t('tablesDescription.outputVoltage')
+        }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_5" class="nav-item__nav">
+        <div class="limit-container">
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageWarning')
+            }}</span>
+            <b-form-input
+              v-model="powerWarningInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/shutdown.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageShutdown')
+            }}</span>
+            <b-form-input
+              v-model="powerShutdownInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <b-button class="save-button" variant="primary" @click="updatePower">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Output Voltage Tables -->
+        <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
+        <accessory-table :records="accessoryData.voltageTable" />
+      </b-collapse>
+    </div>
+    <!-- Output Power Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_6
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/power-icon.svg" />
+        <span class="bold-16px">{{ $t('tablesDescription.outputPower') }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_6" class="nav-item__nav">
+        <div class="limit-container">
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.powerWarning')
+            }}</span>
+            <b-form-input
+              v-model="powerWarningInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/shutdown.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.powerShutdown')
+            }}</span>
+            <b-form-input
+              v-model="powerShutdownInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <b-button class="save-button" variant="primary" @click="updatePower">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Output Power Table -->
+        <power-table
+          :time-scale="timeScale"
+          :warning="powerWarning"
+          :shutdown="powerShutdown"
+        />
+        <accessory-table :records="accessoryData.powerTable" />
+      </b-collapse>
+    </div>
+    <!-- Amperage Section -->
+    <div class="page-collapse-decorator">
+      <b-button
+        v-b-toggle.toggle-collapse_7
+        variant="link"
+        class="collapse-button semi-bold-16px"
+      >
+        <img src="@/assets/images/amperage-icon.svg" />
+        <span class="bold-16px">{{ $t('tablesDescription.amperage') }}</span>
+        <component :is="iconChevronUp" class="icon-expand" />
+      </b-button>
+      <b-collapse id="toggle-collapse_7" class="nav-item__nav">
+        <div class="limit-container">
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/warning.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageWarning')
+            }}</span>
+            <b-form-input
+              v-model="powerWarningInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <div class="frequency-limt">
+            <img src="@/assets/images/labels/shutdown.svg" />
+            <span class="semi-bold-12px">{{
+              $t('tablesDescription.voltageShutdown')
+            }}</span>
+            <b-form-input
+              v-model="powerShutdownInput"
+              type="number"
+              class="form-control medium-12px"
+            >
+            </b-form-input>
+          </div>
+          <b-button class="save-button" variant="primary" @click="updatePower">
+            {{ $t('global.action.save') }}
+          </b-button>
+        </div>
+        <!-- Amperage Table -->
+        <voltage-table :time-scale="timeScale" :warning="frequencyWarning" />
+        <accessory-table :records="accessoryData.voltageTable" />
+      </b-collapse>
     </div>
   </b-container>
 </template>
diff --git a/src/views/PowerSupplies/Specification/PowerStaticPage.vue b/src/views/PowerSupplies/Specification/PowerStaticPage.vue
index 3511b1f7..844dc693 100644
--- a/src/views/PowerSupplies/Specification/PowerStaticPage.vue
+++ b/src/views/PowerSupplies/Specification/PowerStaticPage.vue
@@ -4,46 +4,44 @@
     fluid="xxl pt-0 m-0"
   >
     <page-title />
-    <div class="main-container">
-      <page-section class="bootstrap-table__section info_section">
-        <span class="bold-16px">{{ $t('pageInventory.powerSources') }}</span>
-      </page-section>
-      <data-tabs
-        :slots="sourceSlots"
-        :switch-tab="switchSourceSlot"
-        :current-tab="currentSourceSlot"
-        :slot-width="100"
-        :slider-width="68"
-      />
-      <page-section class="bootstrap-table__section">
-        <b-table
-          responsive="md"
-          show-empty
-          class="bootstrap-rounded-table"
-          :items="items_slots"
-          :fields="fields"
-          :empty-text="$t('global.table.emptyMessage')"
-        >
-          <template #cell(value)="{ index, value }">
-            <b-row v-if="index === 0">
-              <b-col cols="11">
-                <span>
-                  {{ 'Работоспособность' }}
-                </span>
-              </b-col>
-              <b-col cols="1">
-                <img src="@/assets/images/status/on.svg" class="icon-chevron" />
-              </b-col>
-            </b-row>
-            <b-row v-else>
-              <b-col>
-                <span>{{ value }}</span>
-              </b-col>
-            </b-row>
-          </template>
-        </b-table>
-      </page-section>
-    </div>
+    <page-section class="bootstrap-table__section info_section">
+      <span class="bold-16px">{{ $t('pageInventory.powerSources') }}</span>
+    </page-section>
+    <data-tabs
+      :slots="sourceSlots"
+      :switch-tab="switchSourceSlot"
+      :current-tab="currentSourceSlot"
+      :slot-width="100"
+      :slider-width="68"
+    />
+    <page-section class="bootstrap-table__section">
+      <b-table
+        responsive="md"
+        show-empty
+        class="bootstrap-rounded-table"
+        :items="items_slots"
+        :fields="fields"
+        :empty-text="$t('global.table.emptyMessage')"
+      >
+        <template #cell(value)="{ index, value }">
+          <b-row v-if="index === 0">
+            <b-col cols="11">
+              <span>
+                {{ 'Работоспособность' }}
+              </span>
+            </b-col>
+            <b-col cols="1">
+              <img src="@/assets/images/status/on.svg" class="icon-chevron" />
+            </b-col>
+          </b-row>
+          <b-row v-else>
+            <b-col>
+              <span>{{ value }}</span>
+            </b-col>
+          </b-row>
+        </template>
+      </b-table>
+    </page-section>
   </b-container>
 </template>
 
-- 
cgit v1.2.3