From c14611b54e9e1787cb3b335a5dda26ea558b3917 Mon Sep 17 00:00:00 2001 From: Fabio Date: Thu, 29 Aug 2024 12:35:00 -0400 Subject: [PATCH 01/79] FOUR-18617: The Header of the columns will change 'Capitalized Case' --- resources/js/components/shared/FilterTable.vue | 7 +++++++ resources/js/requests/components/RequestsListing.vue | 9 --------- resources/js/tasks/components/TasksList.vue | 6 +----- 3 files changed, 8 insertions(+), 14 deletions(-) diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue index aafdb15225..9e49f82b07 100644 --- a/resources/js/components/shared/FilterTable.vue +++ b/resources/js/components/shared/FilterTable.vue @@ -382,6 +382,13 @@ export default { right: 7px; background-color: #F2F8FE } +.pm-table-ellipsis-column{ + text-transform: capitalize; +} +.pm-table-column-header-text { + overflow: hidden; + text-overflow: ellipsis; +} .pm-table-ellipsis-column .pm-table-filter-button { opacity: 0; visibility: hidden; diff --git a/resources/js/requests/components/RequestsListing.vue b/resources/js/requests/components/RequestsListing.vue index f8cc98328d..7f4d5be172 100644 --- a/resources/js/requests/components/RequestsListing.vue +++ b/resources/js/requests/components/RequestsListing.vue @@ -623,15 +623,6 @@ export default { } }; - diff --git a/resources/js/tasks/components/TasksList.vue b/resources/js/tasks/components/TasksList.vue index 2c81c3b4c7..b60917d83d 100644 --- a/resources/js/tasks/components/TasksList.vue +++ b/resources/js/tasks/components/TasksList.vue @@ -902,7 +902,7 @@ export default { }; - diff --git a/resources/jscomposition/base/form/InputLeading.vue b/resources/jscomposition/base/form/InputLeading.vue new file mode 100644 index 0000000000..0fc68eb6a5 --- /dev/null +++ b/resources/jscomposition/base/form/InputLeading.vue @@ -0,0 +1,34 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/base/form/index.js b/resources/jscomposition/base/form/index.js new file mode 100644 index 0000000000..8eec1e2f5b --- /dev/null +++ b/resources/jscomposition/base/form/index.js @@ -0,0 +1,9 @@ +import Dropdown from "./Dropdown.vue"; +import InputLeading from "./InputLeading.vue"; + +export default {} + +export { + Dropdown, + InputLeading +} \ No newline at end of file diff --git a/resources/jscomposition/base/index.js b/resources/jscomposition/base/index.js new file mode 100644 index 0000000000..ddbe2a67b6 --- /dev/null +++ b/resources/jscomposition/base/index.js @@ -0,0 +1,7 @@ +export * from "./buttons/index" +export * from "./cards/index" +export * from "./form/index" +export * from "./table/index" +export * from "./ui/index" + +export default {} diff --git a/resources/jscomposition/base/table/BaseTable.vue b/resources/jscomposition/base/table/BaseTable.vue new file mode 100644 index 0000000000..fe2a6bfb7f --- /dev/null +++ b/resources/jscomposition/base/table/BaseTable.vue @@ -0,0 +1,72 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/Pagination.vue b/resources/jscomposition/base/table/Pagination.vue new file mode 100644 index 0000000000..9e2d350dba --- /dev/null +++ b/resources/jscomposition/base/table/Pagination.vue @@ -0,0 +1,128 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/TCell.vue b/resources/jscomposition/base/table/TCell.vue new file mode 100644 index 0000000000..ebbcca8edf --- /dev/null +++ b/resources/jscomposition/base/table/TCell.vue @@ -0,0 +1,43 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/TFooter.vue b/resources/jscomposition/base/table/TFooter.vue new file mode 100644 index 0000000000..6c5177e3ea --- /dev/null +++ b/resources/jscomposition/base/table/TFooter.vue @@ -0,0 +1,16 @@ + + + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/THeader.vue b/resources/jscomposition/base/table/THeader.vue new file mode 100644 index 0000000000..e1faf00fb3 --- /dev/null +++ b/resources/jscomposition/base/table/THeader.vue @@ -0,0 +1,55 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/TRow.vue b/resources/jscomposition/base/table/TRow.vue new file mode 100644 index 0000000000..1d700ef645 --- /dev/null +++ b/resources/jscomposition/base/table/TRow.vue @@ -0,0 +1,14 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/table/composables/columnComposable.js b/resources/jscomposition/base/table/composables/columnComposable.js new file mode 100644 index 0000000000..cae2353f02 --- /dev/null +++ b/resources/jscomposition/base/table/composables/columnComposable.js @@ -0,0 +1,55 @@ +import { + ref, onUnmounted +} from "vue"; + +export default {}; +/** + * This composable only works with columns in AppTable + * @param {*} column is a ref variable, come from App Table + * @param {*} tableName + * @returns + */ +export const columnResizeComposable = (column) => { + const startX = ref(0); + const startWidth = ref(0); + const isResizing = ref(false); + + //Resize the column value + const doResize = (event) => { + + if (isResizing.value) { + const diff = event.pageX - startX.value; + const min = 63; + const currentWidth = Math.max(min, startWidth.value + diff); + + column.width = currentWidth; + } + }; + + const stopResize = () => { + if (isResizing.value) { + document.removeEventListener("mousemove", doResize); + document.removeEventListener("mouseup", stopResize); + isResizing.value = false; + } + }; + + // Init the events in mousemove and finish in mouseup event + const startResize = (event, index) => { + isResizing.value = true; + startX.value = event.pageX; + startWidth.value =column.width || 200; + + document.addEventListener("mousemove", doResize); + document.addEventListener("mouseup", stopResize); + }; + + onUnmounted(() => { + document.removeEventListener("mousemove", doResize); + document.removeEventListener("mouseup", stopResize); + }); + + return { + startResize, + }; +}; diff --git a/resources/jscomposition/base/table/index.js b/resources/jscomposition/base/table/index.js new file mode 100644 index 0000000000..927748b7d0 --- /dev/null +++ b/resources/jscomposition/base/table/index.js @@ -0,0 +1,15 @@ +import BaseTable from "./BaseTable.vue"; +import Pagination from "./Pagination.vue"; +import TCell from "./TCell.vue"; +import THeader from "./THeader.vue"; +import TRow from "./TRow.vue"; + +export default {} + +export { + BaseTable, + Pagination, + TCell, + THeader, + TRow +} \ No newline at end of file diff --git a/resources/jscomposition/base/ui/Badge.vue b/resources/jscomposition/base/ui/Badge.vue new file mode 100644 index 0000000000..488d6be08a --- /dev/null +++ b/resources/jscomposition/base/ui/Badge.vue @@ -0,0 +1,22 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/base/ui/index.js b/resources/jscomposition/base/ui/index.js new file mode 100644 index 0000000000..d62371ab35 --- /dev/null +++ b/resources/jscomposition/base/ui/index.js @@ -0,0 +1,7 @@ +import Badge from "./Badge.vue" + +export default {} + +export { + Badge +} \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/App.vue b/resources/jscomposition/cases/casesMain/App.vue new file mode 100644 index 0000000000..e5b412c4ed --- /dev/null +++ b/resources/jscomposition/cases/casesMain/App.vue @@ -0,0 +1,18 @@ + + diff --git a/resources/jscomposition/cases/casesMain/CasesDataSection.vue b/resources/jscomposition/cases/casesMain/CasesDataSection.vue new file mode 100644 index 0000000000..ab6bc00201 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/CasesDataSection.vue @@ -0,0 +1,54 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/CasesMain.vue b/resources/jscomposition/cases/casesMain/CasesMain.vue new file mode 100644 index 0000000000..dd294634be --- /dev/null +++ b/resources/jscomposition/cases/casesMain/CasesMain.vue @@ -0,0 +1,49 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/api/index.js b/resources/jscomposition/cases/casesMain/api/index.js new file mode 100644 index 0000000000..ca51c56e1b --- /dev/null +++ b/resources/jscomposition/cases/casesMain/api/index.js @@ -0,0 +1,35 @@ +export default {} + +// Method to get counters - change with processmaker API +export const getCounters = async () => { + const url = "http://localhost:3000/appcounters"; + return { + myCases: 36, + inProgress: 20, + completed: 125, + allCases: 145, + allRequests: 777 + } +}; + +// Method to get data case list - change with processmaker API +export const getData = async () => { + let objects_list = [] + + for (let i = 0; i <= 31; i++) { + const obj = { + "caseNumber": `${i}`, + "caseTitle": `Case Title ${i}`, + "process": `Process ${i}`, + "task": `Task ${i}`, + "participants": `Avatar ${i}`, + "status": `badge ${i}`, + "started": `21/21/${i}`, + "completed": `22/22/${i}` + }; + + objects_list.push(obj); + } + + return objects_list; +}; \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/components/AppCounters.vue b/resources/jscomposition/cases/casesMain/components/AppCounters.vue new file mode 100644 index 0000000000..6c4bb421de --- /dev/null +++ b/resources/jscomposition/cases/casesMain/components/AppCounters.vue @@ -0,0 +1,67 @@ + + + diff --git a/resources/jscomposition/cases/casesMain/components/AvatarContainer.vue b/resources/jscomposition/cases/casesMain/components/AvatarContainer.vue new file mode 100644 index 0000000000..7bac3776a2 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/components/AvatarContainer.vue @@ -0,0 +1,17 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue b/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue new file mode 100644 index 0000000000..e2c2a493cb --- /dev/null +++ b/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue @@ -0,0 +1,23 @@ + + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/components/BadgesSection.vue b/resources/jscomposition/cases/casesMain/components/BadgesSection.vue new file mode 100644 index 0000000000..1e50276c65 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/components/BadgesSection.vue @@ -0,0 +1,35 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/components/CaseFilter.vue b/resources/jscomposition/cases/casesMain/components/CaseFilter.vue new file mode 100644 index 0000000000..38c94e66e9 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/components/CaseFilter.vue @@ -0,0 +1,22 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/config/badges.js b/resources/jscomposition/cases/casesMain/config/badges.js new file mode 100644 index 0000000000..b36f828a65 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/config/badges.js @@ -0,0 +1,16 @@ +export default {}; + +export const badges = [ + { + label: "Status : In progress" + }, + { + label: "Status : To do" + }, + { + label: "Status : New Badge" + }, + { + label: "Status : Badge Example" + } +]; diff --git a/resources/jscomposition/cases/casesMain/config/columns.js b/resources/jscomposition/cases/casesMain/config/columns.js new file mode 100644 index 0000000000..4f6722f327 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/config/columns.js @@ -0,0 +1,132 @@ +import BadgeContainer from "../components/BadgeContainer.vue"; +import AvatarContainer from "../components/AvatarContainer.vue"; + +export default {} +/** + * Example Column + * field: String + * headerName: String + * headerFormatter: callback + * resizable: Boolean + * visible: Callback + * formatter: Callback - Build the value in the cell + * width: Number + * cellRenderer: Object Vue to custom the cell + */ + +// My cases: [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] +// In Progress : [ Case#, Case Title, Process, Task, Participants, Status, Started] +// Completed : [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] +// AllCases : [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] +// AllRequest : [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] + + +export const caseNumberColumn = ()=>({ + field: "caseNumber", + headerName: "Case #", + resizable: true, + width: 200, +}) + +export const caseTitleColumn = ()=>({ + field: "caseTitle", + headerName: "Case Title", + resizable: true, + width: 200, +}) + +export const processColumn = ()=>({ + field: "process", + headerName: "Process", + resizable: true, + width: 200 +}) + +export const taskColumn = ()=>({ + field: "task", + headerName: "Task", + resizable: true, + width: 200 +}) + + +export const participantsColumn = ()=>({ + field: "participants", + headerName: "Participants", + resizable: true, + width: 200, + cellRenderer: () => { + return AvatarContainer; + } +}) + +export const statusColumn = ()=>({ + field: "status", + headerName: "Status", + resizable: true, + width: 200, + cellRenderer: () => { + return BadgeContainer; + } +}) + +export const startedColumn = ()=>({ + field: "started", + headerName: "Started", + resizable: true, + width: 200 +}) + +export const completedColumn = ()=>({ + field: "completed", + headerName: "Completed", + resizable: true, + width: 200 +}) + +export const getColumns = (type) => { + const columnsDefinition = { + 'my-cases': [ + caseNumberColumn(), + caseTitleColumn(), + processColumn(), + taskColumn(), + participantsColumn(), + statusColumn(), + startedColumn(), + completedColumn() + ], + 'in-progress': [ + caseNumberColumn(), + caseTitleColumn(), + processColumn(), + taskColumn(), + participantsColumn(), + statusColumn(), + startedColumn() + ], + 'completed': [ + caseNumberColumn(), + caseTitleColumn(), + processColumn(), + taskColumn(), + participantsColumn(), + statusColumn(), + startedColumn(), + completedColumn() + ], + 'all-cases': [ + caseNumberColumn(), + caseTitleColumn(), + processColumn(), + taskColumn(), + participantsColumn(), + statusColumn(), + startedColumn(), + completedColumn() + ] + } + + return columnsDefinition[type] || columnsDefinition.myCases; +} + diff --git a/resources/jscomposition/cases/casesMain/config/index.js b/resources/jscomposition/cases/casesMain/config/index.js new file mode 100644 index 0000000000..5bc60f9ebc --- /dev/null +++ b/resources/jscomposition/cases/casesMain/config/index.js @@ -0,0 +1,2 @@ +export * from './columns' +export * from './badges' diff --git a/resources/jscomposition/cases/casesMain/main.js b/resources/jscomposition/cases/casesMain/main.js new file mode 100644 index 0000000000..8b4676c85a --- /dev/null +++ b/resources/jscomposition/cases/casesMain/main.js @@ -0,0 +1,20 @@ + +import App from './App.vue' +import { routes } from './routes'; + +Vue.use(VueRouter); + +const router = new VueRouter({ + mode: "history", + base: "/", + routes +}); + +new Vue({ + el: "#cases-main", + router, + components:{ + App + }, + render: (h) => h(App), +}) diff --git a/resources/jscomposition/cases/casesMain/routes.js b/resources/jscomposition/cases/casesMain/routes.js new file mode 100644 index 0000000000..2a8c3f028b --- /dev/null +++ b/resources/jscomposition/cases/casesMain/routes.js @@ -0,0 +1,28 @@ +import CasesMain from "./CasesMain.vue" +import CasesDataSection from "./CasesDataSection.vue" + +export default {} + +export const routes = [ + { + name: "cases", + path: "/cases-main", + component: CasesMain, + props(route) { + return {}; + }, + children:[ + { + name: "cases-request", + path: ":id?", + component: CasesDataSection, + props(route) { + return { + listId: route.params?.id || 'my-cases', + }; + } + } + ] + + } +] \ No newline at end of file diff --git a/resources/jscomposition/cases/casesMain/utils/counters.js b/resources/jscomposition/cases/casesMain/utils/counters.js new file mode 100644 index 0000000000..63c26b053c --- /dev/null +++ b/resources/jscomposition/cases/casesMain/utils/counters.js @@ -0,0 +1,45 @@ +export default {} + +export const formatCounters = (data)=>{ + const counters = [ + { + header: "My cases", + body:data.myCases.toString(), + color:"amber", + icon:"fa-regular fa-user", + url:'/cases-main/my-cases' + }, + { + header: "In progress", + body:data.inProgress.toString(), + color:"green", + icon:"fa-solid fa-list", + url:'/cases-main/in-progress' + }, + { + header: "Completed", + body:data.completed.toString(), + color:"blue", + icon:"fa-regular fa-circle-check", + url:'/cases-main/completed' + }, + { + header: "All cases", + body:data.allCases.toString(), + color:"purple", + icon:"fa-regular fa-clipboard", + url:'/cases-main/all-cases' + }, + { + header: "All requests", + body:data.allRequests.toString(), + color:"gray", + icon:"fa-solid fa-play", + url:()=>{ + window.location.href = "/cases" + } + } + ] + + return counters +} diff --git a/resources/jscomposition/cases/casesMain/utils/index.js b/resources/jscomposition/cases/casesMain/utils/index.js new file mode 100644 index 0000000000..069f2719f6 --- /dev/null +++ b/resources/jscomposition/cases/casesMain/utils/index.js @@ -0,0 +1 @@ +export * from './counters' \ No newline at end of file diff --git a/resources/jscomposition/system/Breadcrums.vue b/resources/jscomposition/system/Breadcrums.vue new file mode 100644 index 0000000000..0c41c4d43a --- /dev/null +++ b/resources/jscomposition/system/Breadcrums.vue @@ -0,0 +1,38 @@ + + \ No newline at end of file diff --git a/resources/jscomposition/system/index.js b/resources/jscomposition/system/index.js new file mode 100644 index 0000000000..87a413c41b --- /dev/null +++ b/resources/jscomposition/system/index.js @@ -0,0 +1,7 @@ +import Breadcrums from "./Breadcrums.vue"; + +export default {} + +export { + Breadcrums +} \ No newline at end of file diff --git a/resources/views/cases/casesMain.blade.php b/resources/views/cases/casesMain.blade.php new file mode 100644 index 0000000000..9cc846d4de --- /dev/null +++ b/resources/views/cases/casesMain.blade.php @@ -0,0 +1,24 @@ +@extends('layouts.layout') + + + +@section('title') +@endsection + +@section('sidebar') +@include('layouts.sidebar', ['sidebar'=> Menu::get('sidebar_request')]) +@endsection + +@section('breadcrumbs') +@endsection + +@section('content') +
+@endsection + +@section('js') + +@endsection + +@section('css') +@endsection diff --git a/routes/web.php b/routes/web.php index c3848838a7..2fa719a5f2 100644 --- a/routes/web.php +++ b/routes/web.php @@ -32,6 +32,7 @@ use ProcessMaker\Http\Controllers\ProcessesCatalogueController; use ProcessMaker\Http\Controllers\ProfileController; use ProcessMaker\Http\Controllers\RequestController; +use ProcessMaker\Http\Controllers\CasesController; use ProcessMaker\Http\Controllers\Saml\MetadataController; use ProcessMaker\Http\Controllers\TaskController; use ProcessMaker\Http\Controllers\TemplateController; @@ -136,6 +137,11 @@ Route::post('/keep-alive', [LoginController::class, 'keepAlive'])->name('keep-alive'); // Cases Route::get('cases', [RequestController::class, 'index'])->name('cases.index')->middleware('no-cache'); + Route::get('cases-main', [CasesController::class, 'index'])->name('cases-main.index')->middleware('no-cache'); + + + + Route::get('cases/{type?}', [RequestController::class, 'index'])->name('cases_by_type') ->where('type', 'all|in_progress|completed') ->middleware('no-cache'); diff --git a/webpack.mix.js b/webpack.mix.js index 34d8ca2839..d525298ac9 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -121,6 +121,10 @@ mix .js("resources/js/requests/mobile.js", "public/js/requests/mobile.js") .js("resources/js/requests/show.js", "public/js/requests") .js("resources/js/requests/preview.js", "public/js/requests") + + + .js("resources/jscomposition/cases/casesMain/main.js", "public/js/composition/cases/casesMain/main.js") + .js("resources/js/processes/translations/import.js", "public/js/processes/translations") From 1f0759a0ca3a144cba9943e5ef7e0b443a2c95a0 Mon Sep 17 00:00:00 2001 From: Fabio Date: Thu, 12 Sep 2024 13:02:12 -0400 Subject: [PATCH 07/79] FOUR-18634: New view "cases" and Implement new UI tabs --- .../Http/Controllers/RequestController.php | 5 ++ resources/js/cases/components/CaseDetail.vue | 48 ++++++++++++++ resources/js/cases/components/Tabs.vue | 66 +++++++++++++++++++ resources/js/cases/edit.js | 8 +++ resources/views/cases/edit.blade.php | 25 +++++++ resources/views/layouts/layout.blade.php | 1 + 6 files changed, 153 insertions(+) create mode 100644 resources/js/cases/components/CaseDetail.vue create mode 100644 resources/js/cases/components/Tabs.vue create mode 100644 resources/js/cases/edit.js create mode 100644 resources/views/cases/edit.blade.php diff --git a/ProcessMaker/Http/Controllers/RequestController.php b/ProcessMaker/Http/Controllers/RequestController.php index b4924debc7..8deef44b5a 100644 --- a/ProcessMaker/Http/Controllers/RequestController.php +++ b/ProcessMaker/Http/Controllers/RequestController.php @@ -281,4 +281,9 @@ public function summaryScreenTranslation(ProcessRequest $request): void $request->summary_screen['config'] = $translatedConf; } } + + public function edit(ProcessRequest $request) + { + return view('cases.edit'); + } } diff --git a/resources/js/cases/components/CaseDetail.vue b/resources/js/cases/components/CaseDetail.vue new file mode 100644 index 0000000000..6135a8aeb5 --- /dev/null +++ b/resources/js/cases/components/CaseDetail.vue @@ -0,0 +1,48 @@ + + + diff --git a/resources/js/cases/components/Tabs.vue b/resources/js/cases/components/Tabs.vue new file mode 100644 index 0000000000..2a9f4f860b --- /dev/null +++ b/resources/js/cases/components/Tabs.vue @@ -0,0 +1,66 @@ + + + diff --git a/resources/js/cases/edit.js b/resources/js/cases/edit.js new file mode 100644 index 0000000000..c633a6cb01 --- /dev/null +++ b/resources/js/cases/edit.js @@ -0,0 +1,8 @@ +import Vue from "vue"; +import CaseDetail from "./components/CaseDetail.vue"; + +new Vue({ + el: "#case-detail", + components: { CaseDetail }, + data() {}, +}); diff --git a/resources/views/cases/edit.blade.php b/resources/views/cases/edit.blade.php new file mode 100644 index 0000000000..a89c2e3b46 --- /dev/null +++ b/resources/views/cases/edit.blade.php @@ -0,0 +1,25 @@ +@extends('layouts.layout') + +@section('title') + {{ __('Case Detail') }} +@endsection + +@section('sidebar') + @include('layouts.sidebar', ['sidebar' => Menu::get('sidebar_request')]) +@endsection + +@section('breadcrumbs') + @include('shared.breadcrumbs', ['routes' => [ + __('Cases') => route('cases.index'), + ]]) +@endsection + +@section('content') +
+ +
+@endsection + +@section('js') + +@endsection diff --git a/resources/views/layouts/layout.blade.php b/resources/views/layouts/layout.blade.php index 2fd4356d4c..301ddc5189 100644 --- a/resources/views/layouts/layout.blade.php +++ b/resources/views/layouts/layout.blade.php @@ -39,6 +39,7 @@ + @yield('css') \ No newline at end of file + diff --git a/resources/jscomposition/base/table/Pagination.vue b/resources/jscomposition/base/table/Pagination.vue index 9e2d350dba..e337041d4f 100644 --- a/resources/jscomposition/base/table/Pagination.vue +++ b/resources/jscomposition/base/table/Pagination.vue @@ -1,128 +1,81 @@ - \ No newline at end of file + diff --git a/resources/jscomposition/base/table/TCell.vue b/resources/jscomposition/base/table/TCell.vue index ebbcca8edf..e990f8d452 100644 --- a/resources/jscomposition/base/table/TCell.vue +++ b/resources/jscomposition/base/table/TCell.vue @@ -1,43 +1,46 @@ \ No newline at end of file + diff --git a/resources/jscomposition/base/table/THeader.vue b/resources/jscomposition/base/table/THeader.vue index e1faf00fb3..e7dee4d39e 100644 --- a/resources/jscomposition/base/table/THeader.vue +++ b/resources/jscomposition/base/table/THeader.vue @@ -1,55 +1,59 @@ \ No newline at end of file + diff --git a/resources/jscomposition/base/table/TRow.vue b/resources/jscomposition/base/table/TRow.vue index 1d700ef645..ad929a275a 100644 --- a/resources/jscomposition/base/table/TRow.vue +++ b/resources/jscomposition/base/table/TRow.vue @@ -1,14 +1,15 @@ \ No newline at end of file + diff --git a/resources/jscomposition/base/table/composables/columnComposable.js b/resources/jscomposition/base/table/composables/columnComposable.js index cae2353f02..2ce357f833 100644 --- a/resources/jscomposition/base/table/composables/columnComposable.js +++ b/resources/jscomposition/base/table/composables/columnComposable.js @@ -1,6 +1,4 @@ -import { - ref, onUnmounted -} from "vue"; +import { ref, onUnmounted } from "vue"; export default {}; /** @@ -16,12 +14,11 @@ export const columnResizeComposable = (column) => { //Resize the column value const doResize = (event) => { - if (isResizing.value) { const diff = event.pageX - startX.value; const min = 63; const currentWidth = Math.max(min, startWidth.value + diff); - + column.width = currentWidth; } }; @@ -38,8 +35,8 @@ export const columnResizeComposable = (column) => { const startResize = (event, index) => { isResizing.value = true; startX.value = event.pageX; - startWidth.value =column.width || 200; - + startWidth.value = column.width || 200; + document.addEventListener("mousemove", doResize); document.addEventListener("mouseup", stopResize); }; diff --git a/resources/jscomposition/base/table/index.js b/resources/jscomposition/base/table/index.js index 927748b7d0..6183b1cc26 100644 --- a/resources/jscomposition/base/table/index.js +++ b/resources/jscomposition/base/table/index.js @@ -4,12 +4,4 @@ import TCell from "./TCell.vue"; import THeader from "./THeader.vue"; import TRow from "./TRow.vue"; -export default {} - -export { - BaseTable, - Pagination, - TCell, - THeader, - TRow -} \ No newline at end of file +export { BaseTable, Pagination, TCell, THeader, TRow }; diff --git a/resources/jscomposition/base/ui/Badge.vue b/resources/jscomposition/base/ui/Badge.vue index 488d6be08a..f1f6c173b4 100644 --- a/resources/jscomposition/base/ui/Badge.vue +++ b/resources/jscomposition/base/ui/Badge.vue @@ -1,22 +1,24 @@ \ No newline at end of file + }, + setup() { + return {}; + }, +}); + diff --git a/resources/jscomposition/base/ui/index.js b/resources/jscomposition/base/ui/index.js index d62371ab35..0e62cb7097 100644 --- a/resources/jscomposition/base/ui/index.js +++ b/resources/jscomposition/base/ui/index.js @@ -1,7 +1,5 @@ -import Badge from "./Badge.vue" +import Badge from "./Badge.vue"; -export default {} +export default {}; -export { - Badge -} \ No newline at end of file +export { Badge }; diff --git a/resources/jscomposition/cases/casesMain/App.vue b/resources/jscomposition/cases/casesMain/App.vue index e5b412c4ed..fc6d013cb4 100644 --- a/resources/jscomposition/cases/casesMain/App.vue +++ b/resources/jscomposition/cases/casesMain/App.vue @@ -4,15 +4,15 @@ diff --git a/resources/jscomposition/cases/casesMain/CasesDataSection.vue b/resources/jscomposition/cases/casesMain/CasesDataSection.vue index ab6bc00201..ff7a733cc7 100644 --- a/resources/jscomposition/cases/casesMain/CasesDataSection.vue +++ b/resources/jscomposition/cases/casesMain/CasesDataSection.vue @@ -1,54 +1,54 @@ \ No newline at end of file + diff --git a/resources/jscomposition/cases/casesMain/CasesMain.vue b/resources/jscomposition/cases/casesMain/CasesMain.vue index dd294634be..71e136cc11 100644 --- a/resources/jscomposition/cases/casesMain/CasesMain.vue +++ b/resources/jscomposition/cases/casesMain/CasesMain.vue @@ -1,49 +1,51 @@ \ No newline at end of file + diff --git a/resources/jscomposition/cases/casesMain/api/index.js b/resources/jscomposition/cases/casesMain/api/index.js index ca51c56e1b..b7cbc82bc6 100644 --- a/resources/jscomposition/cases/casesMain/api/index.js +++ b/resources/jscomposition/cases/casesMain/api/index.js @@ -1,35 +1,35 @@ -export default {} +export default {}; // Method to get counters - change with processmaker API export const getCounters = async () => { const url = "http://localhost:3000/appcounters"; - return { - myCases: 36, - inProgress: 20, - completed: 125, - allCases: 145, - allRequests: 777 - } + return { + myCases: 36, + inProgress: 20, + completed: 125, + allCases: 145, + allRequests: 777, + }; }; // Method to get data case list - change with processmaker API export const getData = async () => { - let objects_list = [] + let objects_list = []; for (let i = 0; i <= 31; i++) { const obj = { - "caseNumber": `${i}`, - "caseTitle": `Case Title ${i}`, - "process": `Process ${i}`, - "task": `Task ${i}`, - "participants": `Avatar ${i}`, - "status": `badge ${i}`, - "started": `21/21/${i}`, - "completed": `22/22/${i}` + caseNumber: `${i}`, + caseTitle: `Case Title ${i}`, + process: `Process ${i}`, + task: `Task ${i}`, + participants: `Avatar ${i}`, + status: `badge ${i}`, + started: `21/21/${i}`, + completed: `22/22/${i}`, }; objects_list.push(obj); } return objects_list; -}; \ No newline at end of file +}; diff --git a/resources/jscomposition/cases/casesMain/components/AppCounters.vue b/resources/jscomposition/cases/casesMain/components/AppCounters.vue index 6c4bb421de..203bede000 100644 --- a/resources/jscomposition/cases/casesMain/components/AppCounters.vue +++ b/resources/jscomposition/cases/casesMain/components/AppCounters.vue @@ -1,8 +1,6 @@ \ No newline at end of file + setup() { + return {}; + }, +}); + diff --git a/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue b/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue index e2c2a493cb..af50e69d44 100644 --- a/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue +++ b/resources/jscomposition/cases/casesMain/components/BadgeContainer.vue @@ -1,23 +1,20 @@ \ No newline at end of file + components: { + Badge, + }, + props: {}, + setup() { + return {}; + }, +}); + diff --git a/resources/jscomposition/cases/casesMain/components/BadgesSection.vue b/resources/jscomposition/cases/casesMain/components/BadgesSection.vue index 1e50276c65..86065b6759 100644 --- a/resources/jscomposition/cases/casesMain/components/BadgesSection.vue +++ b/resources/jscomposition/cases/casesMain/components/BadgesSection.vue @@ -1,35 +1,36 @@ \ No newline at end of file + diff --git a/resources/jscomposition/cases/casesMain/components/CaseFilter.vue b/resources/jscomposition/cases/casesMain/components/CaseFilter.vue index 38c94e66e9..3d9e721653 100644 --- a/resources/jscomposition/cases/casesMain/components/CaseFilter.vue +++ b/resources/jscomposition/cases/casesMain/components/CaseFilter.vue @@ -1,22 +1,22 @@ \ No newline at end of file + components: { + OutlineButton, + InputLeading, + }, + setup() { + return {}; + }, +}); + diff --git a/resources/jscomposition/cases/casesMain/config/badges.js b/resources/jscomposition/cases/casesMain/config/badges.js index b36f828a65..d2832c87ba 100644 --- a/resources/jscomposition/cases/casesMain/config/badges.js +++ b/resources/jscomposition/cases/casesMain/config/badges.js @@ -1,16 +1,16 @@ export default {}; export const badges = [ - { - label: "Status : In progress" - }, - { - label: "Status : To do" - }, - { - label: "Status : New Badge" - }, - { - label: "Status : Badge Example" - } + { + label: "Status : In progress", + }, + { + label: "Status : To do", + }, + { + label: "Status : New Badge", + }, + { + label: "Status : Badge Example", + }, ]; diff --git a/resources/jscomposition/cases/casesMain/config/columns.js b/resources/jscomposition/cases/casesMain/config/columns.js index 4f6722f327..531f9b6a60 100644 --- a/resources/jscomposition/cases/casesMain/config/columns.js +++ b/resources/jscomposition/cases/casesMain/config/columns.js @@ -1,7 +1,7 @@ import BadgeContainer from "../components/BadgeContainer.vue"; import AvatarContainer from "../components/AvatarContainer.vue"; -export default {} +export default {}; /** * Example Column * field: String @@ -20,73 +20,71 @@ export default {} // AllCases : [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] // AllRequest : [Case#, Case Title, Process, Task, Participants, Status, Started, Completed] - -export const caseNumberColumn = ()=>({ +export const caseNumberColumn = () => ({ field: "caseNumber", headerName: "Case #", resizable: true, width: 200, -}) +}); -export const caseTitleColumn = ()=>({ +export const caseTitleColumn = () => ({ field: "caseTitle", headerName: "Case Title", resizable: true, width: 200, -}) +}); -export const processColumn = ()=>({ +export const processColumn = () => ({ field: "process", headerName: "Process", resizable: true, - width: 200 -}) + width: 200, +}); -export const taskColumn = ()=>({ +export const taskColumn = () => ({ field: "task", headerName: "Task", resizable: true, - width: 200 -}) - + width: 200, +}); -export const participantsColumn = ()=>({ +export const participantsColumn = () => ({ field: "participants", headerName: "Participants", resizable: true, width: 200, cellRenderer: () => { return AvatarContainer; - } -}) + }, +}); -export const statusColumn = ()=>({ +export const statusColumn = () => ({ field: "status", headerName: "Status", resizable: true, width: 200, cellRenderer: () => { return BadgeContainer; - } -}) + }, +}); -export const startedColumn = ()=>({ +export const startedColumn = () => ({ field: "started", headerName: "Started", resizable: true, - width: 200 -}) + width: 200, +}); -export const completedColumn = ()=>({ +export const completedColumn = () => ({ field: "completed", headerName: "Completed", resizable: true, - width: 200 -}) + width: 200, +}); export const getColumns = (type) => { const columnsDefinition = { - 'my-cases': [ + "my-cases": [ caseNumberColumn(), caseTitleColumn(), processColumn(), @@ -94,18 +92,18 @@ export const getColumns = (type) => { participantsColumn(), statusColumn(), startedColumn(), - completedColumn() + completedColumn(), ], - 'in-progress': [ + "in-progress": [ caseNumberColumn(), caseTitleColumn(), processColumn(), taskColumn(), participantsColumn(), statusColumn(), - startedColumn() + startedColumn(), ], - 'completed': [ + completed: [ caseNumberColumn(), caseTitleColumn(), processColumn(), @@ -113,9 +111,9 @@ export const getColumns = (type) => { participantsColumn(), statusColumn(), startedColumn(), - completedColumn() + completedColumn(), ], - 'all-cases': [ + "all-cases": [ caseNumberColumn(), caseTitleColumn(), processColumn(), @@ -123,10 +121,9 @@ export const getColumns = (type) => { participantsColumn(), statusColumn(), startedColumn(), - completedColumn() - ] - } + completedColumn(), + ], + }; return columnsDefinition[type] || columnsDefinition.myCases; -} - +}; diff --git a/resources/jscomposition/cases/casesMain/config/index.js b/resources/jscomposition/cases/casesMain/config/index.js index 5bc60f9ebc..963420fb99 100644 --- a/resources/jscomposition/cases/casesMain/config/index.js +++ b/resources/jscomposition/cases/casesMain/config/index.js @@ -1,2 +1,2 @@ -export * from './columns' -export * from './badges' +export * from "./columns"; +export * from "./badges"; diff --git a/resources/jscomposition/cases/casesMain/main.js b/resources/jscomposition/cases/casesMain/main.js index 8b4676c85a..97c89abc83 100644 --- a/resources/jscomposition/cases/casesMain/main.js +++ b/resources/jscomposition/cases/casesMain/main.js @@ -1,20 +1,19 @@ - -import App from './App.vue' -import { routes } from './routes'; +import App from "./App.vue"; +import { routes } from "./routes"; Vue.use(VueRouter); const router = new VueRouter({ mode: "history", base: "/", - routes + routes, }); new Vue({ - el: "#cases-main", - router, - components:{ - App - }, - render: (h) => h(App), -}) + el: "#cases-main", + router, + components: { + App, + }, + render: (h) => h(App), +}); diff --git a/resources/jscomposition/cases/casesMain/routes.js b/resources/jscomposition/cases/casesMain/routes.js index 2a8c3f028b..e21e05406e 100644 --- a/resources/jscomposition/cases/casesMain/routes.js +++ b/resources/jscomposition/cases/casesMain/routes.js @@ -1,28 +1,27 @@ -import CasesMain from "./CasesMain.vue" -import CasesDataSection from "./CasesDataSection.vue" +import CasesMain from "./CasesMain.vue"; +import CasesDataSection from "./CasesDataSection.vue"; -export default {} +export default {}; export const routes = [ - { - name: "cases", - path: "/cases-main", - component: CasesMain, + { + name: "cases", + path: "/cases-main", + component: CasesMain, + props(route) { + return {}; + }, + children: [ + { + name: "cases-request", + path: ":id?", + component: CasesDataSection, props(route) { - return {}; + return { + listId: route.params?.id || "my-cases", + }; }, - children:[ - { - name: "cases-request", - path: ":id?", - component: CasesDataSection, - props(route) { - return { - listId: route.params?.id || 'my-cases', - }; - } - } - ] - - } -] \ No newline at end of file + }, + ], + }, +]; diff --git a/resources/jscomposition/cases/casesMain/utils/counters.js b/resources/jscomposition/cases/casesMain/utils/counters.js index 63c26b053c..2ce87946f8 100644 --- a/resources/jscomposition/cases/casesMain/utils/counters.js +++ b/resources/jscomposition/cases/casesMain/utils/counters.js @@ -1,45 +1,46 @@ -export default {} +export default {}; +import { t } from "i18next"; -export const formatCounters = (data)=>{ - const counters = [ - { - header: "My cases", - body:data.myCases.toString(), - color:"amber", - icon:"fa-regular fa-user", - url:'/cases-main/my-cases' - }, - { - header: "In progress", - body:data.inProgress.toString(), - color:"green", - icon:"fa-solid fa-list", - url:'/cases-main/in-progress' - }, - { - header: "Completed", - body:data.completed.toString(), - color:"blue", - icon:"fa-regular fa-circle-check", - url:'/cases-main/completed' - }, - { - header: "All cases", - body:data.allCases.toString(), - color:"purple", - icon:"fa-regular fa-clipboard", - url:'/cases-main/all-cases' - }, - { - header: "All requests", - body:data.allRequests.toString(), - color:"gray", - icon:"fa-solid fa-play", - url:()=>{ - window.location.href = "/cases" - } - } - ] - - return counters -} +export const formatCounters = (data) => { + const counters = [ + { + header: t("My cases"), + body: data.myCases.toString(), + color: "amber", + icon: "fa-regular fa-user", + url: "/cases-main/my-cases", + }, + { + header: t("In progress"), + body: data.inProgress.toString(), + color: "green", + icon: "fa-solid fa-list", + url: "/cases-main/in-progress", + }, + { + header: t("Completed"), + body: data.completed.toString(), + color: "blue", + icon: "fa-regular fa-circle-check", + url: "/cases-main/completed", + }, + { + header: t("All cases"), + body: data.allCases.toString(), + color: "purple", + icon: "fa-regular fa-clipboard", + url: "/cases-main/all-cases", + }, + { + header: t("All requests"), + body: data.allRequests.toString(), + color: "gray", + icon: "fa-solid fa-play", + url: () => { + window.location.href = "/cases"; + }, + }, + ]; + + return counters; +}; diff --git a/resources/jscomposition/cases/casesMain/utils/index.js b/resources/jscomposition/cases/casesMain/utils/index.js index 069f2719f6..d6a4a113d4 100644 --- a/resources/jscomposition/cases/casesMain/utils/index.js +++ b/resources/jscomposition/cases/casesMain/utils/index.js @@ -1 +1 @@ -export * from './counters' \ No newline at end of file +export * from "./counters"; diff --git a/resources/jscomposition/system/Breadcrums.vue b/resources/jscomposition/system/Breadcrums.vue index 0c41c4d43a..a302a27c55 100644 --- a/resources/jscomposition/system/Breadcrums.vue +++ b/resources/jscomposition/system/Breadcrums.vue @@ -11,28 +11,36 @@
  • -
    • - \ No newline at end of file + diff --git a/resources/jscomposition/system/index.js b/resources/jscomposition/system/index.js index 87a413c41b..02e0d67feb 100644 --- a/resources/jscomposition/system/index.js +++ b/resources/jscomposition/system/index.js @@ -1,7 +1,5 @@ import Breadcrums from "./Breadcrums.vue"; -export default {} +export default {}; -export { - Breadcrums -} \ No newline at end of file +export { Breadcrums }; diff --git a/routes/web.php b/routes/web.php index 2fa719a5f2..e41cd225e4 100644 --- a/routes/web.php +++ b/routes/web.php @@ -138,10 +138,6 @@ // Cases Route::get('cases', [RequestController::class, 'index'])->name('cases.index')->middleware('no-cache'); Route::get('cases-main', [CasesController::class, 'index'])->name('cases-main.index')->middleware('no-cache'); - - - - Route::get('cases/{type?}', [RequestController::class, 'index'])->name('cases_by_type') ->where('type', 'all|in_progress|completed') ->middleware('no-cache'); diff --git a/webpack.mix.js b/webpack.mix.js index d525298ac9..e26379255a 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -121,11 +121,7 @@ mix .js("resources/js/requests/mobile.js", "public/js/requests/mobile.js") .js("resources/js/requests/show.js", "public/js/requests") .js("resources/js/requests/preview.js", "public/js/requests") - - .js("resources/jscomposition/cases/casesMain/main.js", "public/js/composition/cases/casesMain/main.js") - - .js("resources/js/processes/translations/import.js", "public/js/processes/translations") .js("resources/js/processes-catalogue/index.js", "public/js/processes-catalogue/index.js") From 90f4a957456f737689313eca4da3633987d1c591 Mon Sep 17 00:00:00 2001 From: Henry Jonas Date: Thu, 12 Sep 2024 13:15:03 -0400 Subject: [PATCH 09/79] FOUR-19004: Create a NEW VIEW for cases Part Counters --- resources/jscomposition/base/buttons/index.js | 4 +- resources/jscomposition/base/cards/index.js | 6 +- .../jscomposition/base/form/Dropdown.vue | 92 +++++++++++-------- .../jscomposition/base/table/Pagination.vue | 7 +- .../jscomposition/base/table/TFooter.vue | 16 ---- resources/jscomposition/base/table/index.js | 2 + routes/web.php | 1 + 7 files changed, 64 insertions(+), 64 deletions(-) delete mode 100644 resources/jscomposition/base/table/TFooter.vue diff --git a/resources/jscomposition/base/buttons/index.js b/resources/jscomposition/base/buttons/index.js index 5a6c8fc3a0..a86eca3ca3 100644 --- a/resources/jscomposition/base/buttons/index.js +++ b/resources/jscomposition/base/buttons/index.js @@ -1,5 +1,3 @@ import OutlineButton from "./OutlineButton.vue"; -export { - OutlineButton -} \ No newline at end of file +export { OutlineButton }; diff --git a/resources/jscomposition/base/cards/index.js b/resources/jscomposition/base/cards/index.js index c8901f3cd2..e14a1b5958 100644 --- a/resources/jscomposition/base/cards/index.js +++ b/resources/jscomposition/base/cards/index.js @@ -1,5 +1,3 @@ -import ThreeSectionCard from "./ThreeSectionCard.vue" +import ThreeSectionCard from "./ThreeSectionCard.vue"; -export { - ThreeSectionCard -} \ No newline at end of file +export { ThreeSectionCard }; diff --git a/resources/jscomposition/base/form/Dropdown.vue b/resources/jscomposition/base/form/Dropdown.vue index cbf7e11ebb..d203f60b34 100644 --- a/resources/jscomposition/base/form/Dropdown.vue +++ b/resources/jscomposition/base/form/Dropdown.vue @@ -1,16 +1,15 @@