add Delete material button

vue-cli3-webapp/src/components/GetMaterials.vue

@@ -46,7 +46,14 @@
                         </td>
                         <td>{{material.name}}</td>
                         <td><b-checkbox v-model="material.isPlot"/></td>
-                        <td>{{material.fname}}</td>
+                        <td>{{material.fname}}
+                            <span class="rh-input">
+                                <b-button @click="deleteMaterial(material.fname);" class="is-danger is-small is-outlined">
+                                    <font-awesome-icon icon="trash"/>
+                                </b-button>
+                                <span class="tooltiptext tip-danger">Delete.</span>
+                            </span>
+                        </td>
                     </tr>
                 </table>
                 <div class="chart-container">
@@ -85,8 +92,7 @@
                     layout: {
                         // title: 'reactive charts',
                         xaxis: {
-                            // will be set on mount
-                            title: ''
+                            title: 'Wavelength, mkm'
                         },
                         yaxis: {
                             title: 'refractive index'
@@ -160,6 +166,13 @@
             sortMaterials() {
                 this.materials.sort((a,b) => (a.name > b.name) ? 1 : ((b.name > a.name) ? -1 : 0));
             },
+            deleteMaterial(fname) {
+                for (let i = 0; i < this.materials.length; i++) {
+                    if (this.materials[i].fname == fname) {
+                        this.materials.splice(i);
+                    }
+                }
+            },
             async loadMaterial(material) {
                 const data_nk = await this.loadMaterialData(material.fname);
                 material.data_nk = data_nk;

vue-cli3-webapp/src/main.js

@@ -7,8 +7,8 @@ Vue.use(Buefy)
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
-import { faCoffee, faCheckCircle, faBan } from '@fortawesome/free-solid-svg-icons'
-library.add(faCoffee, faCheckCircle, faBan)
+import { faCoffee, faCheckCircle, faBan, faTrash } from '@fortawesome/free-solid-svg-icons'
+library.add(faCoffee, faCheckCircle, faBan, faTrash)
 
 Vue.component('font-awesome-icon', FontAwesomeIcon)