Removed second router link.

Co-authored-by: aminecmi <aminecmi@gmail.com>
Reviewed-on: https://gitea.amine-louveau.fr/AmineL/liste-de-courses-www/pulls/5

.drone.yml

@@ -0,0 +1,81 @@
+kind: pipeline
+type: docker
+name: analyseAndBuild
+
+steps:
+  - name: code-analysis
+    image: sonarsource/sonar-scanner-cli
+    detach: true
+    failure: ignore
+    commands:
+      - ls -la
+      - sonar-scanner -Dsonar.projectKey=LDC-WWW -Dsonar.sources=. -Dsonar.host.url=$SONAR_HOST_URL -Dsonar.login=$SONAR_LOGIN
+    environment:
+      SONAR_HOST_URL:
+        from_secret: sonarScannerHostUrl
+      SONAR_LOGIN:
+        from_secret: sonarScannerLogin
+
+
+  - name: build
+    image: node:14
+    commands:
+      - npm install
+      - echo $VUE_APP_API_BASE_URL
+      - npm run lint
+      - npm run build:prod
+    environment:
+      VUE_APP_API_BASE_URL:
+        from_secret: baseurl
+trigger:
+  event:
+    - push
+    - pull_request
+
+---
+kind: pipeline
+type: docker
+name: CopyToServer
+
+steps:
+  - name: scp files
+    image: appleboy/drone-scp
+    settings:
+      host: amine-louveau.fr
+      username: ubuntu
+      key:
+        from_secret: privateKey
+      port: 22
+      target: /home/ubuntu/courses
+      source: dist/*
+
+trigger:
+  event:
+    - promote
+  target:
+    - production
+
+---
+kind: pipeline
+type: ssh
+name: Deploy
+
+server:
+  host: amine-louveau.fr
+  user: ubuntu
+  ssh_key:
+    from_secret: ssh_key
+
+steps:
+  - name: copy
+    commands:
+      - cd /home/ubuntu/courses
+      - mv dist/* ./
+      - sudo chown www-data:www-data ./*
+      - sudo rm -rf /var/www/amine/courses/*
+      - sudo mv ./* /var/www/amine/courses/
+trigger:
+  event:
+    - promote
+  target:
+    - production

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
+    "build:prod": "vue-cli-service build --mode production",
     "lint": "vue-cli-service lint"
   },
   "dependencies": {

src/components/ListCreateUpdateModal.vue

@@ -71,7 +71,3 @@ export default {
   }
 }
 </script>
-
-<style scoped>
-
-</style>

src/components/ListItem.vue

@@ -1,14 +1,14 @@
 <template>
   <div class="panel-block" v-bind:class="{'disabled': element.loading}">
-             <span class="icon is-pulled-left" v-if="canMove">
+             <span class="icon is-pulled-left handle" v-if="canMove">
               <ion-icon name="move-outline"></ion-icon>
             </span>
 
-    <input type="checkbox" v-model="element.checked" v-on:change="updateItem(element)">
+    <input type="checkbox" v-model="element.checked" v-on:change="updateCheckbox(element)">
     <div class="field is-horizontal has-addons">
       <div class="control">
         <input class="input" type="text" v-bind:disabled="element.checked" v-model="element.content"
-               v-on:blur="updateItem(element)">
+               v-on:blur="updateContent(element)">
       </div>
       <div class="control">
         <a class="button is-danger" v-on:click="deleteElement(element)">
@@ -29,9 +29,12 @@ export default {
     }
   },
   methods: {
-    updateItem: function () {
+    updateCheckbox: function () {
       this.$emit('updateItem', {id: this.element.id, checked: this.element.checked}, true)
     },
+    updateContent: function () {
+      this.$emit('updateItem', {id: this.element.id, content: this.element.content}, true)
+    },
     deleteElement: function () {
       this.$emit('deleteElement', this.element.id)
     }

src/views/List.vue

@@ -29,7 +29,8 @@
           v-model="searchResults"
           group="listItems"
           @change="onChange"
-          item-key="id" v-if="searchQ.length <= 0">
+          item-key="id" v-if="searchQ.length <= 0"
+          handle=".handle">
         <template #item="{element}">
           <ListItem v-bind:item="element" v-bind:can-move="!element.checked" v-on:updateItem="updateItem" v-on:deleteElement="deleteElement"></ListItem>
         </template>
@@ -157,7 +158,7 @@ export default {
           body: JSON.stringify({content: this.searchQ})
         }).then(r => {
           return r.json();
-        }).then(result => {
+        }).then(() => {
           this.searchQ = '';
           this.fetchListAndItems(true);
         })

src/views/Lists.vue

@@ -11,7 +11,7 @@
       </div>
 
       <div class="level-right">
-        <button class="button is-large" v-on:click="toggleModal">
+        <button class="button is-large" v-on:click="newItem">
           <span class="icon is-medium">
             <ion-icon name="add-outline"></ion-icon>
           </span>
@@ -20,25 +20,27 @@
     </nav>
     <div class="columns">
       <div class="column is-one-quarter"  v-for="item in lists" :key="item.id">
-        <div class="card">
-          <div class="card-content">
-            <p class="title">
-              {{item.name}}
-            </p>
+        <router-link :to="{ name: 'List', params: { id: item.id }}" custom v-slot="{ navigate }">
+          <div class="card" @click="navigate">
+            <div class="card-content">
+              <p class="title">
+                {{item.name}}
+              </p>
+            </div>
+            <footer class="card-footer">
+              <a href="#" class="card-footer-item" v-on:click.prevent="selectItem(item)">Edit</a>
+              <a href="#" class="card-footer-item" v-on:click.prevent="deleteItem(item)">Delete</a>
+            </footer>
           </div>
-          <footer class="card-footer">
-            <router-link class="card-footer-item" :to="{ name: 'List', params: { id: item.id }}">Select</router-link>
-            <a href="#" class="card-footer-item" v-on:click="selectItem(item)">Edit</a>
-            <a href="#" class="card-footer-item" v-on:click="deleteItem(item)">Delete</a>
-          </footer>
-        </div>
+        </router-link>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import ListCreateUpdateModal from "../../../liste-de-courses-www/src/components/ListCreateUpdateModal";
+import ListCreateUpdateModal from "@/components/ListCreateUpdateModal";
+
 export default {
   name: "Lists",
   components: {ListCreateUpdateModal},
@@ -71,8 +73,8 @@ export default {
           'Content-Type': 'application/json;charset=utf-8',
           'X-API-KEY': localStorage.getItem('KEY')
         }
-      }).then(r => {
-        if (r.status !== 404) {
+      }).then(result => {
+        if (result.status !== 404) {
           this.lists = this.lists.filter(r => r.id !== item.id);
         }
       });
@@ -80,6 +82,10 @@ export default {
     toggleModal: function () {
       this.addModalShown = !this.addModalShown;
     },
+    newItem: function () {
+      this.selectedItem = null;
+      this.toggleModal();
+    },
     selectItem: function (item) {
       this.selectedItem = item;
       this.toggleModal();
@@ -102,7 +108,3 @@ export default {
   }
 }
 </script>
-
-<style scoped>
-
-</style>

src/views/Login.vue

@@ -46,7 +46,3 @@ export default {
   }
 }
 </script>
-
-<style scoped>
-
-</style>