Upgrade Vue’s ESLint plugin and re-lint everything

Signed-off-by: Micheal Mand <[email protected]>
arturmamedov · Sep 5, 2019 · dce8baf · dce8baf
1 parent 92ff331
commit dce8baf
Show file tree

Hide file tree

Showing 19 changed files with 62 additions and 79 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -19,7 +19,7 @@ module.exports = {
         'no-param-reassign': ['error', { 'props': false }],
         'vue/html-indent': ['error', 4],
         'vue/max-attributes-per-line': ['error', {
-            'singleline': 4,
+            'singleline': 5,
             'multiline': {
                 'max': 1,
                 'allowFirstLine': false,
@@ -34,6 +34,8 @@ module.exports = {
             'svg': 'any',
             'math': 'always',
         }],
+        'vue/singleline-html-element-content-newline': ['off'],
+        'vue/component-name-in-template-casing': ['error', 'kebab-case'],
     },
     overrides: [
         {

diff --git a/Modules/Core/package.json b/Modules/Core/package.json
diff --git a/Modules/Media/Assets/js/components/MediaForm.vue b/Modules/Media/Assets/js/components/MediaForm.vue
@@ -17,8 +17,8 @@
             </el-breadcrumb>
         </div>
         <el-form
-            v-loading.body="loading"
             ref="form"
+            v-loading.body="loading"
             :model="media"
             label-width="120px"
             label-position="top"
@@ -30,7 +30,6 @@
                         <div class="box-body">
                             <el-tabs v-model="activeTab">
                                 <el-tab-pane v-for="(localeArray, locale) in locales" :key="localeArray.name" :label="localeArray.name" :name="locale">
-
                                     <el-form-item :label="trans('media.form.alt_attribute')" :class="{'el-form-item is-error': form.errors.has(locale + '.alt_attribute') }">
                                         <el-input v-model="media[locale].alt_attribute"></el-input>
                                         <div v-if="form.errors.has(locale + '.alt_attribute')" class="el-form-item__error" v-text="form.errors.first(locale + '.alt_attribute')"></div>

diff --git a/Modules/Media/Assets/js/components/MediaList.vue b/Modules/Media/Assets/js/components/MediaList.vue
@@ -48,8 +48,8 @@
                             </el-col>
                         </el-row>
                         <el-table
-                            v-loading.body="tableIsLoading"
                             ref="mediaTable"
+                            v-loading.body="tableIsLoading"
                             :data="media"
                             stripe
                             style="width: 100%"
@@ -246,7 +246,7 @@
                 this.tableIsLoading = true;
                 this.queryServer({ order_by: event.prop, order: event.order });
             },
-            performSearch: debounce(function (query) {
+            performSearch: debounce((query) => {
                 console.log(`searching:${query.target.value}`);
                 this.tableIsLoading = true;
                 this.queryServer({ search: query.target.value });

diff --git a/Modules/Media/Assets/js/components/MoveMediaDialog.vue b/Modules/Media/Assets/js/components/MoveMediaDialog.vue
@@ -41,7 +41,6 @@
     import Form from 'form-backend-validation';
 
     export default {
-        props: {},
         data() {
             return {
                 selectedMedia: [],

diff --git a/Modules/Media/Assets/js/components/MultipleMedia.vue b/Modules/Media/Assets/js/components/MultipleMedia.vue
@@ -34,12 +34,11 @@
     import merge from 'lodash/merge';
     import reject from 'lodash/reject';
     import MediaList from './MediaList.vue';
-    import UploadZone from './UploadZone.vue';
     import RandomString from '../mixins/RandomString';
     import StringHelpers from '../../../../Core/Assets/js/mixins/StringHelpers';
 
     export default {
-        components: { MediaList, UploadZone },
+        components: { MediaList },
         mixins: [StringHelpers, RandomString],
         props: {
             zone: { required: true, type: String },

diff --git a/Modules/Media/Assets/js/components/SingleMedia.vue b/Modules/Media/Assets/js/components/SingleMedia.vue
@@ -28,12 +28,11 @@
     import isEmpty from 'lodash/isEmpty';
     import merge from 'lodash/merge';
     import MediaList from './MediaList.vue';
-    import UploadZone from './UploadZone.vue';
     import RandomString from '../mixins/RandomString';
     import StringHelpers from '../../../../Core/Assets/js/mixins/StringHelpers';
 
     export default {
-        components: { MediaList, UploadZone },
+        components: { MediaList },
         mixins: [StringHelpers, RandomString],
         props: {
             zone: { required: true, type: String },

diff --git a/Modules/Page/Assets/js/components/PageForm.vue b/Modules/Page/Assets/js/components/PageForm.vue
@@ -29,7 +29,7 @@
                     <div class="box box-primary">
                         <div class="box-body">
                             <el-tabs v-model="activeTab">
-                                <el-tab-pane v-for="(localeArray, locale) in locales" :label="localeArray.name" :key="localeArray.name" :name="locale">
+                                <el-tab-pane v-for="(localeArray, locale) in locales" :key="localeArray.name" :label="localeArray.name" :name="locale">
                                     <span slot="label" :class="{'error' : form.errors.has(locale)}">{{ localeArray.name }}</span>
                                     <el-form-item :label="trans('pages.title')" :class="{'el-form-item is-error': form.errors.has(locale + '.title') }">
                                         <el-input v-model="page[locale].title"></el-input>
@@ -61,7 +61,7 @@
                                                 </a>
                                             </h4>
                                         </div>
-                                        <div :id="`collapseMeta-${locale}`" style="height: 0px;" class="panel-collapse collapse">
+                                        <div :id="`collapseMeta-${locale}`" style="height: 0;" class="panel-collapse collapse">
                                             <div class="box-body">
                                                 <el-form-item :label="trans('pages.meta_title')">
                                                     <el-input v-model="page[locale].meta_title"></el-input>
@@ -81,7 +81,7 @@
                                                 </a>
                                             </h4>
                                         </div>
-                                        <div :id="`collapseFacebook-${locale}`" style="height: 0px;" class="panel-collapse collapse">
+                                        <div :id="`collapseFacebook-${locale}`" style="height: 0;" class="panel-collapse collapse">
                                             <div class="box-body">
                                                 <el-form-item :label="trans('pages.og_title')">
                                                     <el-input v-model="page[locale].og_title"></el-input>
@@ -108,7 +108,6 @@
                                             {{ trans('core.button.cancel') }}
                                         </el-button>
                                     </el-form-item>
-
                                 </el-tab-pane>
                             </el-tabs>
                         </div>
@@ -144,7 +143,7 @@
                 </div>
             </div>
         </el-form>
-        <button v-shortkey="['b']" v-show="false" @shortkey="pushRoute({name: 'admin.page.page.index'})"></button>
+        <button v-show="false" v-shortkey="['b']" @shortkey="pushRoute({name: 'admin.page.page.index'})"></button>
     </div>
 </template>
 

diff --git a/Modules/Page/Assets/js/components/PageTable.vue b/Modules/Page/Assets/js/components/PageTable.vue
@@ -4,21 +4,16 @@
             <div class="box box-primary">
                 <div class="box-body">
                     <data-tables :data="data" :actions-def="actionsDef">
-                        <el-table-column prop="id" label="Id" width="100">
-                        </el-table-column>
-                        <el-table-column prop="title" :label="trans('pages.title')">
-                        </el-table-column>
-                        <el-table-column prop="slug" label="Slug">
-                        </el-table-column>
-                        <el-table-column prop="created_at" label="Created at">
-                        </el-table-column>
+                        <el-table-column prop="id" label="Id" width="100"></el-table-column>
+                        <el-table-column prop="title" :label="trans('pages.title')"></el-table-column>
+                        <el-table-column prop="slug" label="Slug"></el-table-column>
+                        <el-table-column prop="created_at" label="Created at"></el-table-column>
                         <el-table-column fixed="right" prop="actions" label="Actions">
                             <template slot-scope="scope">
-                                <a class="btn btn-default btn-flat" @click.prevent="goToEdit(scope)"><i
-                                        class="fa fa-pencil"></i></a>
-
-                                <delete-button :scope="scope" :rows="data" :translations="translations">
-                                </delete-button>
+                                <el-button-group>
+                                    <edit-button :to="{ name: 'admin.page.page.edit', params: { pageId: scope.row.id } }"></edit-button>
+                                    <delete-button :scope="scope" :rows="data" :translations="translations"></delete-button>
+                                </el-button-group>
                             </template>
                         </el-table-column>
                     </data-tables>
@@ -30,10 +25,13 @@
 
 <script>
     import axios from 'axios';
+    import DeleteButton from '../../../../Core/Assets/js/components/DeleteComponent.vue';
+    import EditButton from '../../../../Core/Assets/js/components/EditButtonComponent.vue';
 
     let data;
 
     export default {
+        components: { DeleteButton, EditButton },
         data() {
             return {
                 data,
@@ -51,6 +49,9 @@
                 },
             };
         },
+        mounted() {
+            this.fetchData();
+        },
         methods: {
             fetchData() {
                 axios.get(route('api.page.page.index'))
@@ -64,8 +65,5 @@
                 this.$router.push({ name: 'admin.page.page.edit', params: { pageId: scope.row.id } });
             },
         },
-        mounted() {
-            this.fetchData();
-        },
     };
 </script>
diff --git a/Modules/Page/Assets/js/components/PageTableServerSide.vue b/Modules/Page/Assets/js/components/PageTableServerSide.vue
@@ -31,7 +31,8 @@
                                         </el-dropdown-menu>
                                     </el-dropdown>
                                     <router-link :to="{name: 'admin.page.page.create'}">
-                                        <el-button type="primary"><i class="el-icon-edit"></i>
+                                        <el-button type="primary">
+                                            <i class="el-icon-edit"></i>
                                             {{ trans('pages.create page') }}
                                         </el-button>
                                     </router-link>
@@ -42,8 +43,8 @@
                             </div>
 
                             <el-table
-                                v-loading.body="tableIsLoading"
                                 ref="pageTable"
+                                v-loading.body="tableIsLoading"
                                 :data="data"
                                 stripe
                                 style="width: 100%"
@@ -100,7 +101,7 @@
                 </div>
             </div>
         </div>
-        <button v-shortkey="['c']" v-show="false" @shortkey="pushRoute({name: 'admin.page.page.create'})"></button>
+        <button v-show="false" v-shortkey="['c']" @shortkey="pushRoute({name: 'admin.page.page.create'})"></button>
     </div>
 </template>
 

diff --git a/Modules/User/Assets/js/components/ApiKeys.vue b/Modules/User/Assets/js/components/ApiKeys.vue
@@ -8,7 +8,8 @@
                 <el-breadcrumb-item>
                     <a href="/backend">{{ trans('core.breadcrumb.home') }}</a>
                 </el-breadcrumb-item>
-                <el-breadcrumb-item :to="{name: 'admin.user.user.account.api-keys'}">{{ trans('users.api-keys') }}
+                <el-breadcrumb-item :to="{name: 'admin.user.user.account.api-keys'}">
+                    {{ trans('users.api-keys') }}
                 </el-breadcrumb-item>
             </el-breadcrumb>
         </div>
@@ -27,7 +28,7 @@
                         <ul class="list-unstyled">
                             <li v-for="key in apiKeys" :key="key.id" style="margin-bottom: 20px;">
                                 <el-input v-model="key.access_token" disabled>
-                                    <el-button slot-scope="prepend" @click="destroyApiKey(key)">
+                                    <el-button slot="prepend" @click="destroyApiKey(key)">
                                         <i class="fa fa-times"></i>
                                     </el-button>
                                 </el-input>
@@ -80,18 +81,16 @@
                     type: 'warning',
                     confirmButtonClass: 'el-button--danger',
                 }).then(() => {
-                        axios.delete(route('api.account.api.destroy', { userTokenId: apiKey.id }))
-                            .then((response) => {
-                                this.loading = false;
-                                this.apiKeys = response.data.data;
-                                this.$message({
-                                    type: 'success',
-                                    message: response.data.message,
-                                });
+                    axios.delete(route('api.account.api.destroy', { userTokenId: apiKey.id }))
+                        .then((response) => {
+                            this.loading = false;
+                            this.apiKeys = response.data.data;
+                            this.$message({
+                                type: 'success',
+                                message: response.data.message,
                             });
-                    })
-                    .catch(() => {
-                    });
+                        });
+                });
             },
         },
     };

diff --git a/Modules/User/Assets/js/components/AsgardPermissions.vue b/Modules/User/Assets/js/components/AsgardPermissions.vue
@@ -94,9 +94,6 @@
             parseTranslation(label) {
                 return this.trans(label.split('::')[1]);
             },
-            getPermissionKey(subPermissionTitle, permissionAction) {
-                return `${subPermissionTitle}.${permissionAction}`;
-            },
             changeState(permissionPart, actions, state) {
                 forEach(actions, (translationKey, key) => {
                     this.permissions[`${permissionPart}.${key}`] = state;

diff --git a/Modules/User/Assets/js/components/RoleForm.vue b/Modules/User/Assets/js/components/RoleForm.vue
@@ -18,8 +18,8 @@
             </el-breadcrumb>
         </div>
         <el-form
-            v-loading.body="loading"
             ref="form"
+            v-loading.body="loading"
             :model="role"
             label-width="120px"
             label-position="top"
@@ -38,7 +38,7 @@
 
                                     <el-form-item :label="trans('roles.form.slug')" :class="{'el-form-item is-error': form.errors.has('slug') }">
                                         <el-input v-model="role.slug">
-                                            <el-button slot-scope="prepend" @click="generateSlug">Generate</el-button>
+                                            <el-button slot="prepend" @click="generateSlug">Generate</el-button>
                                         </el-input>
                                         <div v-if="form.errors.has('slug')" class="el-form-item__error" v-text="form.errors.first('slug')"></div>
                                     </el-form-item>
@@ -68,7 +68,7 @@
                 </div>
             </div>
         </el-form>
-        <button v-shortkey="['b']" v-show="false" @shortkey="pushRoute({name: 'admin.user.role.index'})"></button>
+        <button v-show="false" v-shortkey="['b']" @shortkey="pushRoute({name: 'admin.user.role.index'})"></button>
     </div>
 </template>
 

diff --git a/Modules/User/Assets/js/components/RoleTable.vue b/Modules/User/Assets/js/components/RoleTable.vue
@@ -34,8 +34,8 @@
                             </div>
 
                             <el-table
-                                v-loading.body="tableIsLoading"
                                 ref="pageTable"
+                                v-loading.body="tableIsLoading"
                                 :data="data"
                                 stripe
                                 style="width: 100%"
@@ -82,7 +82,7 @@
                 </div>
             </div>
         </div>
-        <button v-shortkey="['c']" v-show="false" @shortkey="pushRoute({name: 'admin.user.role.create'})"></button>
+        <button v-show="false" v-shortkey="['c']" @shortkey="pushRoute({name: 'admin.user.role.create'})"></button>
     </div>
 </template>
 
@@ -156,7 +156,7 @@
                 this.tableIsLoading = true;
                 this.queryServer({ order_by: event.prop, order: event.order });
             },
-            performSearch: debounce(function (query) {
+            performSearch: debounce((query) => {
                 console.log(`searching:${query.target.value}`);
                 this.tableIsLoading = true;
                 this.queryServer({ search: query.target.value });

diff --git a/Modules/User/Assets/js/components/UserForm.vue b/Modules/User/Assets/js/components/UserForm.vue
@@ -19,8 +19,8 @@
         </div>
 
         <el-form
-            v-loading.body="loading"
             ref="form"
+            v-loading.body="loading"
             :model="user"
             label-width="120px"
             label-position="top"
@@ -69,8 +69,8 @@
                                                 v-for="role in roles"
                                                 :key="role.id"
                                                 :label="role.name"
-                                                :value="role.id">
-                                            </el-option>
+                                                :value="role.id"
+                                            ></el-option>
                                         </el-select>
                                         <div v-if="form.errors.has('password')" class="el-form-item__error" v-text="form.errors.first('password')"></div>
                                     </el-form-item>
@@ -114,7 +114,7 @@
                 </div>
             </div>
         </el-form>
-        <button v-shortkey="['b']" v-show="false" @shortkey="pushRoute({name: 'admin.user.user.index'})"></button>
+        <button v-show="false" v-shortkey="['b']" @shortkey="pushRoute({name: 'admin.user.user.index'})"></button>
     </div>
 </template>
 

diff --git a/Modules/User/Assets/js/components/UserProfile.vue b/Modules/User/Assets/js/components/UserProfile.vue
@@ -15,8 +15,8 @@
         </div>
 
         <el-form
-            v-loading.body="loading"
             ref="form"
+            v-loading.body="loading"
             :model="user"
             label-width="120px"
             label-position="top"
@@ -28,8 +28,7 @@
                         <div class="box-body">
                             <el-tabs>
                                 <el-tab-pane :label="trans('users.tabs.data')">
-                                    <span slot="label" :class="{'error' : form.errors.any()}">{{ trans('users.tabs.data') }}
-                                    </span>
+                                    <span slot="label" :class="{'error' : form.errors.any()}">{{ trans('users.tabs.data') }}</span>
                                     <el-form-item :label="trans('users.form.first-name')" :class="{'el-form-item is-error': form.errors.has('first_name') }">
                                         <el-input v-model="user.first_name"></el-input>
                                         <div v-if="form.errors.has('first_name')" class="el-form-item__error" v-text="form.errors.first('first_name')"></div>