Получить данные в определенной c структуре с помощью GraphQL Query - PullRequest
0 голосов
/ 11 июля 2020

Я собираюсь работать над приложением React / Next. js и намереваюсь использовать GraphQL с клиентом Apollo.

У меня вопрос о том, как создать запрос GraphQL для возврата данных в специальная структура c. Я настроил fakeql , чтобы попробовать: https://fakeql.com/graphql/73feeb17d13b87f68431a3b6f57f2718

Для правильной работы данных в моем ReactApp мне нужно, чтобы они были структурированы определенным образом, и мне интересно, возможно ли с помощью GraphQL описать, как данные возвращается, опишите его структуру и просуммируйте определенные значения? Возможно, это невозможно.

Чтобы описать то, что я имею в виду, на примере, я хотел бы, чтобы он возвращал что-то вроде ... или что-то подобное

{
  "data": {
    "timelogs": [
      {
        "author": "joe.bloggs",
        "authorName": "Joe Bloggs",
        "timeSpentTotal": "10h 45m",
        "timeSpentSecondsTotal": 63000,
        "billableTimeSpentTotal": "8h 45m",
        "billableTimeSpentSecondsTotal": 43000,
        "billableTarget": 85,
        "daysPerWeek": 5,
        "details": [
          {
            "timeSpent": "1h 45m",
            "timeSpentSeconds": 6300,
            "activityCategory": "Billable",
            "projectCategory": "Support"
          },
          {
            "timeSpent": "30m",
            "timeSpentSeconds": 1800,
            "activityCategory": "Billable",
            "projectCategory": "Support"
          },
          {  
            "timeSpent": "2h 15m",
            "timeSpentSeconds": 8100,
            "activityCategory": "Billable",
            "projectCategory": "Support"
          },
          {
            "timeSpent": "5h",
            "timeSpentSeconds": 18000,
            "activityCategory": "Billable",
            "projectCategory": "New Build"
          }                  
        ]
      },
      {
        "author": "peter.pan",
        "authorName": "Peter Pan",
        "timeSpentTotal": "6h 45m",
        "timeSpentSecondsTotal": 9000,
        "billableTimeSpentTotal": "4h 45m",
        "billableTimeSpentSecondsTotal": 5000,
        "billableTarget": 20,
        "daysPerWeek": 3,        
        "details": [
          {
            "timeSpent": "15m",
            "timeSpentSeconds": 900,
            "activityCategory": "Billable",
            "projectCategory": "Support",
          },
          {
            "timeSpent": "30m",
            "timeSpentSeconds": 1800,
            "activityCategory": "R&D",
            "projectCategory": "Internal"
          },
          {
            "timeSpent": "2h 45m",
            "timeSpentSeconds": 9900,
            "activityCategory": "R&D",
            "projectCategory": "Internal"
          },          
        ]
      },
      {
        "author": "pipa.pen",
        "authorName": "Pipa Pen",
        "timeSpentTotal": "12h 45m",
        "timeSpentSecondsTotal": 83000,
        "billableTimeSpentTotal": "10h 45m",
        "billableTimeSpentSecondsTotal": 83000,
        "billableTarget": 85,
        "daysPerWeek": 5,
        "details": [
          {
            "timeSpent": "1h 30m",
            "timeSpentSeconds": 5400,
            "activityCategory": "Billable",
            "projectCategory": "New Build",
          },
          {
            "timeSpent": "15m",
            "timeSpentSeconds": 900,
            "activityCategory": "Billable",
            "projectCategory": "Support"
          },
          {
            "timeSpent": "6h 15m",
            "timeSpentSeconds": 22500,
            "activityCategory": "Billable",
            "projectCategory": "New Build"
          }
        ]
      }
    ]
  }
}

Но когда я делаю запрос GraphQL, например ...

{
  workers {
    key
    active
    billableTarget
    daysPerWeek
  }
  timelogs {
    author
    authorName
    timeSpent
    timeSpentSeconds
    activityCategory
    projectCategory
  }
}

Это возвращает ...

{
  "data": {
    "workers": [
      {
        "key": "alex.zane",
        "active": false,
        "billableTarget": 80,
        "daysPerWeek": 5
      },
      {
        "key": "pipa.pen",
        "active": true,
        "billableTarget": 25,
        "daysPerWeek": 5
      },
      {
        "key": "peter.pan",
        "active": true,
        "billableTarget": 20,
        "daysPerWeek": 3
      },
      {
        "key": "joe.bloggs",
        "active": true,
        "billableTarget": 85,
        "daysPerWeek": 5
      }
    ],
    "timelogs": [
      {
        "author": "joe.bloggs",
        "authorName": "Joe Bloggs",
        "timeSpent": "1h 45m",
        "timeSpentSeconds": 6300,
        "activityCategory": "Billable",
        "projectCategory": "Support"
      },
      {
        "author": "peter.pan",
        "authorName": "Peter Pan",
        "timeSpent": "15m",
        "timeSpentSeconds": 900,
        "activityCategory": "Billable",
        "projectCategory": "Support"
      },
      {
        "author": "pipa.pen",
        "authorName": "Pipa Pen",
        "timeSpent": "1h 30m",
        "timeSpentSeconds": 5400,
        "activityCategory": "Billable",
        "projectCategory": "New Build"
      },
      {
        "author": "pipa.pen",
        "authorName": "Pipa Pen",
        "timeSpent": "15m",
        "timeSpentSeconds": 900,
        "activityCategory": "Billable",
        "projectCategory": "Support"
      },
      {
        "author": "pipa.pen",
        "authorName": "Pipa Pen",
        "timeSpent": "6h 15m",
        "timeSpentSeconds": 22500,
        "activityCategory": "Billable",
        "projectCategory": "New Build"
      },
      {
        "author": "joe.bloggs",
        "authorName": "Joe Bloggs",
        "timeSpent": "30m",
        "timeSpentSeconds": 1800,
        "activityCategory": "Billable",
        "projectCategory": "Support"
      },
      {
        "author": "peter.pan",
        "authorName": "Peter Pan",
        "timeSpent": "30m",
        "timeSpentSeconds": 1800,
        "activityCategory": "R&D",
        "projectCategory": "Internal"
      },
      {
        "author": "peter.pan",
        "authorName": "Peter Pan",
        "timeSpent": "2h 45m",
        "timeSpentSeconds": 9900,
        "activityCategory": "R&D",
        "projectCategory": "Internal"
      },
      {
        "author": "joe.bloggs",
        "authorName": "Joe Bloggs",
        "timeSpent": "2h 15m",
        "timeSpentSeconds": 8100,
        "activityCategory": "Billable",
        "projectCategory": "Support"
      },
      {
        "author": "joe.bloggs",
        "authorName": "Joe Bloggs",
        "timeSpent": "5h",
        "timeSpentSeconds": 18000,
        "activityCategory": "Billable",
        "projectCategory": "New Build"
      }
    ]
  }
}

Вы можете понять, что я имею в виду, протестировав это на ... https://fakeql.com/graphql/73feeb17d13b87f68431a3b6f57f2718

После написания этого я думаю, маловероятно, что то, о чем я прошу, будет возможно, возможно, лучший подход - создать ящик в форме, которую я хочу, используя состояние моего реагирующего компонента на основе объекта, полученного от клиента Apollo.

...