Untitled

 avatar
unknown
plain_text
a year ago
6.9 kB
5
Indexable
correct the code for date formatting


import React, { useState, useEffect } from 'react';
import { withPage, Lift } from '@d-lift/core';
import BodySection from '@/Layout/BodySection';
import webService from '@/Services/WebService';
import Questions from './Components/Questions';
import { Button, Label, Column, Page, Header, Row, Para } from '@d-lift/uxcomponents';
import './response.scss';

const RFIResponse = () => {
    const [responseData, setResponseData] = useState([]);

    useEffect(() => {
        loadResponseData();
    }, []);

    const loadResponseData = async () => {
        try {
            Lift.spinner.show();
            const data = [
                {
                    id: 0,
                    questionsList: [
                        {
                            rfiId: 0,
                            id: 0,
                            question: 'What is the airspeed velocity of an unladen swallow?',
                            description: 'string',
                            answers: [
                                {
                                    id: 0,
                                    quesnId: 0,
                                    answer: 'Although the story takes place in Europe, it is almost certainly a reference to the bit about the coconuts. Almost no data recorded actually indicates the airspeed of either type of African swallow. Rather than make blind guesses about the African swallow, it may be better to look into the capabilities of the European, or barn, swallow, for which extensive study data exists.',
                                    respondDt: '2024-06-06T05:46:37.758Z',
                                    state: 'IOWA',
                                },
                                {
                                    id: 1,
                                    quesnId: 1,
                                    answer: '12 km/hr',
                                    respondDt: '2024-06-06T05:46:37.758Z',
                                    state: 'Massachusetts',
                                },
                            ],
                        },
                    ],
                    title: 'string',
                    description: 'string',
                    reqDT: '2024-06-06T05:46:37.758Z',
                    state: 'string',
                    programs: 'string',
                    category: 'string',
                    status: 'string',
                    dueDT: '2024-06-06',
                    pocId: 0,
                    offering: 'string',
                },
            ];

            // const data = await webService.getFullDetails();
            if (data) {
                const respondDt = new Date(data.questionsList.answers.respondDt);
                const formattedRespondDt = respondDt.toISOString().split('T');

                const updatedData = {
                    ...data,
                    respondDt: formattedRespondDt,
                };

                setResponseData(updatedData);
                Lift.Application.Notification.success('Response Data loaded successfully');
            }
        } catch (error) {
            console.log(error);
            Lift.Application.Notification.error('Failed to load Response Data');
        } finally {
            Lift.spinner.hide();
        }
    };

    return (
        <Page>
            <BodySection>
                <div className="ux-rfi-grey-border w-100 mt-3">
                    <Header
                        className="pt-3 ux-rfi-font-header"
                        size="2"
                        labelKey="RFI_Title"></Header>
                    <Row>
                        <Column className="col-9">
                            <Row className="d-flex flex-wrap">
                                <Para
                                    labelKey="very_much_longer"
                                    className="mr-2 mt-2 p-1 ml-3 ux-rfi-label-normal ux-rfi-green-label"></Para>
                                <Para
                                    labelKey="selection_1"
                                    className="ux-rfi-green-label mt-2 mr-2 p-1 ux-rfi-label-normal"></Para>
                                <Para
                                    labelKey="selection_1"
                                    className="ux-rfi-green-label mt-2 mr-2 p-1 ux-rfi-label-normal"></Para>
                                <Para
                                    labelKey="selection_1"
                                    className="ux-rfi-green-label mt-2 mr-2 p-1 ux-rfi-label-normal"></Para>
                                <Para
                                    labelKey="selection_1"
                                    className="ux-rfi-green-label mt-2 p-1 ux-rfi-label-normal"></Para>
                            </Row>
                        </Column>

                        <Column>
                            <div className="ux-rfi-grey-border">
                                <Label
                                    labelKey="requested_by"
                                    className="mt-1 ux-rfi-label-normal ux-rfi-grey-font"></Label>
                                <Para labelKey="massachusetts" className="ux-rfi-bold"></Para>

                                <Label
                                    labelKey="due"
                                    className="mt-1 ux-rfi-label-normal ux-rfi-grey-font"></Label>
                                <Para labelKey="nov_15" className="ux-rfi-bold"></Para>

                                <Label
                                    labelKey="responses"
                                    className="mt-1 ux-rfi-label-normal ux-rfi-grey-font"></Label>
                                <Para labelKey="18_of_30" className="ux-rfi-bold"></Para>

                                <div className="m-0 p-1">
                                    <Button
                                        id="summarizeBtn"
                                        size="small"
                                        className="ux-rfi-green-button"
                                        // click={}
                                        labelKey="summarize_btn"></Button>
                                </div>
                            </div>
                        </Column>
                    </Row>
                </div>

                <div className="ux-rfi-grey-border w-100 mt-3">
                    <Para labelKey="content" className="mt-2 scrollable-content"></Para>
                </div>

                <Questions responseData={responseData}></Questions>
            </BodySection>
        </Page>
    );
};

export default withPage(
    {
        Description: 'Respond to an RFI page',
        ContentManager: true,
        LayoutStyle: 'rfi-dashboard',
    },
    RFIResponse,
);
Editor is loading...
Leave a Comment