feat(layout): Add ticket creation details to header

ref: #1 nofusscomputing/centurion_erp#248 nofusscomputing/centurion_erp#307 nofusscomputing/centurion_erp#319
nofusscomputing · Oct 8, 2024 · 51ce469 · 51ce469
1 parent 2753a89
commit 51ce469
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 8 deletions.
diff --git a/src/App.js b/src/App.js
@@ -52,6 +52,14 @@ function App() {
                         loader = {detailsLoader}
                     />
 
+                    <Route path="/:module/:common_model/:model/:pk/:action"
+                        element={<ModelForm
+                            setContentHeading={setContentHeading}
+                        />}
+                        errorElement={<ErrorPage /> }
+                        loader = {detailsLoader}
+                    />
+
                     <Route path="/:module/:model"
                         element={<List
                             setContentHeading={setContentHeading}

diff --git a/src/index.css b/src/index.css
@@ -670,10 +670,15 @@ div.ticket .contents {
   width: 100%;
 }
 
+.ticket h3.description span.sub-script,
 .ticket .comment h4.comment #text span.sub-script {
   font-size: smaller;
 }
 
+.ticket h3.description span.sub-script {
+  color: #777;
+}
+
 .ticket .comment h4.comment #icons {
   border: none;
   display: inline-flexbox;

diff --git a/src/layout/ModelForm.jsx b/src/layout/ModelForm.jsx
@@ -45,8 +45,11 @@ const ModelForm = ({
 
         url = '/' + params.module + '/' + params.common_model + '/' + params.common_pk + '/' + params.model
 
+    }else if ( params.common_model && params.pk ) {
+
+        url = url = '/' + params.module + '/' + params.common_model + '/' + params.model + '/' + params.pk
     }
-    
+
     if( params.common_pk && params.pk && params.action === 'edit') {
 
         url = '/' + params.module + '/' + params.common_model + '/' + params.common_pk + '/' + params.model + '/' + params.pk

diff --git a/src/layout/Ticket.jsx b/src/layout/Ticket.jsx
@@ -1,16 +1,12 @@
 import { useEffect, useState } from "react";
-import { useLoaderData, useParams } from "react-router-dom";
+import { Link, useLoaderData, useParams } from "react-router-dom";
 import FieldData from "../functions/FieldData";
 
-import TicketStatusIcon from "../components/icons/ticket/TicketStatusIcon";
-import Badge from "../components/Badge";
-import { ResponseException } from "../classes/Exceptions";
 import TicketComments from "../components/page/ticket/Comments";
 import { apiFetch } from "../hooks/apiFetch";
 import TicketCommentForm from "../components/page/ticket/Comment";
 
 
-
 const Ticket = ({
     setContentHeading = null
 }) => {
@@ -89,12 +85,40 @@ const Ticket = ({
     return (
         metadata !== null && <div className="ticket">
 
-
             <div className="contents">
 
                 <section className="description">
-                    <h3 className={"description ticket-type-" + ticket_type}>ticket data </h3>
+                    <h3 className={"description ticket-type-" + ticket_type}>
+                        <span class="sub-script">opened by&nbsp;</span>
+                        <FieldData
+                            metadata={metadata}
+                            field_name='opened_by'
+                            data={page_data}
+                        />&nbsp;
+                        <span class="sub-script">on&nbsp;</span> 
+                        <FieldData
+                            metadata={metadata}
+                            field_name='created'
+                            data={page_data}
+                        />&nbsp;
+                        <span class="sub-script">Updated&nbsp;</span> 
+                        <FieldData
+                            metadata={metadata}
+                            field_name='modified'
+                            data={page_data}
+                        />
+                    </h3>
                     <div className="markdown">
+                        {/* <Button
+                            button_text = 'Edit'
+                            button_align = 'right'
+                            type='button'
+                            buttonClickCallback = {() => {
+                                console.log('button clicked')
+                            }}
+
+                        /> */}
+                        <Link to="edit"><button className="common-field form">Edit</button></Link>
                         <FieldData
                             metadata={metadata}
                             field_name='description'