Removed duplicate date field

Added link handling
Added state and status to form
2021-01-14 00:11:35 -05:00 · 2021-01-14 00:10:31 -05:00 · 2021-01-14 00:10:18 -05:00 · 2021-01-14 00:10:01 -05:00 · 2021-01-14 00:09:40 -05:00 · 2021-01-14 00:09:21 -05:00
9 changed files with 101 additions and 51 deletions
--- a/README.md
+++ b/README.md
@ -25,3 +25,4 @@ npm run build

 The development server will start on `http://localhost:3000`

+Get css docs here https://materializecss.com/
--- a/public/index.html
+++ b/public/index.html
@ -3,6 +3,7 @@

 <head>
  <meta charset="utf-8" />
+  <link rel="stylesheet" href="main.css">
  <link rel="icon"
    href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14/svgs/solid/book.svg" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
--- a/public/main.css
+++ b/public/main.css
@ -0,0 +1,16 @@
+a.white-link:link {
+    color: azure;
+    font-size: large;
+}
+a.white-link:hover {
+    color: azure;
+    font-size: large;
+}
+a.white-link:visited {
+    color: azure;
+    font-size: large;
+}
+a.white-link:active {
+    color: azure;
+    font-size: large;
+}
--- a/src/components/actions/Msgbox.js
+++ b/src/components/actions/Msgbox.js
@ -0,0 +1,20 @@
+import React from "react";
+// // Generic Msgbox
+
+function Msgbox(props) {
+    return <div>
+        <div className="card-panel grey darken-1">
+      <div className="card-content white-link">
+        <center>
+          <span className="card-title">
+            { props.error ? <span> { "Unable to update: " + props.error } </span> : null }
+            { props.msg ? <span className="white-text">{ "Updated migration details for: " + props.msg }</span> : null }
+            { props.linkid ? <a href={ "https://devui.benjamyn.love/migrations/" +  props.linkid } className="white-link">{"https://devui.benjamyn.love/migrations/" +  props.linkid }</a> : null }
+        </span>
+        </center>
+      </div>
+    </div>
+    </div>;
+  }
+
+export default Msgbox;
--- a/src/components/root/Home.js
+++ b/src/components/root/Home.js
@ -22,7 +22,7 @@ export class Home extends Component {

  componentDidMount() {
    callAPI
-      .get('/')
+      .get("/")
      .then((request) => {
        this.setState({
          migs: request.data,
@ -37,7 +37,6 @@ export class Home extends Component {

  render() {
    return (
-      <div className="container">
      <div className="row">
        <div className="divider"></div>

@ -58,7 +57,6 @@ export class Home extends Component {
          <div className="divider"></div>
        </div>
      </div>
-      </div>
    );
  }
 }
--- a/src/components/root/Pages/Historical.js
+++ b/src/components/root/Pages/Historical.js
@ -18,20 +18,7 @@ class Historical extends Component {
      error: false,
    };
  }
-  componentDidMount() {
-    callAPI
-      .get("/all")
-      .then((request) => {
-        this.setState({
-          migs: request.data,
-        });
-      })
-      .catch((error) => {
-        this.setState({
-          error: true,
-        });
-      });
-  }
+
  renderItems() {
    if (!this.props.error) {
      return <HistoricalSingle data={this.state.sidemigs} />;
--- a/src/components/root/common/Forms/CPanelBooking.js
+++ b/src/components/root/common/Forms/CPanelBooking.js
@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState } from "react";
 import "bootstrap/dist/css/bootstrap.min.css";
 import moment from "moment";
 import { Col, FormGroup, Row, Container, Label } from "reactstrap";
@ -6,6 +6,7 @@ import { Formik, Form, Field } from "formik";
 import * as Yup from "yup";
 import { Input, Submit } from "formstrap";
 import { callAPI } from "../../../actions/API";
+import Msgbox from "../../../actions/Msgbox";
 // import FormikFieldDateTimePicker from "./FormikFieldDateTimePicker";

 // Main form and POST Request to add migrations
@ -23,6 +24,8 @@ const timezoneList = {
 };
 const timezone = timezoneList.melbourne;

+
+
 const InputValidation = Yup.object().shape({
  domain: Yup.string()
    .matches(
@ -46,6 +49,9 @@ const InputValidation = Yup.object().shape({
 });

 export const CPanelBooking = () => {
+  const [respID, setRespID] = useState(0)
+  const [error, setError] = useState(0)
+
  const initialValues = {
    submit_time: moment().format("YYYY-MM-DD"),
    dateTime: "2019-03-11T12:00:00.000Z",
@ -57,9 +63,11 @@ export const CPanelBooking = () => {
      .then(function (response) {
        console.log(response.data.id);
        // add function here
+        setRespID(response.data.id)
      })
      .catch(function (error) {
        console.log(error);
+        setError(error)
      });
    setSubmitting(false);
    resetForm({ values: "" });
@ -227,6 +235,8 @@ export const CPanelBooking = () => {
            </FormGroup>
            <Submit withSpinner>Submit</Submit>
          </Container>
+            { respID ?  <Msgbox linkid={respID}></Msgbox> : null }
+            { error ?  <Msgbox error={error}></Msgbox> : null }
        </Form>
      )}
    </Formik>
--- a/src/components/root/common/Forms/ReportSingleMigration.js
+++ b/src/components/root/common/Forms/ReportSingleMigration.js
@ -1,15 +1,20 @@
-import React from "react";
+import React, { useState } from "react";
 import "bootstrap/dist/css/bootstrap.min.css";
 import { Col, FormGroup, Row, Container, Label } from "reactstrap";
 import { Formik, Form } from "formik";
 import { Input, Submit } from "formstrap";
 import { callAPI } from "../../../actions/API";
+import Msgbox from "../../../actions/Msgbox";

 // Main form element for the UUID linking Migrations page,
 // Contians the PUT request to modify data from the API

 const ReportSingleMigration = ({ item }) => {
+  const [respID, setRespID] = useState(0);
+  const [error, setError] = useState(0);
+
  const initialValues = {
+    migration_status: item.migration_status,
    submit_time: item.submit_time,
    domain: item.domain,
    booked_date: item.booked_date,
@ -31,9 +36,11 @@ const ReportSingleMigration = ({ item }) => {
      .put(`/${item.id}/`, values)
      .then(function (response) {
        console.log(JSON.stringify(response.values));
+        setRespID(response.data.ticket_id);
      })
      .catch(function (error) {
        console.log(error);
+        setError(error);
      });
    setSubmitting(false);
  };
@ -44,16 +51,21 @@ const ReportSingleMigration = ({ item }) => {
          <Row>
            <Col>
              <FormGroup>
-                <Label for={item.booked_date}>Date</Label>
+                <Label for={item.migration_status}>Status</Label>
                <Input
-                  type="date"
-                  name="booked_date"
-                  id="booked_date"
-                  placeholder="date placeholder"
-                  mindate={Date()}
-                />
+                  type="select"
+                  name="migration_status"
+                  id="migration_status"
+                >
+                  <option>Status</option>
+                  <option>Booked</option>
+                  <option>Waiting Termination</option>
+                  <option>Complete</option>
+                  <option>Cancelled</option>
+                </Input>
              </FormGroup>
            </Col>
+
            <Col>
              <FormGroup>
                <Label for="bookedTime">Timeslot</Label>
@ -205,6 +217,8 @@ const ReportSingleMigration = ({ item }) => {
          </FormGroup>
          <Submit withSpinner>Update</Submit>
        </Container>
+        {respID ? <Msgbox msg={respID}></Msgbox> : null}
+        {error ? <Msgbox error={error}></Msgbox> : null}
      </Form>
    </Formik>
  );
--- a/src/components/root/common/Tables/HistoricalSingle.js
+++ b/src/components/root/common/Tables/HistoricalSingle.js
@ -15,6 +15,7 @@ import ToolkitProvider, {
 const HistoricalSingle = () => {
  const [list, setList] = useState([]);
  const [loading, setLoading] = useState(false);
+  const [ticURl, setURL] = useState(null)
  const { SearchBar } = Search;
  const { ExportCSVButton } = CSVExport;
  const sizePerPageRenderer = ({
@ -45,6 +46,11 @@ const HistoricalSingle = () => {
      console.log(data);
      setList(data.data);
      setLoading(true);
+      // Determine brand and set URL based on brand
+      console.log(data.data.brand)
+      if (data.data.brand === "VentraIP" ) {
+        console.log("memes")
+      }
    } catch (e) {
      console.log(e);
    }
@ -78,6 +84,7 @@ const HistoricalSingle = () => {
    ],
    sizePerPageRenderer, // A numeric array is also available. the purpose of above example is custom the text
  };
+
  const columns = [
    { dataField: "id", text: "ID", hidden: true },
    { dataField: "brand", text: "Brand", sort: true },
@ -89,8 +96,9 @@ const HistoricalSingle = () => {
      formatter: (cell, row) => (
        <a
          href={
-            "https://helpdesk.ventraip.com.au/profiles/ticket/" + row.ticket_id
+            row.brand === "VentraIP" ? "https://helpdesk.ventraip.com.au/profiles/ticket/" + row.ticket_id : null
          }
+          target="_blank"
        >
          {" "}
          {cell}{" "}
@ -98,7 +106,7 @@ const HistoricalSingle = () => {
      ),
    },
    { dataField: "booked_date", text: "Booked Date", sort: true },
-    { dataField: "booked_time", text: "Booked Time", sort: true },
+    // { dataField: "booked_time", text: "Booked Time", sort: true },
    { dataField: "agent_booked", text: "Agent initials", sort: true },
    {
      dataField: "domain",
@ -112,14 +120,9 @@ const HistoricalSingle = () => {
    { dataField: "original_server", text: "Original Server", sort: true },
    { dataField: "new_server", text: "New Server", sort: true },
    { dataField: "migration_status", text: "Status", sort: true },
-    { dataField: "term_date", text: "Termination Date", sort: true },
+    // { dataField: "term_date", text: "Termination Date", sort: true },
    { dataField: "notes", text: "Notes", sort: true },
-    { dataField: "submit_time", text: "Submit Time", sort: true },
-    {
-      dataField: "report",
-      text: "Show Detailed Report",
-      formatter: (cell, row) => <a href={cell + row.id}> {cell} </a>,
-    },
+    // { dataField: "submit_time", text: "Submit Time", sort: true },
  ];

  useEffect(() => {
Author	SHA1	Message	Date
pepper	5cc1830e2b	Removed duplicate date field	2021-01-14 00:11:35 -05:00
pepper	964e863089	Added link handling	2021-01-14 00:10:31 -05:00
pepper	58eade2464	Added state and status to form	2021-01-14 00:10:18 -05:00
pepper	64f0eaa05a	Removed something @cam	2021-01-14 00:10:01 -05:00
pepper	a44dd8df10	Added state to booking page for msgbox	2021-01-14 00:09:40 -05:00
pepper	eb82d0873b	Added base messagebox	2021-01-14 00:09:21 -05:00
pepper	d3fd463a15	Added main.css and white-link class	2021-01-14 00:08:59 -05:00
pepper	454d40a96b	Added docs link	2021-01-14 00:08:39 -05:00