วิธีใช้งาน

import { Computer } from "@mui/icons-material"
import { Box } from "@mui/material"
import { keyBy, mapValues, omitBy } from "lodash"
import React, { useState } from "react"
import { ReportUI, RUIDialogError } from "./index"

export default function ComputerForm() {
  const [isError, setIsError] = useState(false)
  const customFuncs = async (data) => {
    try {
      const dataFields = omitBy(mapValues(keyBy(data, "dataKey"), "value"), (value, key) => key === "header")
      console.log(dataFields)
      // const response = await axios.post("http://127.0.0.1/report/", dataFields, {
      //   responseType: "blob",
      // })

      // const blob = new Blob([response.data], { type: response.headers["content-type"] })

      // const fileName = `output.docx`
      // const link = document.createElement("a")
      // link.href = window.URL.createObjectURL(blob)
      // link.download = fileName
      // document.body.appendChild(link)
      // link.click()
      // document.body.removeChild(link)
    } catch (error) {
      setIsError(true)
      console.error("Error downloading file:", error)
    }
  }

  const fields = [
    { dataLabel: "ข้อมูลพยานหลักฐาน", type: "header", dataKey: "header", size: { xs: 12, sm: 12 } },
    { dataLabel: "ประเภทคอมพิวเตอร์", type: "text", dataKey: "typeOfComputer", dataPlaceHolder: "เครื่องคอมพิวเตอร์แบบตั้งโต๊ะ (เครื่องคอมพิวเตอร์แบบประกอบเอง)", size: { xs: 12, sm: 6 }, value: "" },
    { dataLabel: "Serial Number", type: "text", dataKey: "serialNo", dataPlaceHolder: "XXXXXXX", size: { xs: 12, sm: 6 }, value: "" },

    { dataLabel: "ยี่ห้อ", type: "text", dataKey: "brand", dataPlaceHolder: "ACER", size: { xs: 12, sm: 4 }, value: "" },
    { dataLabel: "รุ่น/โมเดล", type: "text", dataKey: "model", dataPlaceHolder: "PREDATER DESKTOP G9-591", size: { xs: 12, sm: 5 }, value: "" },
    { dataLabel: "สี", type: "text", dataKey: "color", dataPlaceHolder: "ดำ", size: { xs: 12, sm: 3 }, value: "" },

    { dataLabel: "เครื่องมือตรวจพิสูจน์ฯ", type: "header", dataKey: "header", size: { xs: 12, sm: 12 } },
    { dataLabel: "เครื่องมือตรวจพิสูจน์", type: "array", dataKey: "forensicTools", dataPlaceHolder: "เครื่องมือตรวจพิสูจน์ที่", size: { xs: 12, sm: 12 }, value: [] },

    { dataLabel: "พยานหลักฐาน", type: "header", dataKey: "header", size: { xs: 12, sm: 12 } },
    { dataLabel: "SIM", type: "array", dataKey: "sims", dataPlaceHolder: "SIM", size: { xs: 12, sm: 6 }, value: [] },
    {
      dataLabel: "พยานหลักฐาน",
      type: "multiple",
      dataKey: "evidence",
      dataPlaceHolder: "พยานหลักฐานลำดับที่",
      fields: [
        { dataLabel: "ยี่ห้อ", type: "text", dataKey: "brand", dataPlaceHolder: "ACER", size: { xs: 12, sm: 8 }, value: "" },
        { dataLabel: "IMEI", type: "text", dataKey: "imei", dataPlaceHolder: "XXXXXXXXXX", size: { xs: 12, sm: 4 }, value: "" },
        { dataLabel: "ประเภทค่า Hash", type: "dropdown", dataKey: "selectedHash", dataPlaceHolder: "กรุณาเลือกรูปแบบค่า Hash", size: { xs: 12, sm: 12 }, value: "SHA1", dataOptions: ["SHA1", "SHA256", "MD5"] },
      ],
      size: { xs: 12, sm: 6 },
      value: [],
    },
    { dataLabel: "CHECKBOX", type: "header", dataKey: "header", size: { xs: 12, sm: 12 } },
    { dataLabel: "สร้างค่า Hash", type: "checkbox", dataKey: "isHash", size: { xs: 12, sm: 4 }, value: false },
    { dataLabel: "ค่า HASH", type: "text", dataKey: "hashValue", dataPlaceHolder: "XXXXXXX", size: { xs: 12, sm: 4 }, value: "" },
    { dataLabel: "ประเภทค่า Hash", type: "dropdown", dataKey: "selectedHash", dataPlaceHolder: "กรุณาเลือกรูปแบบค่า Hash", size: { xs: 12, sm: 4 }, value: "SHA1", dataOptions: ["SHA1", "SHA256", "MD5"] },
  ]

  return (
    <Box sx={{ background: "#000" }}>
      <ReportUI icon={<Computer sx={{ color: "#fff", fontSize: "2rem" }} />} initialFields={fields} title="รายงานสำหรับคอมพิวเตอร์" label="สร้างรายงาน" handleSubmit={customFuncs} />
      <RUIDialogError open={isError} setOpen={setIsError} />
    </Box>
  )
}
Détail du package

report-ui-toolkit

readme

วิธีใช้งาน
