vue

frontend/src/components/Dashboard/DashboardServices.vue

@@ -16,7 +16,7 @@
                 <th scope="col"></th>
             </tr>
             </thead>
-            <draggable tag="tbody" :list="$store.getters.servicesInOrder" :key="this.$store.getters.servicesInOrder.length" class="sortable" handle=".drag_icon">
+            <draggable @update="log" tag="tbody" v-model="servicesList" :list="$store.getters.servicesInOrder" :key="this.$store.getters.servicesInOrder.length" class="sortable" handle=".drag_icon">
             <tr v-for="(service, index) in $store.getters.services" :key="index">
                 <td>
                     <span class="drag_icon d-none d-md-inline">
@@ -118,7 +118,7 @@
   computed: {
     servicesList: {
       get() {
-        return this.$store.getters.servicesInOrder()
+        return this.$store.getters.servicesInOrder
       },
       async set(value) {
         let data = [];
@@ -151,6 +151,10 @@
   methods: {
     reordered_services() {
 
+    },
+    saveUpdatedOrder: function (e) {
+      window.console.log("saving...");
+      window.console.log(this.myViews.array()); // this.myViews.array is not a function
     },
     serviceGroup(s) {
       let group = this.$store.getters.groupById(s.group_id)

frontend/src/components/Dashboard/DashboardUsers.vue

@@ -14,7 +14,7 @@
                 <td>{{user.username}}</td>
                 <td class="text-right">
                     <div class="btn-group">
-                        <a href="user/1" class="btn btn-outline-secondary"><font-awesome-icon icon="user" /> Edit</a>
+                        <a @click="editUser(user)" href="#" class="btn btn-outline-secondary"><font-awesome-icon icon="user" /> Edit</a>
                         <a @click="deleteUser(user)" href="#" class="btn btn-danger"><font-awesome-icon icon="times" /></a>
                     </div>
                 </td>
@@ -22,13 +22,7 @@
             </tbody>
         </table>
 
-        <h1 class="text-black-50 mt-5">Create User</h1>
-
-        <div class="card">
-            <div class="card-body">
-                <FormUser/>
-            </div>
-        </div>
+        <FormUser :in_user="user"/>
     </div>
 </template>
 
@@ -41,10 +35,15 @@
     components: {FormUser},
     data () {
     return {
-
+      edit: false,
+      user: null
     }
   },
   methods: {
+    editUser(u) {
+      this.edit = true
+      this.user = u
+    },
     async deleteUser(u) {
       let c = confirm(`Are you sure you want to delete user '${u.username}'?`)
       if (c) {

frontend/src/forms/User.vue

@@ -1,4 +1,9 @@
 <template>
+    <div>
+        <h1 class="text-black-50 mt-5">{{in_user === null ? "Create User" : "Edit User"}}</h1>
+
+        <div class="card">
+            <div class="card-body">
     <form @submit="saveUser">
         <div class="form-group row">
             <label class="col-sm-4 col-form-label">Username</label>
@@ -37,6 +42,9 @@
         </div>
         <div class="alert alert-danger d-none" id="alerter" role="alert"></div>
     </form>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script>
@@ -45,7 +53,9 @@
   export default {
   name: 'FormUser',
   props: {
-
+    in_user: {
+      type: Object
+    }
   },
   data () {
     return {
@@ -59,7 +69,9 @@
     }
   },
   mounted() {
-
+    if (this.in_user) {
+      this.user = this.in_user
+    }
   },
   computed() {
 

frontend/src/store.js

@@ -38,7 +38,7 @@ export default new Vuex.Store({
         users: state => state.users,
         notifiers: state => state.notifiers,
 
-        servicesInOrder: state => state.services,
+        servicesInOrder: state => state.services.sort((a, b) => a.order_id - b.order_id),
         groupsCleaned:  state => state.groups.filter(g => g.name !== ''),
 
         serviceById: (state) => (id) => {

go.mod

@@ -20,7 +20,6 @@ require (
 	github.com/gorilla/mux v1.7.3
 	github.com/gorilla/websocket v1.4.1 // indirect
 	github.com/hashicorp/golang-lru v0.5.3 // indirect
-	github.com/hunterlong/scopr v0.0.0
 	github.com/jinzhu/gorm v1.9.11
 	github.com/joho/godotenv v1.3.0
 	github.com/lib/pq v1.2.0 // indirect
@@ -41,5 +40,3 @@ require (
 	gopkg.in/natefinch/lumberjack.v2 v2.0.0
 	gopkg.in/yaml.v2 v2.2.7 // indirect
 )
-
-replace github.com/hunterlong/scopr v0.0.0 => ../scopr