From 567d0bc28e8bda9e749359446860ca9bcec0ac7b Mon Sep 17 00:00:00 2001
From: Book Pauk <bookpauk@gmail.com>
Date: Thu, 22 Sep 2022 16:10:20 +0700
Subject: [PATCH] =?UTF-8?q?=D0=92=20PageScroller=20=D0=B4=D0=BE=D0=B1?=
 =?UTF-8?q?=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D1=8B=20=D0=BA=D0=BD=D0=BE=D0=BF?=
 =?UTF-8?q?=D0=BA=D0=B8=20"=D0=B2=20=D0=BD=D0=B0=D1=87=D0=B0=D0=BB=D0=BE",?=
 =?UTF-8?q?=20"=D0=B2=20=D0=BA=D0=BE=D0=BD=D0=B5=D1=86"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Search/PageScroller/PageScroller.vue      |  2 +-
 client/components/Search/Search.vue           |  4 ---
 client/components/share/NumInput.vue          | 34 ++++++++++++++++++-
 3 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/client/components/Search/PageScroller/PageScroller.vue b/client/components/Search/PageScroller/PageScroller.vue
index 4c6e56f..9b82ff4 100644
--- a/client/components/Search/PageScroller/PageScroller.vue
+++ b/client/components/Search/PageScroller/PageScroller.vue
@@ -6,7 +6,7 @@
         <div class="bg-white">
             <NumInput 
                 v-model="page" :min="1" :max="pageCount"
-                style="width: 140px" minus-icon="la la-chevron-circle-left" plus-icon="la la-chevron-circle-right" :disable="disable"
+                style="width: 200px" minus-icon="la la-chevron-circle-left" plus-icon="la la-chevron-circle-right" :disable="disable" mm-buttons
             />
         </div>
         <div class="q-ml-xs">
diff --git a/client/components/Search/Search.vue b/client/components/Search/Search.vue
index ef90412..c7fe9a9 100644
--- a/client/components/Search/Search.vue
+++ b/client/components/Search/Search.vue
@@ -318,10 +318,6 @@ class Search {
     created() {
         this.commit = this.$store.commit;
 
-        /*this.refresh = _.debounce(() => {
-            this.refreshDebounced();
-        }, 1000);*/
-
         this.loadSettings();
     }
 
diff --git a/client/components/share/NumInput.vue b/client/components/share/NumInput.vue
index bff685f..c89a9e7 100644
--- a/client/components/share/NumInput.vue
+++ b/client/components/share/NumInput.vue
@@ -9,6 +9,16 @@
     >
         <slot></slot>
         <template #prepend>
+            <q-icon
+                v-show="mmButtons"
+                style="font-size: 100%"
+                v-ripple="modelValue != min" 
+                :class="(modelValue != min ? '' : 'disable')" 
+                name="la la-angle-double-left" 
+                class="button" 
+                @click="toMin"
+            />
+
             <q-icon
                 v-ripple="validate(modelValue - step)" 
                 :class="(validate(modelValue - step) ? '' : 'disable')" 
@@ -37,6 +47,17 @@
                 @touchend.stop="onTouchEnd"
                 @touchcancel.prevent.stop="onTouchEnd"
             />
+
+            <q-icon
+                v-show="mmButtons"
+                style="font-size: 100%"
+                v-ripple="modelValue != max" 
+                :class="(modelValue != max ? '' : 'disable')" 
+                name="la la-angle-double-right" 
+                class="button" 
+                @click="toMax"
+            />
+
         </template>
     </q-input>
 </template>
@@ -74,6 +95,7 @@ class NumInput {
         disable: Boolean,
         minusIcon: {type: String, default: 'la la-minus-circle'},
         plusIcon: {type: String, default: 'la la-plus-circle'},
+        mmButtons: Boolean,
     };
 
     filteredValue = 0;
@@ -188,6 +210,14 @@ class NumInput {
         this.inTouch = false;
         this.onMouseUp();
     }
+
+    toMin() {
+        this.filteredValue = this.min;
+    }
+
+    toMax() {
+        this.filteredValue = this.max;
+    }
 }
 
 export default vueComponent(NumInput);
@@ -202,7 +232,9 @@ export default vueComponent(NumInput);
 
 .button {
     font-size: 130%;
-    border-radius: 20px;
+    border-radius: 15px;
+    width: 30px;
+    height: 30px;
     color: #bbb;
     cursor: pointer;
 }