Переход на quasar

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -47,6 +47,10 @@
                 <div v-if="selectedTab == 'buttons'" class="fit tab-panel">
                     @@include('./include/ButtonsTab.inc');
                 </div>
+                <!-- Управление ------------------------------------------------------------------>
+                <div v-if="selectedTab == 'keys'" class="fit tab-panel">
+                    @@include('./include/KeysTab.inc');
+                </div>
 
             </div>
 
@@ -548,7 +552,11 @@ class SettingsPage extends Vue {
     width: 110px;
 }
 
-.label-1, .label-2, .label-3 {
+.label-4 {
+    width: 110px;
+}
+
+.label-1, .label-2, .label-3, .label-4 {
     display: flex;
     flex-direction: column;
     justify-content: center;

client/components/Reader/SettingsPage/include/KeysTab.inc

@@ -1,3 +1,13 @@
+<div class="part-header">Управление</div>
+
+<div class="item row">
+    <div class="label-4"></div>
+    <div class="col row">
+        <q-checkbox size="xs" v-model="clickControl" label="Включить управление кликом" />
+    </div>
+</div>
+
+<!--            
             <el-tab-pane label="Управление">
                 <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
                     <div class="partHeader">Управление</div>
@@ -7,3 +17,4 @@
                     </el-form-item>
                 </el-form>
             </el-tab-pane>
+-->