frontend dev

Frontend/admin/src/components/side-navigation.jsx

@@ -19,10 +19,10 @@ function SideNavigation() {
           Movie Analysis
         </div>
       </NavLink>
-      <NavLink to="/home/actor-type-analysis" className="side-nav-link">
+      <NavLink to="/home/actor-marketing-analysis" className="side-nav-link">
         <div className="side-nav-link-wrapper">
           <MovieOutlinedIcon sx={{ marginRight: "15px" }} />
-          Actor & Type Analysis
+          Actor & Marketing Analysis
         </div>
       </NavLink>
       <NavLink to="/home/pose-identify" className="side-nav-link">

Frontend/admin/src/css/actor-marketing-analysis.css

+.actor-marketing-container {
+  height: 88vh;
+  width: 79.5%;
+  margin-left: auto;
+  margin-right: 0;
+  /* background-color: yellowgreen; */
+}
+.actor-marketing-title {
+  padding-top: 1%;
+  font-size: 23px;
+  font-weight: 500;
+  font-family: system-ui;
+}
+.actor-marketing-input-container {
+  padding-top: 3%;
+}
\ No newline at end of file

Frontend/admin/src/pages/actor-marketing-analysis.jsx

+import React from "react";
+import "../css/actor-marketing-analysis.css";
+import Box from "@mui/material/Box";
+import TextField from "@mui/material/TextField";
+import InputLabel from "@mui/material/InputLabel";
+import MenuItem from "@mui/material/MenuItem";
+import FormControl from "@mui/material/FormControl";
+import Select from "@mui/material/Select";
+
+export default function ActorMarketingAnalysis() {
+  return (
+    <div className="actor-marketing-container">
+      <div className="actor-marketing-title">
+        Actor & Film Marketing Analysis
+      </div>
+      <div className="actor-marketing-input-container">
+        <Box
+          component="form"
+          sx={{
+            "& .MuiTextField-root": { m: 1, width: "31%" },
+          }}
+          noValidate
+          autoComplete="off"
+        >
+          <div>
+            <TextField label="Film Trail Name" color="secondary" required />
+            <TextField label="Film Director Name" color="secondary" required />
+            <TextField label="Film Director Email" color="secondary" required />
+          </div>
+        </Box>
+        <Box
+          component="form"
+          sx={{
+            "& .MuiTextField-root": { m: 1, width: "47.2%" },
+          }}
+          noValidate
+          autoComplete="off"
+        >
+          <div>
+            <FormControl sx={{ m: 1, width: "47.2%" }}>
+              <InputLabel color="secondary">Film Analysis Type</InputLabel>
+              <Select
+                color="secondary"
+                // value={age}
+                label="Film Analysis Type"
+                // onChange={handleChange}
+                required
+              >
+                <MenuItem value={"AAO"}>Actor Analysis Only</MenuItem>
+                <MenuItem value={"FMAO"}>Film Marketing Analysis Only</MenuItem>
+                <MenuItem value={"AFMA"}>
+                  Actor & Film Marketing Analysis
+                </MenuItem>
+              </Select>
+            </FormControl>
+            <TextField
+              label="Film Director Name"
+              color="secondary"
+              type="file"
+              InputLabelProps={{
+                shrink: true,
+              }}
+            />
+          </div>
+        </Box>
+      </div>
+    </div>
+  );
+}

Frontend/admin/src/pages/actor-type-analysis.jsx

-import React from 'react'
-
-export default function ActorTypeAnalysis() {
-  return (
-    <div>Actor-type-analysis</div>
-  )
-}

Frontend/admin/src/routes/routes.js

@@ -8,7 +8,7 @@ import Contact from "../pages/contact";
 
 import Dashboard from "../pages/dashboard";
 import MovieAnalysis from "../pages/movie-analysis";
-import ActorTypeAnalysis from "../pages/actor-type-analysis";
+import ActorMarketingAnalysis from "../pages/actor-marketing-analysis";
 
 function PageRoutes() {
   return (
@@ -22,7 +22,10 @@ function PageRoutes() {
           <Route path="/home" element={<SubApp />}>
             <Route path="/home/dashboard" element={<Dashboard />} />
             <Route path="/home/movie-analysis" element={<MovieAnalysis />} />
-            <Route path="/home/actor-type-analysis" element={<ActorTypeAnalysis />} />
+            <Route
+              path="/home/actor-marketing-analysis"
+              element={<ActorMarketingAnalysis />}
+            />
           </Route>
           <Route path="/about" element={<Contact />} />
           <Route path="/contact" element={<About />} />