Fix ESLint errors in pagination examples (#3889)

* Fix: Expired and broken websites in expo page (#3780) * Fix: Full width sidebar doesn't have a close button (#3802) * Fix: Full width sidebar doesn't have a close button (#3802) - format code * Fix: Full width sidebar doesn't have a close button (#3802) - Add documentation * Fix eslint errors in pagination examples
buefy · Sep 26, 2023 · 49248ba · 49248ba
1 parent ee2e31e
commit 49248ba
Show file tree

Hide file tree

Showing 2 changed files with 72 additions and 60 deletions.
diff --git a/docs/pages/components/pagination/examples/ExSimple.vue b/docs/pages/components/pagination/examples/ExSimple.vue
@@ -2,18 +2,26 @@
     <section>
         <b-field grouped group-multiline>
             <b-field label="Total">
-                <b-input type="number" v-model="total"></b-input>
+                <b-input type="number" v-model="total"/>
             </b-field>
             <b-field label="Items per page">
-                <b-input type="number" v-model="perPage"></b-input>
+                <b-input type="number" v-model="perPage"/>
             </b-field>
         </b-field>
         <b-field grouped group-multiline>
             <b-field label="Show buttons before current">
-                <b-input type="number" v-model="rangeBefore" min="0"></b-input>
+                <b-input
+                    type="number"
+                    v-model="rangeBefore"
+                    min="0"
+                />
             </b-field>
             <b-field label="Show buttons after current">
-                <b-input type="number" v-model="rangeAfter" min="0"></b-input>
+                <b-input
+                    type="number"
+                    v-model="rangeAfter"
+                    min="0"
+                />
             </b-field>
         </b-field>
         <b-field grouped group-multiline>
@@ -61,7 +69,12 @@
                 </b-select>
             </b-field>
             <b-field label="Debounce input">
-                <b-input type="number" placeholder="milliseconds" v-model="inputDebounce" min="0"></b-input>
+                <b-input
+                    type="number"
+                    placeholder="milliseconds"
+                    v-model="inputDebounce"
+                    min="0"
+                />
             </b-field>
         </b-field>
 
@@ -84,30 +97,30 @@
             aria-current-label="Current page"
             :page-input="hasInput"
             :page-input-position="inputPosition"
-            :debounce-page-input="inputDebounce">
-        </b-pagination>
+            :debounce-page-input="inputDebounce"
+        />
     </section>
 </template>
 
 <script>
-    export default {
-        data() {
-            return {
-                total: 200,
-                current: 10,
-                perPage: 10,
-                rangeBefore: 3,
-                rangeAfter: 1,
-                order: '',
-                size: '',
-                isSimple: false,
-                isRounded: false,
-                hasInput: false,
-                prevIcon: 'chevron-left',
-                nextIcon: 'chevron-right',
-                inputPosition: '',
-                inputDebounce: ''
-            }
+export default {
+    data() {
+        return {
+            total: 200,
+            current: 10,
+            perPage: 10,
+            rangeBefore: 3,
+            rangeAfter: 1,
+            order: '',
+            size: '',
+            isSimple: false,
+            isRounded: false,
+            hasInput: false,
+            prevIcon: 'chevron-left',
+            nextIcon: 'chevron-right',
+            inputPosition: '',
+            inputDebounce: ''
         }
     }
+}
 </script>
diff --git a/docs/pages/components/pagination/examples/ExSlot.vue b/docs/pages/components/pagination/examples/ExSlot.vue
@@ -15,7 +15,6 @@
                 </b-pagination-button>
             </template>
 
-
             <template #previous="props">
                 <b-pagination-button
                     :page="props.page"
@@ -39,41 +38,41 @@
 </template>
 
 <script>
-    export default {
-        data() {
-            return {
-                current: 10,
-                basicRomanNumeral: ['',
-                    'I','II','III','IV','V','VI','VII','VIII','IX','',
-                    'X','XX','XXX','XL','L','LX','LXX','LXXX','XC','',
-                    'C','CC','CCC','CD','D','DC','DCC','DCCC','CM','',
-                    'M','MM','MMM'
-                ]
-            }
-        },
-        methods: {
-            convertToRoman(num) {
-                const numArray = num.toString().split('');
-                const base = numArray.length;
-                let count = base-1;
-                const convertedRoman = numArray.reduce((roman, digit) => {
-                    const digitRoman = this.basicRomanNumeral[+digit + count*10];
-                    const result = roman + digitRoman;
-                    count -= 1;
-                    return result;
-                },'');
-                return convertedRoman;
+export default {
+    data() {
+        return {
+            current: 10,
+            basicRomanNumeral: ['',
+                'I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', '',
+                'X', 'XX', 'XXX', 'XL', 'L', 'LX', 'LXX', 'LXXX', 'XC', '',
+                'C', 'CC', 'CCC', 'CD', 'D', 'DC', 'DCC', 'DCCC', 'CM', '',
+                'M', 'MM', 'MMM'
+            ]
+        }
+    },
+    watch: {
+        $route: {
+            immediate: true,
+            handler(newVal, oldVal) {
+                if (newVal.hash) {
+                    this.current = parseInt(newVal.hash.replace(/page/g, ''))
+                }
             }
-        },
-        watch: {
-            $route: {
-                immediate: true,
-                handler(newVal, oldVal) {
-                    if (newVal.hash) {
-                        this.current = parseInt(newVal.hash.replace(/\#page/g, ''))
-                    }
-                },
-            },
+        }
+    },
+    methods: {
+        convertToRoman(num) {
+            const numArray = num.toString().split('')
+            const base = numArray.length
+            let count = base - 1
+            const convertedRoman = numArray.reduce((roman, digit) => {
+                const digitRoman = this.basicRomanNumeral[+digit + count * 10]
+                const result = roman + digitRoman
+                count -= 1
+                return result
+            }, '')
+            return convertedRoman
         }
     }
+}
 </script>