Adds ability to add new credentials

app/Http/Controllers/Api/CredentialsController.php

@@ -26,7 +26,23 @@ class CredentialsController extends Controller
      */
     public function store(Request $request)
     {
-        //
+        $credential = new Credential;
+        $credential->credtype = $request->input('credtype');
+        $credential->creddesc = $request->input('creddesc');
+        $credential->creduser = $request->input('creduser');
+        $credential->credpass = $request->input('credpass');
+        if ($request->has('pcid')) {
+            $credential->pcid = $request->input('pcid');
+            $credential->groupid = 0;
+        } else {
+            $credential->groupid = $request->input('groupid');
+            $credential->pcid = 0;
+        }
+        $credential->patterndata = ' ';
+        $credential->credq = ' ';
+        $credential->creda = ' ';
+        $credential->save();
+        return response()->json($credential, 200);
     }
 
     /**

public/js/app.js

@@ -2198,7 +2198,38 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 /* harmony default export */ __webpack_exports__["default"] = ({
-  props: ['populateWith', 'modalId', 'descriptions'],
+  props: {
+    populateWith: {
+      type: Object,
+      "default": function _default() {
+        return {
+          creddesc: null,
+          creduser: null,
+          credpass: null,
+          groupid: null,
+          pcid: null,
+          credtype: null
+        };
+      }
+    },
+    modalId: {
+      type: String,
+      required: true
+    },
+    descriptions: {
+      type: Object,
+      required: true
+    },
+    create: {
+      type: Boolean
+    },
+    pcid: {
+      type: Number
+    },
+    groupid: {
+      type: Number
+    }
+  },
   data: function data() {
     return {
       data: JSON.parse(JSON.stringify(this.populateWith)),
@@ -2208,9 +2239,6 @@ __webpack_require__.r(__webpack_exports__);
     };
   },
   mounted: function mounted() {
-    // Definitely needs to be refactored into something that runs once
-    // per page instead of once per credential. Only putting this here now
-    // to test something else.
     this.creddesc = {
       'id': this.data.credtype,
       'name': this.data.creddesc
@@ -2231,7 +2259,7 @@ __webpack_require__.r(__webpack_exports__);
       this.data.credpass = this.rndStr(16);
     },
     updateCredential: function updateCredential() {
-      console.log(this.creddesc);
+      var _this = this;
 
       if (this.creddesc.id === "custom") {
         this.data.credtype = 1;
@@ -2241,10 +2269,78 @@ __webpack_require__.r(__webpack_exports__);
         this.data.creddesc = this.creddesc.name;
       }
 
-      axios.put('/api/credentials/' + this.data.credid, this.data).then(function (response) {})["catch"](function (error) {
-        console.error(error);
+      if (this.create) {
+        if (this.pcid) {
+          this.data.pcid = this.pcid;
+        }
+
+        if (this.groupid) {
+          this.data.groupid = this.groupid;
+        }
+
+        axios.post('/api/credentials/', this.data).then(function (response) {
+          $('#' + _this.id).modal('hide');
+        });
+      } else {
+        axios.put('/api/credentials/' + this.data.credid, this.data).then(function (response) {
+          $('#' + _this.id).modal('hide');
+        })["catch"](function (error) {
+          console.error(error);
+        });
+      }
+    }
+  }
+});
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/credential-list.vue?vue&type=script&lang=js&":
+/*!**************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/credential-list.vue?vue&type=script&lang=js& ***!
+  \**************************************************************************************************************************************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+//
+//
+//
+//
+//
+//
+//
+//
+//
+/* harmony default export */ __webpack_exports__["default"] = ({
+  props: {
+    credentialList: {
+      type: Array,
+      required: true
+    },
+    descriptions: {
+      type: Array,
+      required: true
+    },
+    pcid: {
+      type: Number
+    },
+    groupid: {
+      type: Number
+    }
+  },
+  data: function data() {
+    return {
+      credentials: this.credentialList
+    };
+  },
+  computed: {
+    creddescList: function creddescList() {
+      var list = {};
+      this.descriptions.map(function (val) {
+        list[val.creddescid] = val.credtitle;
       });
-      $('#credential' + this.data.credid + 'editModal').modal('hide');
+      return list;
     }
   }
 });
@@ -2295,18 +2391,10 @@ __webpack_require__.r(__webpack_exports__);
   props: ['credential', 'descriptions'],
   data: function data() {
     return {
-      data: JSON.parse(this.credential)
+      data: this.credential,
+      creddescList: this.descriptions
     };
   },
-  computed: {
-    creddescList: function creddescList() {
-      var list = {};
-      JSON.parse(this.descriptions).map(function (val) {
-        list[val.creddescid] = val.credtitle;
-      });
-      return list;
-    }
-  },
   mounted: function mounted() {
     var _this = this;
 
@@ -49382,6 +49470,69 @@ render._withStripped = true
 
 
 
+/***/ }),
+
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e&":
+/*!******************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e& ***!
+  \******************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
+var render = function() {
+  var _vm = this
+  var _h = _vm.$createElement
+  var _c = _vm._self._c || _h
+  return _c(
+    "div",
+    [
+      _c("credential-form-modal", {
+        attrs: {
+          "modal-id": "newCredentialModal",
+          descriptions: _vm.creddescList,
+          create: true,
+          pcid: _vm.pcid
+        }
+      }),
+      _vm._v(" "),
+      _c(
+        "button",
+        {
+          staticClass: "btn btn-primary",
+          attrs: {
+            type: "button",
+            "data-toggle": "modal",
+            "data-target": "#newCredentialModal"
+          }
+        },
+        [_vm._v("New Credential")]
+      ),
+      _vm._v(" "),
+      _vm._l(_vm.credentials, function(credential) {
+        return _c(
+          "div",
+          { key: credential.credid },
+          [
+            _c("credential", {
+              attrs: { credential: credential, descriptions: _vm.creddescList }
+            })
+          ],
+          1
+        )
+      })
+    ],
+    2
+  )
+}
+var staticRenderFns = []
+render._withStripped = true
+
+
+
 /***/ }),
 
 /***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/credential.vue?vue&type=template&id=0f5cc562&":
@@ -62311,6 +62462,7 @@ Vue.component('woinfo-edit-modal', __webpack_require__(/*! ./components/woinfo-e
 Vue.component('errorlist', __webpack_require__(/*! ./components/errorlist.vue */ "./resources/js/components/errorlist.vue")["default"]);
 Vue.component('credential-form-modal', __webpack_require__(/*! ./components/credential-form-modal.vue */ "./resources/js/components/credential-form-modal.vue")["default"]);
 Vue.component('autocomplete-custom-dropdown', __webpack_require__(/*! ./components/autocomplete-custom-dropdown.vue */ "./resources/js/components/autocomplete-custom-dropdown.vue")["default"]);
+Vue.component('credential-list', __webpack_require__(/*! ./components/credential-list.vue */ "./resources/js/components/credential-list.vue")["default"]);
 /**
  * Next, we will create a fresh Vue application instance and attach it to
  * the page. Then, you may begin adding components to this application
@@ -62658,6 +62810,75 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+/***/ }),
+
+/***/ "./resources/js/components/credential-list.vue":
+/*!*****************************************************!*\
+  !*** ./resources/js/components/credential-list.vue ***!
+  \*****************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./credential-list.vue?vue&type=template&id=06d8fa4e& */ "./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e&");
+/* harmony import */ var _credential_list_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./credential-list.vue?vue&type=script&lang=js& */ "./resources/js/components/credential-list.vue?vue&type=script&lang=js&");
+/* empty/unused harmony star reexport *//* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ "./node_modules/vue-loader/lib/runtime/componentNormalizer.js");
+
+
+
+
+
+/* normalize component */
+
+var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__["default"])(
+  _credential_list_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
+  _credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__["render"],
+  _credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* hot reload */
+if (false) { var api; }
+component.options.__file = "resources/js/components/credential-list.vue"
+/* harmony default export */ __webpack_exports__["default"] = (component.exports);
+
+/***/ }),
+
+/***/ "./resources/js/components/credential-list.vue?vue&type=script&lang=js&":
+/*!******************************************************************************!*\
+  !*** ./resources/js/components/credential-list.vue?vue&type=script&lang=js& ***!
+  \******************************************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_credential_list_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib??ref--4-0!../../../node_modules/vue-loader/lib??vue-loader-options!./credential-list.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/credential-list.vue?vue&type=script&lang=js&");
+/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_credential_list_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]); 
+
+/***/ }),
+
+/***/ "./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e&":
+/*!************************************************************************************!*\
+  !*** ./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e& ***!
+  \************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../node_modules/vue-loader/lib??vue-loader-options!./credential-list.vue?vue&type=template&id=06d8fa4e& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/credential-list.vue?vue&type=template&id=06d8fa4e&");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__["render"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_credential_list_vue_vue_type_template_id_06d8fa4e___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
+
+
+
 /***/ }),
 
 /***/ "./resources/js/components/credential.vue":

resources/js/app.js

@@ -32,6 +32,7 @@ Vue.component('woinfo-edit-modal', require('./components/woinfo-edit-modal.vue')
 Vue.component('errorlist', require('./components/errorlist.vue').default);
 Vue.component('credential-form-modal', require('./components/credential-form-modal.vue').default);
 Vue.component('autocomplete-custom-dropdown', require('./components/autocomplete-custom-dropdown.vue').default);
+Vue.component('credential-list', require('./components/credential-list.vue').default);
 
 /**
  * Next, we will create a fresh Vue application instance and attach it to

resources/js/components/credential-form-modal.vue

@@ -26,7 +26,38 @@
 </template>
 <script>
 export default {
-    props: ['populateWith', 'modalId', 'descriptions'],
+    props: {
+        populateWith: {
+            type: Object,
+            default () {
+                return {
+                    creddesc: null,
+                    creduser: null,
+                    credpass: null,
+                    groupid: null,
+                    pcid: null,
+                    credtype: null,
+                }
+            }
+        },
+        modalId: {
+            type: String,
+            required: true
+        },
+        descriptions: {
+            type: Object,
+            required: true
+        },
+        create: {
+            type: Boolean
+        },
+        pcid: {
+            type: Number
+        },
+        groupid: {
+            type: Number
+        }
+    },
     data() {
         return {
             data: JSON.parse(JSON.stringify(this.populateWith)),
@@ -36,9 +67,6 @@ export default {
         }
     },
     mounted () {
-        // Definitely needs to be refactored into something that runs once
-        // per page instead of once per credential. Only putting this here now
-        // to test something else.
         this.creddesc = {
             'id': this.data.credtype,
             'name': this.data.creddesc
@@ -58,7 +86,6 @@ export default {
             this.data.credpass = this.rndStr(16);
         },
         updateCredential() {
-            console.log(this.creddesc)
             if (this.creddesc.id === "custom") {
                 this.data.credtype = 1
                 this.data.creddesc = this.creddesc.name
@@ -67,8 +94,24 @@ export default {
                 this.data.credtype = this.creddesc.id
                 this.data.creddesc = this.creddesc.name
             }
-            axios.put('/api/credentials/' + this.data.credid, this.data).then(response => {}).catch(error =>{console.error(error)});
-            $('#credential'+this.data.credid+'editModal').modal('hide');
+
+            if (this.create) {
+                if(this.pcid) {
+                    this.data.pcid = this.pcid
+                }
+                if(this.groupid) {
+                    this.data.groupid = this.groupid
+                }
+                axios.post('/api/credentials/', this.data)
+                    .then(response => {
+                        $('#'+this.id).modal('hide');
+                    })
+            } else {
+                axios.put('/api/credentials/' + this.data.credid, this.data)
+                    .then(response => {
+                        $('#'+this.id).modal('hide');
+                    }).catch(error =>{console.error(error)});
+            }
         }
     }
     

resources/js/components/credential-list.vue

@@ -0,0 +1,43 @@
+<template>
+    <div>
+        <credential-form-modal modal-id="newCredentialModal" :descriptions="creddescList" :create="true" :pcid="pcid"></credential-form-modal>
+        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#newCredentialModal">New Credential</button>
+        <div v-for="credential in credentials" :key="credential.credid">
+            <credential :credential="credential" :descriptions="creddescList"></credential>
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    props: {
+        credentialList: {
+            type: Array,
+            required: true
+        },
+        descriptions: {
+            type: Array,
+            required: true
+        },
+        pcid: {
+            type: Number
+        },
+        groupid: {
+            type: Number
+        }
+    },
+    data () {
+        return {
+            credentials: this.credentialList
+        }
+    },
+    computed : {
+        creddescList: function () {
+            let list = {}
+            this.descriptions.map(val => {
+                list[val.creddescid] = val.credtitle
+            })
+            return list
+        }
+    },
+}
+</script>

resources/js/components/credential.vue

@@ -34,16 +34,8 @@ export default {
     props: ['credential', 'descriptions'],
     data() {
         return {
-            data: JSON.parse(this.credential),
-        }
-    },
-    computed : {
-        creddescList: function () {
-            let list = {}
-            JSON.parse(this.descriptions).map(val => {
-                list[val.creddescid] = val.credtitle
-            })
-            return list
+            data: this.credential,
+            creddescList: this.descriptions
         }
     },
     mounted() {

resources/views/workorders/show.blade.php

@@ -39,9 +39,7 @@
                         </div>
                         @endif
                         <div class="tab-pane" id="credentials" role="tabpanel" aria-labelledby="credentials-tab">
-                            @foreach ($workOrder->asset->credentials as $cred)
-                                <credential credential="{{$cred}}" descriptions="{{App\CredDesc::all()}}"></credential>
-                            @endforeach
+                            <credential-list :credential-list="{{$workOrder->asset->credentials}}" :descriptions="{{App\CredDesc::all()}}" :pcid="{{$workOrder->asset->pcid}}"></credential-list>
                         </div>
                     </div>
                 </div>

routes/api.php

@@ -26,6 +26,7 @@ Route::middleware('auth:api')->group( function() {
     Route::get('/stores', 'Api\StoresController@index');
     Route::get('/stores/{store}', 'Api\StoresController@show');
 
+    Route::post('/credentials', 'Api\CredentialsController@store');
     Route::put('/credentials/{credential}', 'Api\CredentialsController@update');
 
     Route::get('credtypes', 'Api\CredDescController@index');