From 33f78de7cbd5261c1b2ca1005da8588aa7cfc46b Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Fri, 4 Jun 2021 15:08:45 +0300 Subject: [PATCH 1/6] Minor bug fixes --- app/Http/Controllers/FileController.php | 26 +- public/js/app.js | 267 ++++++++++++------ .../components/ProcessFile/ProcessFile.scss | 8 + .../js/components/ProcessFile/ProcessFile.ts | 12 +- resources/js/components/layout/Header.vue | 8 +- resources/js/services/ApiService.ts | 31 +- routes/api.php | 5 + 7 files changed, 262 insertions(+), 95 deletions(-) diff --git a/app/Http/Controllers/FileController.php b/app/Http/Controllers/FileController.php index 9421c0d..c548237 100644 --- a/app/Http/Controllers/FileController.php +++ b/app/Http/Controllers/FileController.php @@ -54,10 +54,10 @@ class FileController extends Controller public function convert(): JsonResponse { $mdFileContent = request()->input('content'); - $tmpFileId = (string) Str::uuid(); + $fileId = request()->input('file_id'); - Storage::disk('local')->put('tmp/' . $tmpFileId . '.md', $mdFileContent); - $tmpMdFilePath = Storage::path('tmp/' . $tmpFileId . '.md'); + Storage::disk('local')->put('tmp/' . $fileId . '.md', $mdFileContent); + $tmpMdFilePath = Storage::path('tmp/' . $fileId . '.md'); $pandoc = new Process([ 'pandoc', @@ -75,10 +75,10 @@ class FileController extends Controller } $odtFileContent = $pandoc->getOutput(); - Storage::disk('local')->put('tmp/' . $tmpFileId . '.odt', $odtFileContent); + Storage::disk('local')->put('tmp/' . $fileId . '.odt', $odtFileContent); return response()->json([ - 'path' => 'tmp/' . $tmpFileId . '.odt' + 'path' => 'tmp/' . $fileId . '.odt' ]); } @@ -91,4 +91,20 @@ class FileController extends Controller { return Storage::download($path); } + + /** + * Delete a file currently in progress + * + * @param string $id + * @return JsonResponse + */ + public function delete(string $id): JsonResponse + { + $success = Storage::delete([ + "tmp/{$id}.md", + "tmp/{$id}.odt", + "contracts/{$id}.md", + ]); + return response()->json(['success' => $success]); + } } diff --git a/public/js/app.js b/public/js/app.js index 7c04006..95f9226 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -3130,12 +3130,17 @@ var AppHeader = /*#__PURE__*/function (_Vue) { }, { key: "onRouteChange", value: function onRouteChange(url) { + var el = document.body; + setTimeout(function () { + el.classList.remove('p-overflow-hidden'); + }, 10); + this.$confirm.require({ message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', header: 'Confirmation', icon: 'pi pi-exclamation-triangle', + blockScroll: false, accept: function accept() { - console.log("ACCEPT!"); window.location.href = url; }, reject: function reject() {// TODO: Show a message to the user that the action was cancelled. @@ -3533,17 +3538,17 @@ __webpack_require__.r(__webpack_exports__); /* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } +function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } +function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } -function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } +function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } -function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } -function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } -function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } +function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } -function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -3617,7 +3622,37 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { _createClass(ProcessFile, [{ key: "created", value: function created() { + var _this2 = this; + this.intervalId = setInterval(this.waitForFile, 3000); + window.addEventListener('beforeunload', /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee(event) { + var response; + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + // Cancel the event as stated by the standard. + event.preventDefault(); + _context.next = 3; + return _this2.$api.discardFile(_this2.file.id); + + case 3: + response = _context.sent; + return _context.abrupt("return", event); + + case 5: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + return function (_x) { + return _ref.apply(this, arguments); + }; + }()); } /** * MD-to-HTML compiled file content @@ -3716,24 +3751,26 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "uploadFile", value: function () { - var _uploadFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee(event) { - var _this2 = this; + var _uploadFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee2(event) { + var _this3 = this; - return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee$(_context) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee2$(_context2) { while (1) { - switch (_context.prev = _context.next) { + switch (_context2.prev = _context2.next) { case 0: this.$confirm.require({ message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', header: 'Confirmation', icon: 'pi pi-exclamation-triangle', accept: function accept() { - _this2.fileContent = _this2.processedFileContent = ''; + _this3.fileContent = _this3.processedFileContent = ''; var file = event.files[0]; - _this2.toggleUploadDialog(false); + _this3.toggleUploadDialog(false); + + _this3.$api.discardFile(_this3.file.id); - _this2.$emit('newFile', file); + _this3.$emit('newFile', file); }, reject: function reject() {// TODO: Show a message to the user that the action was cancelled. } @@ -3741,13 +3778,13 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { case 1: case "end": - return _context.stop(); + return _context2.stop(); } } - }, _callee, this); + }, _callee2, this); })); - function uploadFile(_x) { + function uploadFile(_x2) { return _uploadFile.apply(this, arguments); } @@ -3760,17 +3797,17 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "waitForFile", value: function () { - var _waitForFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee2() { + var _waitForFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee3() { var response; - return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee2$(_context2) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee3$(_context3) { while (1) { - switch (_context2.prev = _context2.next) { + switch (_context3.prev = _context3.next) { case 0: - _context2.next = 2; + _context3.next = 2; return this.$api.getFileData(this.file.id); case 2: - response = _context2.sent; + response = _context3.sent; if (response.content !== null) { if (response.ingest_status === 'fail') { @@ -3794,10 +3831,10 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { case 4: case "end": - return _context2.stop(); + return _context3.stop(); } } - }, _callee2, this); + }, _callee3, this); })); function waitForFile() { @@ -3828,13 +3865,13 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "runSearchers", value: function () { - var _runSearchers = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee3() { - var _this3 = this; + var _runSearchers = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee4() { + var _this4 = this; var searchers, response; - return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee3$(_context3) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee4$(_context4) { while (1) { - switch (_context3.prev = _context3.next) { + switch (_context4.prev = _context4.next) { case 0: this.processing = true; this.processedFileContent = ''; @@ -3842,14 +3879,14 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { Object.values(this.selectedSearchers).forEach(function (searcher) { searchers.push({ 'key': searcher.id, - 'replace_with': _this3.searchersOptions[searcher.id] || '' + 'replace_with': _this4.searchersOptions[searcher.id] || '' }); }); - _context3.next = 6; + _context4.next = 6; return this.$api.filterDocument(this.fileContent, searchers); case 6: - response = _context3.sent; + response = _context4.sent; this.processedFileContent = response.content; this.documentDiffIndexes = response.indexes; this.createDiffPreview(); @@ -3857,10 +3894,10 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { case 11: case "end": - return _context3.stop(); + return _context4.stop(); } } - }, _callee3, this); + }, _callee4, this); })); function runSearchers() { @@ -3903,25 +3940,25 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "downloadOdt", value: function () { - var _downloadOdt = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee4() { + var _downloadOdt = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee5() { var response; - return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee4$(_context4) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee5$(_context5) { while (1) { - switch (_context4.prev = _context4.next) { + switch (_context5.prev = _context5.next) { case 0: - _context4.next = 2; - return this.$api.convertFile(this.processedFileContent); + _context5.next = 2; + return this.$api.convertFile(this.processedFileContent, this.file.id); case 2: - response = _context4.sent; + response = _context5.sent; window.open("".concat(window.location.origin, "/file/download/") + response.path); case 4: case "end": - return _context4.stop(); + return _context5.stop(); } } - }, _callee4, this); + }, _callee5, this); })); function downloadOdt() { @@ -4032,6 +4069,7 @@ var ApiService = /*#__PURE__*/function () { this.apiRoutes = { file: this.baseUrl + '/api/file', fileDownload: this.baseUrl + '/api/file/convert', + fileDiscard: this.baseUrl + '/api/file/', searchAndDisplace: this.baseUrl + '/search-and-displace' }; } @@ -4182,10 +4220,19 @@ var ApiService = /*#__PURE__*/function () { return filterDocument; }() + /** + * Convert a file from MD to ODT + * + * @param {string} content + * @param {string} fileId + * + * @returns + */ + }, { key: "convertFile", value: function () { - var _convertFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee4(content) { + var _convertFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee4(content, fileId) { var response; return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee4$(_context4) { while (1) { @@ -4194,6 +4241,7 @@ var ApiService = /*#__PURE__*/function () { _context4.prev = 0; _context4.next = 3; return axios__WEBPACK_IMPORTED_MODULE_1___default().post(this.apiRoutes.fileDownload, { + 'file_id': fileId, 'content': content }); @@ -4214,12 +4262,54 @@ var ApiService = /*#__PURE__*/function () { }, _callee4, this, [[0, 7]]); })); - function convertFile(_x5) { + function convertFile(_x5, _x6) { return _convertFile.apply(this, arguments); } return convertFile; }() + /** + * Discard a file in progress + * + * @param {string} fileId + */ + + }, { + key: "discardFile", + value: function () { + var _discardFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee5(fileId) { + var response; + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee5$(_context5) { + while (1) { + switch (_context5.prev = _context5.next) { + case 0: + _context5.prev = 0; + _context5.next = 3; + return axios__WEBPACK_IMPORTED_MODULE_1___default().delete(this.apiRoutes.fileDiscard + fileId); + + case 3: + response = _context5.sent; + return _context5.abrupt("return", response.data); + + case 7: + _context5.prev = 7; + _context5.t0 = _context5["catch"](0); + throw _context5.t0; + + case 10: + case "end": + return _context5.stop(); + } + } + }, _callee5, this, [[0, 7]]); + })); + + function discardFile(_x7) { + return _discardFile.apply(this, arguments); + } + + return discardFile; + }() }]); return ApiService; @@ -4870,7 +4960,7 @@ __webpack_require__.r(__webpack_exports__); var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default()(function(i){return i[1]}); // Module -___CSS_LOADER_EXPORT___.push([module.id, ".file-card {\n flex: 0 1 49%;\n}\n.p-overlaypanel {\n min-width: 450px;\n}\n.p-toolbar-group-right button {\n margin-left: 10px;\n}\n.p-sidebar-content .p-toolbar {\n margin-top: 32px;\n}\n.p-card-header .p-toolbar {\n border: unset;\n border-radius: unset;\n border-bottom: 1px solid #dee2e6;\n padding: 0.5rem;\n}\nbutton.add-searchers {\n height: 100%;\n}\n.p-button.sidebar-toggle-button {\n position: absolute;\n left: calc(-16px - 2.357rem);\n top: 50px;\n border-radius: 3px 0 0 3px;\n}\n.p-col.sidebar-title {\n display: flex;\n align-content: flex-start;\n justify-content: flex-start;\n}\nlabel.switch-label {\n padding-right: 10px;\n}\n.md-viewer {\n text-align: start !important;\n}\n.md-viewer h1, .md-viewer h2, .md-viewer h3, .md-viewer h4, .md-viewer h5 {\n font-size: initial;\n}", ""]); +___CSS_LOADER_EXPORT___.push([module.id, ".file-card {\n flex: 0 1 49%;\n}\n.p-overlaypanel {\n min-width: 450px;\n}\n.p-toolbar-group-right button {\n margin-left: 10px;\n}\n.p-sidebar-content .p-toolbar {\n margin-top: 32px;\n}\n.p-card-header .p-toolbar {\n border: unset;\n border-radius: unset;\n border-bottom: 1px solid #dee2e6;\n padding: 0.5rem;\n}\nbutton.add-searchers {\n height: 100%;\n}\n.p-button.sidebar-toggle-button {\n position: absolute;\n left: calc(-16px - 2.357rem);\n top: 50px;\n border-radius: 3px 0 0 3px;\n}\n.p-col.sidebar-title {\n display: flex;\n align-content: flex-start;\n justify-content: flex-start;\n}\nlabel.switch-label {\n padding-right: 10px;\n}\n.md-viewer {\n text-align: start !important;\n}\n.md-viewer h1, .md-viewer h2, .md-viewer h3, .md-viewer h4, .md-viewer h5 {\n font-size: initial;\n}\n@media only screen and (max-width: 1680px) {\n.p-card-header .p-toolbar {\n flex-flow: column;\n align-items: start;\n}\n}", ""]); // Exports /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___); @@ -30568,51 +30658,58 @@ var render = function() { var _vm = this var _h = _vm.$createElement var _c = _vm._self._c || _h - return _c("div", { staticClass: "header" }, [ - _c( - "div", - { staticClass: "left" }, - [ - _c("Button", { - staticClass: "p-button-primary", - attrs: { label: "Search and Displace" }, - on: { - click: function($event) { - return _vm.onRouteChange("/") + return _c( + "div", + { staticClass: "header" }, + [ + _c( + "div", + { staticClass: "left" }, + [ + _c("Button", { + staticClass: "p-button-primary", + attrs: { label: "Search and Displace" }, + on: { + click: function($event) { + return _vm.onRouteChange("/") + } } - } - }) - ], - 1 - ), - _vm._v(" "), - _c( - "div", - { staticClass: "right" }, - [ - _c("Button", { - staticClass: "p-button-primary fc-button", - attrs: { label: "Add regex" }, - on: { - click: function($event) { - return _vm.onRouteChange("/regex/create") + }) + ], + 1 + ), + _vm._v(" "), + _c( + "div", + { staticClass: "right" }, + [ + _c("Button", { + staticClass: "p-button-primary fc-button", + attrs: { label: "Add regex" }, + on: { + click: function($event) { + return _vm.onRouteChange("/regex/create") + } } - } - }), - _vm._v(" "), - _c("Button", { - staticClass: "p-button-primary fc-button", - attrs: { label: "Searchers" }, - on: { - click: function($event) { - return _vm.onRouteChange("/searchers") + }), + _vm._v(" "), + _c("Button", { + staticClass: "p-button-primary fc-button", + attrs: { label: "Searchers" }, + on: { + click: function($event) { + return _vm.onRouteChange("/searchers") + } } - } - }) - ], - 1 - ) - ]) + }) + ], + 1 + ), + _vm._v(" "), + _c("ConfirmDialog", { attrs: { blockScroll: false } }) + ], + 1 + ) } var staticRenderFns = [] render._withStripped = true diff --git a/resources/js/components/ProcessFile/ProcessFile.scss b/resources/js/components/ProcessFile/ProcessFile.scss index 68642b4..fbf1a8d 100644 --- a/resources/js/components/ProcessFile/ProcessFile.scss +++ b/resources/js/components/ProcessFile/ProcessFile.scss @@ -56,3 +56,11 @@ label.switch-label { font-size: initial; } } + + +@media only screen and (max-width: 1680px) { + .p-card-header .p-toolbar { + flex-flow: column; + align-items: start; + } +} \ No newline at end of file diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index 0348cbb..277d975 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -70,6 +70,15 @@ export default class ProcessFile extends Vue { */ created() { this.intervalId = setInterval(this.waitForFile, 3000); + + window.addEventListener('beforeunload', async (event) => { + // Cancel the event as stated by the standard. + event.preventDefault(); + + const response = await this.$api.discardFile(this.file.id); + + return event; + }); } /** @@ -154,6 +163,7 @@ export default class ProcessFile extends Vue { this.fileContent = this.processedFileContent = ''; let file = event.files[0]; this.toggleUploadDialog(false); + this.$api.discardFile(this.file.id); this.$emit('newFile', file); }, reject: () => { @@ -265,7 +275,7 @@ export default class ProcessFile extends Vue { * Download the document in ODT format */ private async downloadOdt() { - let response = await this.$api.convertFile(this.processedFileContent); + let response = await this.$api.convertFile(this.processedFileContent, this.file.id); window.open(`${window.location.origin}/file/download/` + response.path); } diff --git a/resources/js/components/layout/Header.vue b/resources/js/components/layout/Header.vue index 2a1f28f..a2443ef 100644 --- a/resources/js/components/layout/Header.vue +++ b/resources/js/components/layout/Header.vue @@ -20,7 +20,7 @@ label="Searchers" /> - + @@ -35,12 +35,16 @@ export default class AppHeader extends Vue { } onRouteChange(url: string) { + const el = document.body; + setTimeout(() => { + el.classList.remove('p-overflow-hidden'); + }, 10); this.$confirm.require({ message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', header: 'Confirmation', icon: 'pi pi-exclamation-triangle', + blockScroll: false, accept: () => { - console.log("ACCEPT!"); window.location.href = url; }, reject: () => { diff --git a/resources/js/services/ApiService.ts b/resources/js/services/ApiService.ts index 81dbb70..2429565 100644 --- a/resources/js/services/ApiService.ts +++ b/resources/js/services/ApiService.ts @@ -10,7 +10,8 @@ export default class ApiService { private readonly apiRoutes = { file: this.baseUrl + '/api/file', fileDownload: this.baseUrl + '/api/file/convert', - searchAndDisplace: this.baseUrl + '/search-and-displace' + fileDiscard: this.baseUrl + '/api/file/', + searchAndDisplace: this.baseUrl + '/search-and-displace', }; constructor() { @@ -89,11 +90,20 @@ export default class ApiService { } - public async convertFile(content: string) { + /** + * Convert a file from MD to ODT + * + * @param {string} content + * @param {string} fileId + * + * @returns + */ + public async convertFile(content: string, fileId: string) { try { let response = await axios.post( this.apiRoutes.fileDownload, { + 'file_id': fileId, 'content': content } ); @@ -103,4 +113,21 @@ export default class ApiService { throw err; } } + + /** + * Discard a file in progress + * + * @param {string} fileId + */ + public async discardFile(fileId: string) { + try { + let response = await axios.delete( + this.apiRoutes.fileDiscard + fileId + ); + + return response.data; + } catch (err) { + throw err; + } + } } diff --git a/routes/api.php b/routes/api.php index 717f26a..b85dd27 100644 --- a/routes/api.php +++ b/routes/api.php @@ -30,6 +30,11 @@ Route::name('file.')->prefix('file')->group( FileController::class, 'convert' ])->name('convert'); + + Route::delete('/{id}', [ + FileController::class, + 'delete' + ]); } ); From 9d778ef184c97430c1a3fb360b44f269b696b757 Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Mon, 7 Jun 2021 16:52:33 +0300 Subject: [PATCH 2/6] Fixes #5 . Added validation for mandatory params. --- app/SearchDisplace/Searchers/Mapper.php | 14 + .../Searchers/SearchersCollection.php | 3 + .../Searchers/SearchersStorage.php | 7 + public/js/app.js | 473 +++++++++++++++--- resources/js/app.ts | 3 + resources/js/components/Home/Home.ts | 9 +- .../components/ProcessFile/ProcessFile.scss | 4 + .../js/components/ProcessFile/ProcessFile.ts | 14 +- .../js/components/ProcessFile/ProcessFile.vue | 7 +- resources/js/interfaces/Searcher.ts | 3 +- 10 files changed, 469 insertions(+), 68 deletions(-) diff --git a/app/SearchDisplace/Searchers/Mapper.php b/app/SearchDisplace/Searchers/Mapper.php index b0121d6..192a8ab 100644 --- a/app/SearchDisplace/Searchers/Mapper.php +++ b/app/SearchDisplace/Searchers/Mapper.php @@ -11,54 +11,67 @@ class Mapper $this->mapper = [ 'amount-of-money' => [ 'name' => 'Amount Of Money', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'credit-card-number' => [ 'name' => 'Credit Card Number', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'distance' => [ 'name' => 'Distance', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'duration' => [ 'name' => 'Duration', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'email' => [ 'name' => 'Email', + 'param' => SearchersCollection::PARAM_OPTIONAL ], 'numeral' => [ 'name' => 'Numeral', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'ordinal' => [ 'name' => 'Ordinal', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'phone-number' => [ 'name' => 'Phone Number', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'quantity' => [ 'name' => 'Quantity', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'temperature' => [ 'name' => 'Temperature', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'time' => [ 'name' => 'Time', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'url' => [ 'name' => 'URL', + 'param' => SearchersCollection::PARAM_REQUIRED ], 'volume' => [ 'name' => 'Volume', + 'param' => SearchersCollection::PARAM_REQUIRED ], ]; } @@ -76,6 +89,7 @@ class Mapper $items[$key] = [ 'id' => $key, 'name' => $value['name'], + 'param' => $value['param'] ]; } diff --git a/app/SearchDisplace/Searchers/SearchersCollection.php b/app/SearchDisplace/Searchers/SearchersCollection.php index 1096c7e..54bd17c 100644 --- a/app/SearchDisplace/Searchers/SearchersCollection.php +++ b/app/SearchDisplace/Searchers/SearchersCollection.php @@ -4,6 +4,9 @@ namespace App\SearchDisplace\Searchers; class SearchersCollection { + const PARAM_REQUIRED = 'required'; + const PARAM_OPTIONAL = 'optional'; + public function all() { $collection = []; diff --git a/app/SearchDisplace/Searchers/SearchersStorage.php b/app/SearchDisplace/Searchers/SearchersStorage.php index 4041ffd..5ca2d38 100644 --- a/app/SearchDisplace/Searchers/SearchersStorage.php +++ b/app/SearchDisplace/Searchers/SearchersStorage.php @@ -28,6 +28,13 @@ class SearchersStorage $searchers[$fileName] = [ 'id' => $fileName, 'name' => $result[1], + 'param' => SearchersCollection::PARAM_REQUIRED + ]; + } else if (count($result) === 3) { + $searchers[$fileName] = [ + 'id' => $fileName, + 'name' => $result[1], + 'param' => $result[2] ]; } } diff --git a/public/js/app.js b/public/js/app.js index 2f88331..3c777a0 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -3166,7 +3166,7 @@ AppHeader = (0,tslib__WEBPACK_IMPORTED_MODULE_1__.__decorate)([vue_class_compone "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _bootstrap__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./bootstrap */ "./resources/js/bootstrap.ts"); -/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js"); +/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js"); /* harmony import */ var primevue_config__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! primevue/config */ "./node_modules/primevue/config/index.js"); /* harmony import */ var primevue_button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! primevue/button */ "./node_modules/primevue/button/index.js"); /* harmony import */ var primevue_panel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! primevue/panel */ "./node_modules/primevue/panel/index.js"); @@ -3197,15 +3197,16 @@ __webpack_require__.r(__webpack_exports__); /* harmony import */ var primevue_scrollpanel__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! primevue/scrollpanel */ "./node_modules/primevue/scrollpanel/index.js"); /* harmony import */ var primevue_confirmationservice__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! primevue/confirmationservice */ "./node_modules/primevue/confirmationservice/index.js"); /* harmony import */ var primevue_confirmdialog__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! primevue/confirmdialog */ "./node_modules/primevue/confirmdialog/index.js"); -/* harmony import */ var _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./components/layout/Header.vue */ "./resources/js/components/layout/Header.vue"); -/* harmony import */ var _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./components/layout/Footer.vue */ "./resources/js/components/layout/Footer.vue"); -/* harmony import */ var _components_Regex_Create_vue__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./components/Regex/Create.vue */ "./resources/js/components/Regex/Create.vue"); -/* harmony import */ var _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./components/Searchers/Index.vue */ "./resources/js/components/Searchers/Index.vue"); -/* harmony import */ var _components_Searchers_Create_vue__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./components/Searchers/Create.vue */ "./resources/js/components/Searchers/Create.vue"); -/* harmony import */ var _components_Searchers_Show_vue__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./components/Searchers/Show.vue */ "./resources/js/components/Searchers/Show.vue"); -/* harmony import */ var _plugins_ApiPlugin__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./plugins/ApiPlugin */ "./resources/js/plugins/ApiPlugin.ts"); -/* harmony import */ var _components_Home_Home_vue__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./components/Home/Home.vue */ "./resources/js/components/Home/Home.vue"); -/* harmony import */ var _components_ProcessFile_ProcessFile_vue__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./components/ProcessFile/ProcessFile.vue */ "./resources/js/components/ProcessFile/ProcessFile.vue"); +/* harmony import */ var primevue_tooltip__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! primevue/tooltip */ "./node_modules/primevue/tooltip/index.js"); +/* harmony import */ var _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./components/layout/Header.vue */ "./resources/js/components/layout/Header.vue"); +/* harmony import */ var _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./components/layout/Footer.vue */ "./resources/js/components/layout/Footer.vue"); +/* harmony import */ var _components_Regex_Create_vue__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./components/Regex/Create.vue */ "./resources/js/components/Regex/Create.vue"); +/* harmony import */ var _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./components/Searchers/Index.vue */ "./resources/js/components/Searchers/Index.vue"); +/* harmony import */ var _components_Searchers_Create_vue__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./components/Searchers/Create.vue */ "./resources/js/components/Searchers/Create.vue"); +/* harmony import */ var _components_Searchers_Show_vue__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./components/Searchers/Show.vue */ "./resources/js/components/Searchers/Show.vue"); +/* harmony import */ var _plugins_ApiPlugin__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./plugins/ApiPlugin */ "./resources/js/plugins/ApiPlugin.ts"); +/* harmony import */ var _components_Home_Home_vue__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./components/Home/Home.vue */ "./resources/js/components/Home/Home.vue"); +/* harmony import */ var _components_ProcessFile_ProcessFile_vue__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ./components/ProcessFile/ProcessFile.vue */ "./resources/js/components/ProcessFile/ProcessFile.vue"); /** @@ -3239,6 +3240,7 @@ __webpack_require__.r(__webpack_exports__); + // Own components @@ -3252,54 +3254,55 @@ __webpack_require__.r(__webpack_exports__); -vue__WEBPACK_IMPORTED_MODULE_40__.default.use(primevue_config__WEBPACK_IMPORTED_MODULE_1__.default, { +vue__WEBPACK_IMPORTED_MODULE_41__.default.use(primevue_config__WEBPACK_IMPORTED_MODULE_1__.default, { ripple: true }); -vue__WEBPACK_IMPORTED_MODULE_40__.default.use(primevue_toastservice__WEBPACK_IMPORTED_MODULE_14__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.use(primevue_confirmationservice__WEBPACK_IMPORTED_MODULE_29__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.use(_plugins_ApiPlugin__WEBPACK_IMPORTED_MODULE_37__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Button', primevue_button__WEBPACK_IMPORTED_MODULE_2__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Panel', primevue_panel__WEBPACK_IMPORTED_MODULE_3__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Card', primevue_card__WEBPACK_IMPORTED_MODULE_4__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('FileUpload', primevue_fileupload__WEBPACK_IMPORTED_MODULE_5__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('BlockUI', primevue_blockui__WEBPACK_IMPORTED_MODULE_6__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Sidebar', primevue_sidebar__WEBPACK_IMPORTED_MODULE_7__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('OrderList', primevue_orderlist__WEBPACK_IMPORTED_MODULE_8__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Chip', primevue_chip__WEBPACK_IMPORTED_MODULE_9__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Divider', primevue_divider__WEBPACK_IMPORTED_MODULE_10__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Listbox', primevue_listbox__WEBPACK_IMPORTED_MODULE_11__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Toolbar', primevue_toolbar__WEBPACK_IMPORTED_MODULE_12__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Skeleton', primevue_skeleton__WEBPACK_IMPORTED_MODULE_13__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Toast', primevue_toast__WEBPACK_IMPORTED_MODULE_15__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Dropdown', primevue_dropdown__WEBPACK_IMPORTED_MODULE_17__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Fieldset', primevue_fieldset__WEBPACK_IMPORTED_MODULE_16__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('InputSwitch', primevue_inputswitch__WEBPACK_IMPORTED_MODULE_18__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('DataTable', primevue_datatable__WEBPACK_IMPORTED_MODULE_19__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Column', primevue_column__WEBPACK_IMPORTED_MODULE_20__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('OverlayPanel', primevue_overlaypanel__WEBPACK_IMPORTED_MODULE_21__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Checkbox', primevue_checkbox__WEBPACK_IMPORTED_MODULE_22__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('ProgressSpinner', primevue_progressspinner__WEBPACK_IMPORTED_MODULE_23__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('InputText', primevue_inputtext__WEBPACK_IMPORTED_MODULE_24__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Dialog', primevue_dialog__WEBPACK_IMPORTED_MODULE_25__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Message', primevue_message__WEBPACK_IMPORTED_MODULE_26__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('Timeline', primevue_timeline__WEBPACK_IMPORTED_MODULE_27__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('ScrollPanel', primevue_scrollpanel__WEBPACK_IMPORTED_MODULE_28__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('ConfirmDialog', primevue_confirmdialog__WEBPACK_IMPORTED_MODULE_30__.default); // Layout - -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('app-header', _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_31__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('app-footer', _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_32__.default); // Views - -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('home', _components_Home_Home_vue__WEBPACK_IMPORTED_MODULE_38__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('regex-create', _components_Regex_Create_vue__WEBPACK_IMPORTED_MODULE_33__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('searchers-index', _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_34__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('searchers-create', _components_Searchers_Create_vue__WEBPACK_IMPORTED_MODULE_35__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('searchers-show', _components_Searchers_Show_vue__WEBPACK_IMPORTED_MODULE_36__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('searchers-index', _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_34__.default); // Includes - -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('process-file', _components_ProcessFile_ProcessFile_vue__WEBPACK_IMPORTED_MODULE_39__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('app-header', _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_31__.default); -vue__WEBPACK_IMPORTED_MODULE_40__.default.component('app-footer', _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_32__.default); -new vue__WEBPACK_IMPORTED_MODULE_40__.default({ +vue__WEBPACK_IMPORTED_MODULE_41__.default.use(primevue_toastservice__WEBPACK_IMPORTED_MODULE_14__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.use(primevue_confirmationservice__WEBPACK_IMPORTED_MODULE_29__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.use(_plugins_ApiPlugin__WEBPACK_IMPORTED_MODULE_38__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Button', primevue_button__WEBPACK_IMPORTED_MODULE_2__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Panel', primevue_panel__WEBPACK_IMPORTED_MODULE_3__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Card', primevue_card__WEBPACK_IMPORTED_MODULE_4__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('FileUpload', primevue_fileupload__WEBPACK_IMPORTED_MODULE_5__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('BlockUI', primevue_blockui__WEBPACK_IMPORTED_MODULE_6__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Sidebar', primevue_sidebar__WEBPACK_IMPORTED_MODULE_7__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('OrderList', primevue_orderlist__WEBPACK_IMPORTED_MODULE_8__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Chip', primevue_chip__WEBPACK_IMPORTED_MODULE_9__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Divider', primevue_divider__WEBPACK_IMPORTED_MODULE_10__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Listbox', primevue_listbox__WEBPACK_IMPORTED_MODULE_11__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Toolbar', primevue_toolbar__WEBPACK_IMPORTED_MODULE_12__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Skeleton', primevue_skeleton__WEBPACK_IMPORTED_MODULE_13__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Toast', primevue_toast__WEBPACK_IMPORTED_MODULE_15__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Dropdown', primevue_dropdown__WEBPACK_IMPORTED_MODULE_17__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Fieldset', primevue_fieldset__WEBPACK_IMPORTED_MODULE_16__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('InputSwitch', primevue_inputswitch__WEBPACK_IMPORTED_MODULE_18__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('DataTable', primevue_datatable__WEBPACK_IMPORTED_MODULE_19__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Column', primevue_column__WEBPACK_IMPORTED_MODULE_20__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('OverlayPanel', primevue_overlaypanel__WEBPACK_IMPORTED_MODULE_21__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Checkbox', primevue_checkbox__WEBPACK_IMPORTED_MODULE_22__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('ProgressSpinner', primevue_progressspinner__WEBPACK_IMPORTED_MODULE_23__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('InputText', primevue_inputtext__WEBPACK_IMPORTED_MODULE_24__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Dialog', primevue_dialog__WEBPACK_IMPORTED_MODULE_25__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Message', primevue_message__WEBPACK_IMPORTED_MODULE_26__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('Timeline', primevue_timeline__WEBPACK_IMPORTED_MODULE_27__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('ScrollPanel', primevue_scrollpanel__WEBPACK_IMPORTED_MODULE_28__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('ConfirmDialog', primevue_confirmdialog__WEBPACK_IMPORTED_MODULE_30__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.directive('tooltip', primevue_tooltip__WEBPACK_IMPORTED_MODULE_31__.default); // Layout + +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-header', _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_32__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-footer', _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_33__.default); // Views + +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('home', _components_Home_Home_vue__WEBPACK_IMPORTED_MODULE_39__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('regex-create', _components_Regex_Create_vue__WEBPACK_IMPORTED_MODULE_34__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('searchers-index', _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_35__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('searchers-create', _components_Searchers_Create_vue__WEBPACK_IMPORTED_MODULE_36__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('searchers-show', _components_Searchers_Show_vue__WEBPACK_IMPORTED_MODULE_37__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('searchers-index', _components_Searchers_Index_vue__WEBPACK_IMPORTED_MODULE_35__.default); // Includes + +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('process-file', _components_ProcessFile_ProcessFile_vue__WEBPACK_IMPORTED_MODULE_40__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-header', _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_32__.default); +vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-footer', _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_33__.default); +new vue__WEBPACK_IMPORTED_MODULE_41__.default({ el: '#app' }); @@ -3412,14 +3415,19 @@ var Home = /*#__PURE__*/function (_Vue) { _this.error = ''; return _this; } - /** - * A method which uploads the files to the server for processing - * - * @param {any} event The event containing the uploaded files information - */ - _createClass(Home, [{ + key: "mounted", + value: function mounted() { + console.log('SEARCHERS: ', this.searchers); + } + /** + * A method which uploads the files to the server for processing + * + * @param {any} event The event containing the uploaded files information + */ + + }, { key: "uploadFile", value: function () { var _uploadFile = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee(event) { @@ -3940,7 +3948,7 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "createDiffPreview", value: function createDiffPreview() { - console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); + // console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); this.processedFileContentPreview = this.processedFileContent; var indexes = []; @@ -3994,6 +4002,17 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { return downloadOdt; }() + }, { + key: "isValidParam", + value: function isValidParam(paramId, paramType) { + console.log('PARAM: ', paramId, this.searchersOptions[paramId]); + + if (paramType === 'required' && (this.searchersOptions[paramId] === '' || this.searchersOptions[paramId] === undefined)) { + return false; + } + + return true; + } /** * Watch the `showDiffHighlight` property for changes * @@ -4987,7 +5006,7 @@ __webpack_require__.r(__webpack_exports__); var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default()(function(i){return i[1]}); // Module -___CSS_LOADER_EXPORT___.push([module.id, ".file-card {\n flex: 0 1 49%;\n}\n.p-overlaypanel {\n min-width: 450px;\n}\n.p-toolbar-group-right button {\n margin-left: 10px;\n}\n.p-sidebar-content .p-toolbar {\n margin-top: 32px;\n}\n.p-card-header .p-toolbar {\n border: unset;\n border-radius: unset;\n border-bottom: 1px solid #dee2e6;\n padding: 0.5rem;\n}\nbutton.add-searchers {\n height: 100%;\n}\n.p-button.sidebar-toggle-button {\n position: absolute;\n left: calc(-16px - 2.357rem);\n top: 50px;\n border-radius: 3px 0 0 3px;\n}\n.p-col.sidebar-title {\n display: flex;\n align-content: flex-start;\n justify-content: flex-start;\n}\nlabel.switch-label {\n padding-right: 10px;\n}\n.md-viewer {\n text-align: start !important;\n}\n.md-viewer h1, .md-viewer h2, .md-viewer h3, .md-viewer h4, .md-viewer h5 {\n font-size: initial;\n}\n@media only screen and (max-width: 1680px) {\n.p-card-header .p-toolbar {\n flex-flow: column;\n align-items: start;\n}\n}", ""]); +___CSS_LOADER_EXPORT___.push([module.id, ".file-card {\n flex: 0 1 49%;\n}\n.p-overlaypanel {\n min-width: 450px;\n}\n.p-toolbar-group-right button {\n margin-left: 10px;\n}\n.p-sidebar-content .p-toolbar {\n margin-top: 32px;\n}\n.p-card-header .p-toolbar {\n border: unset;\n border-radius: unset;\n border-bottom: 1px solid #dee2e6;\n padding: 0.5rem;\n}\nbutton.add-searchers {\n height: 100%;\n}\n.p-button.sidebar-toggle-button {\n position: absolute;\n left: calc(-16px - 2.357rem);\n top: 50px;\n border-radius: 3px 0 0 3px;\n}\n.p-col.sidebar-title {\n display: flex;\n align-content: flex-start;\n justify-content: flex-start;\n}\nlabel.switch-label {\n padding-right: 10px;\n}\n.md-viewer {\n text-align: start !important;\n}\n.md-viewer h1, .md-viewer h2, .md-viewer h3, .md-viewer h4, .md-viewer h5 {\n font-size: initial;\n}\n@media only screen and (max-width: 1680px) {\n.p-card-header .p-toolbar {\n flex-flow: column;\n align-items: start;\n}\n}\n.p-tooltip {\n z-index: 2004 !important;\n}", ""]); // Exports /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___); @@ -8536,6 +8555,313 @@ module.exports = __webpack_require__(/*! ./Toolbar.vue */ "./node_modules/primev /***/ }), +/***/ "./node_modules/primevue/tooltip/Tooltip.js": +/*!**************************************************!*\ + !*** ./node_modules/primevue/tooltip/Tooltip.js ***! + \**************************************************/ +/***/ ((__unused_webpack_module, exports, __webpack_require__) => { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.default = void 0; + +var _UniqueComponentId = _interopRequireDefault(__webpack_require__(/*! ../utils/UniqueComponentId */ "./node_modules/primevue/utils/UniqueComponentId.js")); + +var _DomHandler = _interopRequireDefault(__webpack_require__(/*! ../utils/DomHandler */ "./node_modules/primevue/utils/DomHandler.js")); + +var _ConnectedOverlayScrollHandler = _interopRequireDefault(__webpack_require__(/*! ../utils/ConnectedOverlayScrollHandler */ "./node_modules/primevue/utils/ConnectedOverlayScrollHandler.js")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function bindEvents(el) { + var modifiers = el.$_ptooltipModifiers; + + if (modifiers.focus) { + el.addEventListener('focus', onFocus); + el.addEventListener('blur', onBlur); + } else { + el.addEventListener('mouseenter', onMouseEnter); + el.addEventListener('mouseleave', onMouseLeave); + el.addEventListener('click', onClick); + } +} + +function unbindEvents(el) { + var modifiers = el.$_ptooltipModifiers; + + if (modifiers.focus) { + el.removeEventListener('focus', onFocus); + el.removeEventListener('blur', onBlur); + } else { + el.removeEventListener('mouseenter', onMouseEnter); + el.removeEventListener('mouseleave', onMouseLeave); + el.removeEventListener('click', onClick); + } +} + +function bindScrollListener(el) { + if (!el.$_ptooltipScrollHandler) { + el.$_ptooltipScrollHandler = new _ConnectedOverlayScrollHandler.default(el, function () { + hide(el); + }); + } + + el.$_ptooltipScrollHandler.bindScrollListener(); +} + +function unbindScrollListener(el) { + if (el.$_ptooltipScrollHandler) { + el.$_ptooltipScrollHandler.unbindScrollListener(); + } +} + +function onMouseEnter(event) { + show(event.currentTarget); +} + +function onMouseLeave(event) { + hide(event.currentTarget); +} + +function onFocus(event) { + show(event.currentTarget); +} + +function onBlur(event) { + hide(event.currentTarget); +} + +function onClick(event) { + hide(event.currentTarget); +} + +function show(el) { + if (!el.$_ptooltipValue) { + return; + } + + var tooltipElement = create(el); + align(el); + + _DomHandler.default.fadeIn(tooltipElement, 250); + + tooltipElement.style.zIndex = ++_DomHandler.default.zindex; + window.addEventListener('resize', function onWindowResize() { + hide(el); + this.removeEventListener('resize', onWindowResize); + }); + bindScrollListener(el); +} + +function hide(el) { + remove(el); + unbindScrollListener(el); +} + +function getTooltipElement(el) { + return document.getElementById(el.$_ptooltipId); +} + +function create(el) { + var id = (0, _UniqueComponentId.default)() + '_tooltip'; + el.$_ptooltipId = id; + var container = document.createElement('div'); + container.id = id; + var tooltipArrow = document.createElement('div'); + tooltipArrow.className = 'p-tooltip-arrow'; + container.appendChild(tooltipArrow); + var tooltipText = document.createElement('div'); + tooltipText.className = 'p-tooltip-text'; + tooltipText.innerHTML = el.$_ptooltipValue; + container.appendChild(tooltipText); + document.body.appendChild(container); + container.style.display = 'inline-block'; + return container; +} + +function remove(el) { + if (el) { + var tooltipElement = getTooltipElement(el); + + if (tooltipElement && tooltipElement.parentElement) { + document.body.removeChild(tooltipElement); + } + + el.$_ptooltipId = null; + } +} + +function align(el) { + var modifiers = el.$_ptooltipModifiers; + + if (modifiers.top) { + alignTop(el); + + if (isOutOfBounds(el)) { + alignBottom(el); + } + } else if (modifiers.left) { + alignLeft(el); + + if (isOutOfBounds(el)) { + alignRight(el); + + if (isOutOfBounds(el)) { + alignTop(el); + + if (isOutOfBounds(el)) { + alignBottom(el); + } + } + } + } else if (modifiers.bottom) { + alignBottom(el); + + if (isOutOfBounds(el)) { + alignTop(el); + } + } else { + alignRight(el); + + if (isOutOfBounds(el)) { + alignLeft(el); + + if (isOutOfBounds(el)) { + alignTop(el); + + if (isOutOfBounds(el)) { + alignBottom(el); + } + } + } + } +} + +function getHostOffset(el) { + var offset = el.getBoundingClientRect(); + + var targetLeft = offset.left + _DomHandler.default.getWindowScrollLeft(); + + var targetTop = offset.top + _DomHandler.default.getWindowScrollTop(); + + return { + left: targetLeft, + top: targetTop + }; +} + +function alignRight(el) { + preAlign(el, 'right'); + var tooltipElement = getTooltipElement(el); + var hostOffset = getHostOffset(el); + + var left = hostOffset.left + _DomHandler.default.getOuterWidth(el); + + var top = hostOffset.top + (_DomHandler.default.getOuterHeight(el) - _DomHandler.default.getOuterHeight(tooltipElement)) / 2; + tooltipElement.style.left = left + 'px'; + tooltipElement.style.top = top + 'px'; +} + +function alignLeft(el) { + preAlign(el, 'left'); + var tooltipElement = getTooltipElement(el); + var hostOffset = getHostOffset(el); + + var left = hostOffset.left - _DomHandler.default.getOuterWidth(tooltipElement); + + var top = hostOffset.top + (_DomHandler.default.getOuterHeight(el) - _DomHandler.default.getOuterHeight(tooltipElement)) / 2; + tooltipElement.style.left = left + 'px'; + tooltipElement.style.top = top + 'px'; +} + +function alignTop(el) { + preAlign(el, 'top'); + var tooltipElement = getTooltipElement(el); + var hostOffset = getHostOffset(el); + var left = hostOffset.left + (_DomHandler.default.getOuterWidth(el) - _DomHandler.default.getOuterWidth(tooltipElement)) / 2; + + var top = hostOffset.top - _DomHandler.default.getOuterHeight(tooltipElement); + + tooltipElement.style.left = left + 'px'; + tooltipElement.style.top = top + 'px'; +} + +function alignBottom(el) { + preAlign(el, 'bottom'); + var tooltipElement = getTooltipElement(el); + var hostOffset = getHostOffset(el); + var left = hostOffset.left + (_DomHandler.default.getOuterWidth(el) - _DomHandler.default.getOuterWidth(tooltipElement)) / 2; + + var top = hostOffset.top + _DomHandler.default.getOuterHeight(el); + + tooltipElement.style.left = left + 'px'; + tooltipElement.style.top = top + 'px'; +} + +function preAlign(el, position) { + var tooltipElement = getTooltipElement(el); + tooltipElement.style.left = -999 + 'px'; + tooltipElement.style.top = -999 + 'px'; + tooltipElement.className = 'p-tooltip p-component p-tooltip-' + position; +} + +function isOutOfBounds(el) { + var tooltipElement = getTooltipElement(el); + var offset = tooltipElement.getBoundingClientRect(); + var targetTop = offset.top; + var targetLeft = offset.left; + + var width = _DomHandler.default.getOuterWidth(tooltipElement); + + var height = _DomHandler.default.getOuterHeight(tooltipElement); + + var viewport = _DomHandler.default.getViewport(); + + return targetLeft + width > viewport.width || targetLeft < 0 || targetTop < 0 || targetTop + height > viewport.height; +} + +var Tooltip = { + bind: function bind(el, options) { + el.$_ptooltipModifiers = options.modifiers; + el.$_ptooltipValue = options.value; + bindEvents(el); + }, + unbind: function unbind(el) { + remove(el); + unbindEvents(el); + + if (el.$_ptooltipScrollHandler) { + el.$_ptooltipScrollHandler.destroy(); + el.$_ptooltipScrollHandler = null; + } + }, + update: function update(el, options) { + el.$_ptooltipModifiers = options.modifiers; + el.$_ptooltipValue = options.value; + } +}; +var _default = Tooltip; +exports.default = _default; + + +/***/ }), + +/***/ "./node_modules/primevue/tooltip/index.js": +/*!************************************************!*\ + !*** ./node_modules/primevue/tooltip/index.js ***! + \************************************************/ +/***/ ((module, __unused_webpack_exports, __webpack_require__) => { + +"use strict"; + +module.exports = __webpack_require__(/*! ./Tooltip.js */ "./node_modules/primevue/tooltip/Tooltip.js"); + +/***/ }), + /***/ "./node_modules/primevue/utils/ConnectedOverlayScrollHandler.js": /*!**********************************************************************!*\ !*** ./node_modules/primevue/utils/ConnectedOverlayScrollHandler.js ***! @@ -29241,7 +29567,26 @@ var render = function() { ), _vm._v(" "), _c("InputText", { + directives: [ + { + name: "tooltip", + rawName: "v-tooltip.top", + value: + slotProps.data.param === "required" + ? "This field is required." + : null, + expression: + "\n (slotProps.data.param === 'required') ?\n 'This field is required.' : null\n ", + modifiers: { top: true } + } + ], staticClass: "p-inputtext-sm", + class: { + "p-invalid": !_vm.isValidParam( + slotProps.data.id, + slotProps.data.param + ) + }, attrs: { id: "replace_with__" + slotProps.data.id, type: "text" diff --git a/resources/js/app.ts b/resources/js/app.ts index f25cc13..8aa990f 100644 --- a/resources/js/app.ts +++ b/resources/js/app.ts @@ -35,6 +35,7 @@ import Timeline from 'primevue/timeline'; import ScrollPanel from 'primevue/scrollpanel'; import ConfirmationService from 'primevue/confirmationservice'; import ConfirmDialog from 'primevue/confirmdialog'; +import Tooltip from 'primevue/tooltip'; // Own components import AppHeader from './components/layout/Header.vue'; @@ -83,6 +84,8 @@ Vue.component('Timeline', Timeline); Vue.component('ScrollPanel', ScrollPanel); Vue.component('ConfirmDialog', ConfirmDialog); +Vue.directive('tooltip', Tooltip); + // Layout Vue.component('app-header', AppHeader); Vue.component('app-footer', AppFooter); diff --git a/resources/js/components/Home/Home.ts b/resources/js/components/Home/Home.ts index ac26146..e2ba3c5 100644 --- a/resources/js/components/Home/Home.ts +++ b/resources/js/components/Home/Home.ts @@ -1,10 +1,11 @@ import {Vue, Component, Prop} from 'vue-property-decorator'; import FileUploadResponse from '@/interfaces/responses/FileUploadResponse'; +import { Searcher } from '@/interfaces/Searcher'; @Component export default class Home extends Vue { @Prop({default: []}) - public readonly searchers!: { [key: string]: string; } + public readonly searchers!: Searcher[]; public uiBlocked = false; public uploading = false; @@ -15,6 +16,12 @@ export default class Home extends Vue { }; public error: string = ''; + + public mounted() + { + console.log('SEARCHERS: ', this.searchers); + } + /** * A method which uploads the files to the server for processing * diff --git a/resources/js/components/ProcessFile/ProcessFile.scss b/resources/js/components/ProcessFile/ProcessFile.scss index fbf1a8d..ce07cc2 100644 --- a/resources/js/components/ProcessFile/ProcessFile.scss +++ b/resources/js/components/ProcessFile/ProcessFile.scss @@ -63,4 +63,8 @@ label.switch-label { flex-flow: column; align-items: start; } +} + +.p-tooltip { + z-index: 2004 !important; } \ No newline at end of file diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index 487b48d..c61e1dc 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -258,7 +258,7 @@ export default class ProcessFile extends Vue { * Create the diff preview for the document */ private createDiffPreview() { - console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); + // console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); this.processedFileContentPreview = this.processedFileContent; let indexes: Array<{ start: number; end: number }> = []; @@ -294,6 +294,18 @@ export default class ProcessFile extends Vue { window.open(`${window.location.origin}/file/download/` + response.path); } + private isValidParam(paramId: string, paramType: string): boolean { + + console.log('PARAM: ', paramId, this.searchersOptions[paramId]); + if ( + paramType === 'required' && + (this.searchersOptions[paramId] === '' || this.searchersOptions[paramId] === undefined) + ) { + return false; + } + return true; + } + /** * Watch the `showDiffHighlight` property for changes * diff --git a/resources/js/components/ProcessFile/ProcessFile.vue b/resources/js/components/ProcessFile/ProcessFile.vue index f6b3879..2e1df06 100644 --- a/resources/js/components/ProcessFile/ProcessFile.vue +++ b/resources/js/components/ProcessFile/ProcessFile.vue @@ -209,7 +209,12 @@ :id="`replace_with__${slotProps.data.id}`" type="text" class="p-inputtext-sm" - v-model="searchersOptions[slotProps.data.id]"/> + v-model="searchersOptions[slotProps.data.id]" + v-tooltip.top=" + (slotProps.data.param === 'required') ? + 'This field is required.' : null + " + :class="{'p-invalid': !isValidParam(slotProps.data.id, slotProps.data.param)}"/> diff --git a/resources/js/interfaces/Searcher.ts b/resources/js/interfaces/Searcher.ts index 4ebb14b..59a5bda 100644 --- a/resources/js/interfaces/Searcher.ts +++ b/resources/js/interfaces/Searcher.ts @@ -1,5 +1,6 @@ export interface Searcher { id: string; name: string, - description: string, + param: string, + type: string; } From 43cc07f80bc0013a4705fc616a234ef822e210a2 Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Mon, 7 Jun 2021 17:12:33 +0300 Subject: [PATCH 3/6] Minor improvement for param check --- public/js/app.js | 37 ++++++++++++++----- resources/js/app.ts | 2 - .../js/components/ProcessFile/ProcessFile.ts | 25 +++++++++++-- .../js/components/ProcessFile/ProcessFile.vue | 4 +- 4 files changed, 52 insertions(+), 16 deletions(-) diff --git a/public/js/app.js b/public/js/app.js index 3c777a0..401f3a4 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -3948,7 +3948,6 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { }, { key: "createDiffPreview", value: function createDiffPreview() { - // console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); this.processedFileContentPreview = this.processedFileContent; var indexes = []; @@ -4002,11 +4001,35 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { return downloadOdt; }() + }, { + key: "canRunSearchers", + value: function canRunSearchers() { + if (this.fileContent == '' || Object.keys(this.selectedSearchers).length === 0) { + return false; + } + + for (var _i = 0, _Object$keys = Object.keys(this.selectedSearchers); _i < _Object$keys.length; _i++) { + var key = _Object$keys[_i]; + var searcher = this.selectedSearchers[key]; + + if (!this.isValidParam(searcher.id, searcher.param)) { + return false; + } + } + + return true; + } + /** + * Check if a param is valid or not. + * + * @param {string} paramId + * @param {string} paramType + * @returns {boolean} + */ + }, { key: "isValidParam", value: function isValidParam(paramId, paramType) { - console.log('PARAM: ', paramId, this.searchersOptions[paramId]); - if (paramType === 'required' && (this.searchersOptions[paramId] === '' || this.searchersOptions[paramId] === undefined)) { return false; } @@ -29270,9 +29293,7 @@ var render = function() { attrs: { label: "Run filters", icon: "pi pi-play", - disabled: - _vm.fileContent == "" || - Object.keys(_vm.selectedSearchers).length === 0 + disabled: !_vm.canRunSearchers() }, on: { click: _vm.runSearchers } }) @@ -29622,9 +29643,7 @@ var render = function() { attrs: { label: "Run filters", icon: "pi pi-play", - disabled: - _vm.fileContent == "" || - Object.keys(_vm.selectedSearchers).length === 0 + disabled: !_vm.canRunSearchers() }, on: { click: function($event) { diff --git a/resources/js/app.ts b/resources/js/app.ts index 8aa990f..b78b1cd 100644 --- a/resources/js/app.ts +++ b/resources/js/app.ts @@ -92,9 +92,7 @@ Vue.component('app-footer', AppFooter); // Views Vue.component('home', Home); - Vue.component('regex-create', RegexCreate); - Vue.component('searchers-index', SearchersIndex); Vue.component('searchers-create', SearchersCreate); Vue.component('searchers-show', SearchersShow); diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index c61e1dc..569dff4 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -258,7 +258,6 @@ export default class ProcessFile extends Vue { * Create the diff preview for the document */ private createDiffPreview() { - // console.log('CREATING DIFF PREVIEW: ', this.processedFileContent); this.processedFileContentPreview = this.processedFileContent; let indexes: Array<{ start: number; end: number }> = []; @@ -294,9 +293,29 @@ export default class ProcessFile extends Vue { window.open(`${window.location.origin}/file/download/` + response.path); } - private isValidParam(paramId: string, paramType: string): boolean { + private canRunSearchers(): boolean { + if (this.fileContent == '' || Object.keys(this.selectedSearchers).length === 0) { + return false; + } - console.log('PARAM: ', paramId, this.searchersOptions[paramId]); + for (let key of Object.keys(this.selectedSearchers)) { + const searcher = this.selectedSearchers[key]; + if (!this.isValidParam(searcher.id, searcher.param)) { + return false; + } + } + + return true; + } + + /** + * Check if a param is valid or not. + * + * @param {string} paramId + * @param {string} paramType + * @returns {boolean} + */ + private isValidParam(paramId: string, paramType: string): boolean { if ( paramType === 'required' && (this.searchersOptions[paramId] === '' || this.searchersOptions[paramId] === undefined) diff --git a/resources/js/components/ProcessFile/ProcessFile.vue b/resources/js/components/ProcessFile/ProcessFile.vue index 2e1df06..6ed94e3 100644 --- a/resources/js/components/ProcessFile/ProcessFile.vue +++ b/resources/js/components/ProcessFile/ProcessFile.vue @@ -69,7 +69,7 @@ label="Run filters" icon="pi pi-play" class="p-button-success p-button-outlined p-button-sm" - :disabled="fileContent == '' || Object.keys(selectedSearchers).length === 0" + :disabled="!canRunSearchers()" @click="runSearchers"/> @@ -226,7 +226,7 @@ label="Run filters" icon="pi pi-play" class="p-button-success p-button-sm" - :disabled="fileContent == '' || Object.keys(selectedSearchers).length === 0" + :disabled="!canRunSearchers()" @click="toggleSearchersSidebar(); runSearchers()"/> From 284e8d51ba7f6484b97afb6e8ac9b2b2dcf3c306 Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Tue, 8 Jun 2021 11:13:28 +0300 Subject: [PATCH 4/6] Preserver searchers on document change --- resources/js/components/ProcessFile/ProcessFile.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index 569dff4..b66f6c5 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -70,6 +70,16 @@ export default class ProcessFile extends Vue { * */ created() { + let storedSearchers = localStorage.getItem('searchers'); + if (storedSearchers !== null) { + this.selectedSearchers = JSON.parse(storedSearchers); + + let searchersOptions = localStorage.getItem('searchersOptions'); + if (searchersOptions !== null) { + this.searchersOptions = JSON.parse(searchersOptions); + } + } + this.intervalId = setInterval(this.waitForFile, 3000); window.addEventListener('beforeunload', async (event) => { @@ -155,6 +165,8 @@ export default class ProcessFile extends Vue { * @param event The event containing the uploaded files information */ public async uploadFile(event: any): Promise { + localStorage.setItem('searchers', JSON.stringify(this.selectedSearchers)); + localStorage.setItem('searchersOptions', JSON.stringify(this.searchersOptions)); this.$confirm.require({ message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', header: 'Confirmation', From 9c3a42540d94a27784fbcd0665e0ac4e7e53e038 Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Tue, 8 Jun 2021 12:53:09 +0300 Subject: [PATCH 5/6] Minor fix to localstorage --- resources/js/components/ProcessFile/ProcessFile.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index b66f6c5..d8fa80b 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -73,10 +73,12 @@ export default class ProcessFile extends Vue { let storedSearchers = localStorage.getItem('searchers'); if (storedSearchers !== null) { this.selectedSearchers = JSON.parse(storedSearchers); + localStorage.removeItem('searchers'); let searchersOptions = localStorage.getItem('searchersOptions'); if (searchersOptions !== null) { this.searchersOptions = JSON.parse(searchersOptions); + localStorage.removeItem('searchersOptions'); } } From 543892204e86ce677b7f7d19d8f0177aac46a827 Mon Sep 17 00:00:00 2001 From: Radu Liviu Carjan Date: Wed, 9 Jun 2021 17:30:00 +0300 Subject: [PATCH 6/6] Fixes #13. Fixes #14. Also added some minor UI changes. --- public/css/app.css | 8 +- public/js/app.js | 544 +++++++++++++----- resources/js/app.ts | 2 + resources/js/components/Home/Home.ts | 9 +- .../js/components/ProcessFile/ProcessFile.ts | 26 +- .../js/components/ProcessFile/ProcessFile.vue | 4 +- resources/js/components/Regex/Create.vue | 59 +- resources/js/components/Searchers/Create.vue | 16 +- resources/js/components/Searchers/Index.vue | 68 ++- resources/js/components/layout/Header.vue | 27 +- .../sass/components/regex/create/_index.sass | 12 +- 11 files changed, 580 insertions(+), 195 deletions(-) diff --git a/public/css/app.css b/public/css/app.css index 55c498e..e95fb9b 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -10840,7 +10840,7 @@ #regex-create .regex-box { background-color: #001221; display: flex; - width: 850px; + width: 90%; height: 500px; margin-left: auto; margin-right: auto; @@ -10849,14 +10849,10 @@ border-radius: 5px; transition: all 0.25s linear; } -#regex-create .regex-box:hover { - box-shadow: 0.4rem 1.4rem 1.4rem rgba(0, 0, 0, 0.2); - transform: translateY(-10px); -} #regex-create .main { display: flex; flex-direction: column; - width: 550px; + width: 100%; } #regex-create aside { width: 300px; diff --git a/public/js/app.js b/public/js/app.js index 401f3a4..3454a7f 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -1858,12 +1858,13 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ }); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); /* harmony import */ var _TextBox_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./TextBox.vue */ "./resources/js/components/Regex/TextBox.vue"); /* harmony import */ var _PatternBox_vue__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PatternBox.vue */ "./resources/js/components/Regex/PatternBox.vue"); /* harmony import */ var _Flags_vue__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Flags.vue */ "./resources/js/components/Regex/Flags.vue"); /* harmony import */ var _SideBar_vue__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./SideBar.vue */ "./resources/js/components/Regex/SideBar.vue"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -1899,6 +1900,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var Create = /*#__PURE__*/function (_Vue) { _inherits(Create, _Vue); @@ -1977,23 +1979,62 @@ var Create = /*#__PURE__*/function (_Vue) { return save; }() + }, { + key: "changeRoute", + value: function () { + var _changeRoute = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee2(url) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + if (!(this.pattern !== '' && this.pattern !== undefined)) { + _context2.next = 4; + break; + } + + if (this.name === '' || this.name === undefined) { + this.name = 'Unnamed regex - ' + Date.now(); + } + + _context2.next = 4; + return this.save(); + + case 4: + window.location.href = url; + + case 5: + case "end": + return _context2.stop(); + } + } + }, _callee2, this); + })); + + function changeRoute(_x) { + return _changeRoute.apply(this, arguments); + } + + return changeRoute; + }() }, { key: "created", value: function created() { if (this.regex) { this.pattern = this.regex; } + + _app__WEBPACK_IMPORTED_MODULE_6__.eventBus.$on('changeRoute', this.changeRoute); } }]); return Create; }(vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Vue); -(0,tslib__WEBPACK_IMPORTED_MODULE_6__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_7__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ default: '' })], Create.prototype, "regex", void 0); -Create = (0,tslib__WEBPACK_IMPORTED_MODULE_6__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component)({ +Create = (0,tslib__WEBPACK_IMPORTED_MODULE_7__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component)({ name: 'RegexCreate', components: { TextBox: _TextBox_vue__WEBPACK_IMPORTED_MODULE_2__.default, @@ -2376,10 +2417,11 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ }); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); -/* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); -/* harmony import */ var _AddBox_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./AddBox.vue */ "./resources/js/components/Searchers/AddBox.vue"); -/* harmony import */ var _Show_vue__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Show.vue */ "./resources/js/components/Searchers/Show.vue"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); +/* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); +/* harmony import */ var _AddBox_vue__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./AddBox.vue */ "./resources/js/components/Searchers/AddBox.vue"); +/* harmony import */ var _Show_vue__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Show.vue */ "./resources/js/components/Searchers/Show.vue"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -2413,6 +2455,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var Create = /*#__PURE__*/function (_Vue) { _inherits(Create, _Vue); @@ -2634,6 +2677,64 @@ var Create = /*#__PURE__*/function (_Vue) { this.rows.splice(rowIndex, 1); } } + }, { + key: "changeRoute", + value: function () { + var _changeRoute = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee5(url) { + var searcher; + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee5$(_context5) { + while (1) { + switch (_context5.prev = _context5.next) { + case 0: + if (!(this.rows.length > 0)) { + _context5.next = 12; + break; + } + + if (this.name === '' || this.name === undefined) { + this.name = 'Unnamed searcher - ' + Date.now(); + } + + if (!this.id) { + _context5.next = 8; + break; + } + + _context5.next = 5; + return this.update(); + + case 5: + _context5.t0 = _context5.sent; + _context5.next = 11; + break; + + case 8: + _context5.next = 10; + return this.create(); + + case 10: + _context5.t0 = _context5.sent; + + case 11: + searcher = _context5.t0; + + case 12: + window.location.href = url; + + case 13: + case "end": + return _context5.stop(); + } + } + }, _callee5, this); + })); + + function changeRoute(_x3) { + return _changeRoute.apply(this, arguments); + } + + return changeRoute; + }() }, { key: "created", value: function created() { @@ -2643,13 +2744,15 @@ var Create = /*#__PURE__*/function (_Vue) { this.rows = this.searcher.rows; this.name = this.searcher.name; } + + _app__WEBPACK_IMPORTED_MODULE_1__.eventBus.$on('changeRoute', this.changeRoute); } }]); return Create; -}(vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Vue); +}(vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Vue); -(0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_5__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ default: function _default() { return { id: '', @@ -2659,15 +2762,15 @@ var Create = /*#__PURE__*/function (_Vue) { } })], Create.prototype, "searcher", void 0); -(0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_5__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ default: true })], Create.prototype, "standalone", void 0); -Create = (0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component)({ +Create = (0,tslib__WEBPACK_IMPORTED_MODULE_5__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Component)({ name: 'SearcherCreate', components: { - AddBox: _AddBox_vue__WEBPACK_IMPORTED_MODULE_2__.default, - SearcherShow: _Show_vue__WEBPACK_IMPORTED_MODULE_3__.default + AddBox: _AddBox_vue__WEBPACK_IMPORTED_MODULE_3__.default, + SearcherShow: _Show_vue__WEBPACK_IMPORTED_MODULE_4__.default } })], Create); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Create); @@ -2688,8 +2791,9 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ }); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -2721,6 +2825,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var Index = /*#__PURE__*/function (_Vue) { _inherits(Index, _Vue); @@ -2783,8 +2888,56 @@ var Index = /*#__PURE__*/function (_Vue) { }, { key: "onOpen", value: function onOpen(id) { - window.open(this.getURL(id), '_blank'); + window.open(this.getURL(id), '_self'); } + }, { + key: "onEdit", + value: function onEdit(id) { + window.open(this.getURL(id) + '/edit', '_self'); + } + }, { + key: "onDelete", + value: function () { + var _onDelete = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee2(id) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + _context2.prev = 0; + _context2.next = 3; + return window.axios.delete("/searchers/".concat(id)); + + case 3: + this.$toast.add({ + severity: 'success', + summary: 'Searcher deleted.', + life: 3000 + }); + this.searchers = this.searchers.filter(function (x) { + return x.id !== id; + }); + _context2.next = 10; + break; + + case 7: + _context2.prev = 7; + _context2.t0 = _context2["catch"](0); + console.log(_context2.t0); + + case 10: + case "end": + return _context2.stop(); + } + } + }, _callee2, this, [[0, 7]]); + })); + + function onDelete(_x) { + return _onDelete.apply(this, arguments); + } + + return onDelete; + }() }, { key: "getURL", value: function getURL(id) { @@ -2795,29 +2948,59 @@ var Index = /*#__PURE__*/function (_Vue) { value: function selectedSearcherIdChanged(value) { this.$emit('selected', value); } + }, { + key: "changeRoute", + value: function () { + var _changeRoute = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee3(url) { + return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + window.location.href = url; + + case 1: + case "end": + return _context3.stop(); + } + } + }, _callee3); + })); + + function changeRoute(_x2) { + return _changeRoute.apply(this, arguments); + } + + return changeRoute; + }() + }, { + key: "createSearcher", + value: function createSearcher() { + window.location.href = '/searchers/create'; + } }, { key: "created", value: function created() { this.boot(); + _app__WEBPACK_IMPORTED_MODULE_2__.eventBus.$on('changeRoute', this.changeRoute); } }]); return Index; }(vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Vue); -(0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ default: false })], Index.prototype, "allowSelect", void 0); -(0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ default: function _default() { return []; } })], Index.prototype, "ignoreSearcherIds", void 0); -(0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Watch)('selectedSearcher')], Index.prototype, "selectedSearcherIdChanged", null); +(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Watch)('selectedSearcher')], Index.prototype, "selectedSearcherIdChanged", null); -Index = (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component)({})], Index); +Index = (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component)({})], Index); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Index); ; @@ -3082,9 +3265,10 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); -/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js"); -/* harmony import */ var vue_class_component__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vue-class-component */ "./node_modules/vue-class-component/dist/vue-class-component.esm.js"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); +/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js"); +/* harmony import */ var vue_class_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! vue-class-component */ "./node_modules/vue-class-component/dist/vue-class-component.esm.js"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -3111,6 +3295,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var AppHeader = /*#__PURE__*/function (_Vue) { _inherits(AppHeader, _Vue); @@ -3123,36 +3308,22 @@ var AppHeader = /*#__PURE__*/function (_Vue) { } _createClass(AppHeader, [{ - key: "onHomeButtonClick", - value: function onHomeButtonClick() { - window.location.href = '/'; - } - }, { key: "onRouteChange", - value: function onRouteChange(url) { - var el = document.body; - setTimeout(function () { - el.classList.remove('p-overflow-hidden'); - }, 10); - - this.$confirm.require({ - message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', - header: 'Confirmation', - icon: 'pi pi-exclamation-triangle', - blockScroll: false, - accept: function accept() { - window.location.href = url; - }, - reject: function reject() {// TODO: Show a message to the user that the action was cancelled. - } - }); + value: + /** + * Called when we want to change the route + * + * @param {string} url The url to the new route + */ + function onRouteChange(url) { + _app__WEBPACK_IMPORTED_MODULE_0__.eventBus.$emit('changeRoute', url); } }]); return AppHeader; -}(vue__WEBPACK_IMPORTED_MODULE_0__.default); +}(vue__WEBPACK_IMPORTED_MODULE_1__.default); -AppHeader = (0,tslib__WEBPACK_IMPORTED_MODULE_1__.__decorate)([vue_class_component__WEBPACK_IMPORTED_MODULE_2__.default], AppHeader); +AppHeader = (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([vue_class_component__WEBPACK_IMPORTED_MODULE_3__.default], AppHeader); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (AppHeader); /***/ }), @@ -3165,6 +3336,9 @@ AppHeader = (0,tslib__WEBPACK_IMPORTED_MODULE_1__.__decorate)([vue_class_compone "use strict"; __webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "eventBus": () => (/* binding */ eventBus) +/* harmony export */ }); /* harmony import */ var _bootstrap__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./bootstrap */ "./resources/js/bootstrap.ts"); /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js"); /* harmony import */ var primevue_config__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! primevue/config */ "./node_modules/primevue/config/index.js"); @@ -3302,6 +3476,7 @@ vue__WEBPACK_IMPORTED_MODULE_41__.default.component('searchers-index', _componen vue__WEBPACK_IMPORTED_MODULE_41__.default.component('process-file', _components_ProcessFile_ProcessFile_vue__WEBPACK_IMPORTED_MODULE_40__.default); vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-header', _components_layout_Header_vue__WEBPACK_IMPORTED_MODULE_32__.default); vue__WEBPACK_IMPORTED_MODULE_41__.default.component('app-footer', _components_layout_Footer_vue__WEBPACK_IMPORTED_MODULE_33__.default); +var eventBus = new vue__WEBPACK_IMPORTED_MODULE_41__.default(); new vue__WEBPACK_IMPORTED_MODULE_41__.default({ el: '#app' }); @@ -3361,8 +3536,9 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ }); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -3394,6 +3570,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var Home = /*#__PURE__*/function (_Vue) { _inherits(Home, _Vue); @@ -3419,7 +3596,7 @@ var Home = /*#__PURE__*/function (_Vue) { _createClass(Home, [{ key: "mounted", value: function mounted() { - console.log('SEARCHERS: ', this.searchers); + _app__WEBPACK_IMPORTED_MODULE_2__.eventBus.$on('changeRoute', this.changeRoute); } /** * A method which uploads the files to the server for processing @@ -3519,16 +3696,23 @@ var Home = /*#__PURE__*/function (_Vue) { value: function onError(error) { this.error = error; } + }, { + key: "changeRoute", + value: function changeRoute(url) { + if (!this.fileUploaded) { + window.location.href = url; + } + } }]); return Home; }(vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Vue); -(0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Prop)({ default: [] })], Home.prototype, "searchers", void 0); -Home = (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component], Home); +Home = (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([vue_property_decorator__WEBPACK_IMPORTED_MODULE_1__.Component], Home); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Home); /***/ }), @@ -3546,10 +3730,11 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ }); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"); /* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0__); -/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); +/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var marked__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! marked */ "./node_modules/marked/lib/marked.js"); /* harmony import */ var marked__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(marked__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vue-property-decorator */ "./node_modules/vue-property-decorator/lib/vue-property-decorator.js"); +/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/app */ "./resources/js/app.ts"); function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } @@ -3588,6 +3773,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g + var ProcessFile = /*#__PURE__*/function (_Vue) { _inherits(ProcessFile, _Vue); @@ -3638,6 +3824,19 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { value: function created() { var _this2 = this; + var storedSearchers = localStorage.getItem('searchers'); + + if (storedSearchers !== null) { + this.selectedSearchers = JSON.parse(storedSearchers); + localStorage.removeItem('searchers'); + var searchersOptions = localStorage.getItem('searchersOptions'); + + if (searchersOptions !== null) { + this.searchersOptions = JSON.parse(searchersOptions); + localStorage.removeItem('searchersOptions'); + } + } + this.intervalId = setInterval(this.waitForFile, 3000); window.addEventListener('beforeunload', /*#__PURE__*/function () { var _ref = _asyncToGenerator( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_0___default().mark(function _callee(event) { @@ -3667,6 +3866,7 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { return _ref.apply(this, arguments); }; }()); + _app__WEBPACK_IMPORTED_MODULE_3__.eventBus.$on('changeRoute', this.changeRoute); } /** * MD-to-HTML compiled file content @@ -3695,6 +3895,26 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { get: function get() { return marked__WEBPACK_IMPORTED_MODULE_1___default()(this.processedFileContentPreview); } + }, { + key: "changeRoute", + value: function changeRoute(url) { + var el = document.body; + setTimeout(function () { + el.classList.remove('p-overflow-hidden'); + }, 10); + + this.$confirm.require({ + message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', + header: 'Confirmation', + icon: 'pi pi-exclamation-triangle', + blockScroll: false, + accept: function accept() { + window.location.href = url; + }, + reject: function reject() {// TODO: Show a message to the user that the action was cancelled. + } + }); + } /** * Toggle the sidebar containing the searchers */ @@ -3753,7 +3973,7 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { if (typeof newValue !== 'undefined') { this.uploadDialogVisible = newValue; } else { - this.uploadDialogVisible = !this.searchersDialogVisible; + this.uploadDialogVisible = !this.uploadDialogVisible; } } /** @@ -3772,6 +3992,9 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { while (1) { switch (_context2.prev = _context2.next) { case 0: + localStorage.setItem('searchers', JSON.stringify(this.selectedSearchers)); + localStorage.setItem('searchersOptions', JSON.stringify(this.searchersOptions)); + this.$confirm.require({ message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', header: 'Confirmation', @@ -3790,7 +4013,7 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { } }); - case 1: + case 3: case "end": return _context2.stop(); } @@ -4052,7 +4275,7 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { return ProcessFile; }(vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Vue); -(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ default: { id: -1, file: '', @@ -4060,13 +4283,13 @@ var ProcessFile = /*#__PURE__*/function (_Vue) { } })], ProcessFile.prototype, "file", void 0); -(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ +(0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Prop)({ default: [] })], ProcessFile.prototype, "searchers", void 0); -(0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Watch)('showDiffHighlight')], ProcessFile.prototype, "onDiffHighlightChanged", null); +(0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([(0,vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Watch)('showDiffHighlight')], ProcessFile.prototype, "onDiffHighlightChanged", null); -ProcessFile = (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Component], ProcessFile); +ProcessFile = (0,tslib__WEBPACK_IMPORTED_MODULE_4__.__decorate)([vue_property_decorator__WEBPACK_IMPORTED_MODULE_2__.Component], ProcessFile); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ProcessFile); /***/ }), @@ -29412,7 +29635,10 @@ var render = function() { _c("Button", { staticClass: "p-button-info p-button-icon-only sidebar-toggle-button", - attrs: { icon: "pi pi-list" }, + attrs: { + icon: "pi pi-list", + disabled: _vm.searchersDialogVisible === true + }, on: { click: function($event) { return _vm.toggleSearchersSidebar() @@ -29707,6 +29933,7 @@ var render = function() { visible: _vm.uploadDialogVisible, maximizable: true, contentStyle: { overflow: "visible" }, + baseZIndex: 2014, id: "upload_dialog" }, on: { @@ -29762,53 +29989,55 @@ var render = function() { var _h = _vm.$createElement var _c = _vm._self._c || _h return _c("div", { attrs: { id: "regex-create" } }, [ - _c( - "div", - { staticClass: "regex-header" }, - [ - !_vm.regex - ? [ - _c("h1", [_vm._v(" New regex searcher ")]), - _vm._v(" "), - _c("div", { staticClass: "p-field" }, [ - _c( - "span", - { staticClass: "p-float-label" }, - [ - _c("InputText", { - staticClass: "p-inputtext-sm", - attrs: { type: "text", name: "name", id: "name" }, - model: { - value: _vm.name, - callback: function($$v) { - _vm.name = $$v - }, - expression: "name" - } - }) - ], - 1 - ) - ]), - _vm._v(" "), - _c("label", { attrs: { for: "name" } }, [ - _vm._v("Enter searcher name") - ]) - ] - : _vm._e(), - _vm._v(" "), + _c("div", { staticClass: "regex-header" }, [ + !_vm.regex ? _c("h1", [_vm._v(" New regex searcher ")]) : _vm._e(), + _vm._v(" "), + _c("div", { staticClass: "p-d-flex p-jc-center" }, [ _c( - "Button", - { - staticClass: "p-button-sm p-button-raised", - attrs: { disabled: (!_vm.name && !_vm.regex) || !_vm.pattern }, - on: { click: _vm.onSave } - }, - [_vm._v("\n Save\n ")] + "div", + { staticClass: "p-formgroup-inline" }, + [ + !_vm.regex + ? _c("div", { staticClass: "p-field" }, [ + _c( + "span", + { staticClass: "p-float-label" }, + [ + _c("InputText", { + staticClass: "p-inputtext-sm", + attrs: { type: "text", name: "name", id: "name" }, + model: { + value: _vm.name, + callback: function($$v) { + _vm.name = $$v + }, + expression: "name" + } + }), + _vm._v(" "), + _c("label", { attrs: { for: "name" } }, [ + _vm._v("Enter searcher name") + ]) + ], + 1 + ) + ]) + : _vm._e(), + _vm._v(" "), + _c( + "Button", + { + staticClass: "p-button-sm p-button-raised", + attrs: { disabled: (!_vm.name && !_vm.regex) || !_vm.pattern }, + on: { click: _vm.onSave } + }, + [_vm._v("\n Save\n ")] + ) + ], + 1 ) - ], - 2 - ), + ]) + ]), _vm._v(" "), _c("div", { staticClass: "regex-box" }, [ _c( @@ -30689,18 +30918,22 @@ var render = function() { _c("h1", [_vm._v(" Searchers ")]), _vm._v(" "), !_vm.allowSelect - ? _c("div", { staticStyle: { "margin-bottom": "1rem" } }, [ - _c( - "a", - { attrs: { href: "/searchers/create" } }, - [ - _c("Button", { staticClass: "fc-button p-button-success" }, [ - _vm._v("\n Add searcher\n ") - ]) - ], - 1 - ) - ]) + ? _c( + "div", + { staticStyle: { "margin-bottom": "1rem" } }, + [ + _c("Button", { + staticClass: "fc-button p-button-success", + attrs: { label: "Add searcher" }, + on: { + click: function($event) { + return _vm.createSearcher() + } + } + }) + ], + 1 + ) : _vm._e(), _vm._v(" "), _c( @@ -30742,29 +30975,82 @@ var render = function() { _vm._v(" "), _c("Column", { attrs: { header: "Name", sortable: "" }, + scopedSlots: _vm._u([ + { + key: "body", + fn: function(slotProps) { + return [ + _vm._v( + "\n " + + _vm._s(slotProps.data.name) + + "\n " + ) + ] + } + } + ]) + }), + _vm._v(" "), + _c("Column", { + attrs: { header: "Actions", headerStyle: "text-align: right" }, scopedSlots: _vm._u([ { key: "body", fn: function(slotProps) { return [ _c( - "a", + "div", { - staticClass: "searcher-link", - on: { - click: function($event) { - $event.stopPropagation() - return _vm.onOpen(slotProps.data.id) - } - } + staticClass: "action-buttons", + staticStyle: { "text-align": "right" } }, [ - _vm._v( - "\n " + - _vm._s(slotProps.data.name) + - "\n " - ) - ] + _c("Button", { + staticClass: "p-button-sm", + attrs: { + disabled: slotProps.data.type !== "custom", + label: "Open", + icon: "pi pi-folder-open" + }, + on: { + click: function($event) { + $event.stopPropagation() + return _vm.onOpen(slotProps.data.id) + } + } + }), + _vm._v(" "), + _c("Button", { + staticClass: "p-button-sm p-button-success", + attrs: { + disabled: slotProps.data.type !== "custom", + label: "Edit", + icon: "pi pi-pencil" + }, + on: { + click: function($event) { + $event.stopPropagation() + return _vm.onEdit(slotProps.data.id) + } + } + }), + _vm._v(" "), + _c("Button", { + staticClass: "p-button-sm p-button-danger", + attrs: { + disabled: slotProps.data.type !== "custom", + label: "Delete", + icon: "pi pi-times" + }, + on: { + click: function($event) { + $event.stopPropagation() + return _vm.onDelete(slotProps.data.id) + } + } + }) + ], + 1 ) ] } diff --git a/resources/js/app.ts b/resources/js/app.ts index b78b1cd..21e63da 100644 --- a/resources/js/app.ts +++ b/resources/js/app.ts @@ -103,6 +103,8 @@ Vue.component('process-file', ProcessFile); Vue.component('app-header', AppHeader); Vue.component('app-footer', AppFooter); +export const eventBus = new Vue(); + new Vue({ el: '#app', }); diff --git a/resources/js/components/Home/Home.ts b/resources/js/components/Home/Home.ts index e2ba3c5..9d94086 100644 --- a/resources/js/components/Home/Home.ts +++ b/resources/js/components/Home/Home.ts @@ -1,6 +1,7 @@ import {Vue, Component, Prop} from 'vue-property-decorator'; import FileUploadResponse from '@/interfaces/responses/FileUploadResponse'; import { Searcher } from '@/interfaces/Searcher'; +import { eventBus } from '@/app'; @Component export default class Home extends Vue { @@ -19,7 +20,7 @@ export default class Home extends Vue { public mounted() { - console.log('SEARCHERS: ', this.searchers); + eventBus.$on('changeRoute', this.changeRoute); } /** @@ -65,4 +66,10 @@ export default class Home extends Vue { public onError(error: string) { this.error = error; } + + public changeRoute(url: string) { + if (!this.fileUploaded) { + window.location.href = url; + } + } } diff --git a/resources/js/components/ProcessFile/ProcessFile.ts b/resources/js/components/ProcessFile/ProcessFile.ts index d8fa80b..4af3743 100644 --- a/resources/js/components/ProcessFile/ProcessFile.ts +++ b/resources/js/components/ProcessFile/ProcessFile.ts @@ -2,6 +2,7 @@ import marked from 'marked'; import {Vue, Component, Prop, Watch} from 'vue-property-decorator'; import {FileData} from '@/interfaces/FileData'; import { isServerError, getServerErrorMessage } from '@/SearchDisplace/helpers'; +import { eventBus } from '@/app'; @Component export default class ProcessFile extends Vue { @@ -91,7 +92,9 @@ export default class ProcessFile extends Vue { const response = await this.$api.discardFile(this.file.id); return event; - }); + }); + + eventBus.$on('changeRoute', this.changeRoute); } /** @@ -115,6 +118,25 @@ export default class ProcessFile extends Vue { return marked(this.processedFileContentPreview); } + public changeRoute(url: string) { + const el = document.body; + setTimeout(() => { + el.classList.remove('p-overflow-hidden'); + }, 10); + this.$confirm.require({ + message: 'You will lose any progress on the current uploaded document. Are you sure you want to proceed?', + header: 'Confirmation', + icon: 'pi pi-exclamation-triangle', + blockScroll: false, + accept: () => { + window.location.href = url; + }, + reject: () => { + // TODO: Show a message to the user that the action was cancelled. + } + }); + } + /** * Toggle the sidebar containing the searchers */ @@ -157,7 +179,7 @@ export default class ProcessFile extends Vue { if (typeof newValue !== 'undefined') { this.uploadDialogVisible = newValue; } else { - this.uploadDialogVisible = !this.searchersDialogVisible; + this.uploadDialogVisible = !this.uploadDialogVisible; } } diff --git a/resources/js/components/ProcessFile/ProcessFile.vue b/resources/js/components/ProcessFile/ProcessFile.vue index 6ed94e3..0a3d3cf 100644 --- a/resources/js/components/ProcessFile/ProcessFile.vue +++ b/resources/js/components/ProcessFile/ProcessFile.vue @@ -119,7 +119,8 @@ - +