wip

app/Infrastructure/Http/Requests/UserRequest.php

@@ -23,6 +23,7 @@ class UserRequest extends FormRequest
             "employmentForm" => ["required", new Enum(EmploymentForm::class)],
             "employmentDate" => ["required", "date_format:Y-m-d"],
             "birthday" => ["nullable", "date_format:Y-m-d"],
+            "slackId" => [],
         ];
     }
 
@@ -43,6 +44,7 @@ class UserRequest extends FormRequest
             "employment_form" => $this->get("employmentForm"),
             "employment_date" => $this->get("employmentDate"),
             "birthday" => $this->get("birthday"),
+            "slack_id" => $this->get("slackId"),
         ];
     }
 }

app/Infrastructure/Http/Resources/UserFormDataResource.php

@@ -22,6 +22,7 @@ class UserFormDataResource extends JsonResource
             "employmentForm" => $this->profile->employment_form,
             "employmentDate" => $this->profile->employment_date->toDateString(),
             "birthday" => $this->profile->birthday->toDateString(),
+            "slackId" => $this->profile->slack_id,
         ];
     }
 }

resources/js/Pages/Users/Create.vue

@@ -234,6 +234,29 @@
           </p>
         </div>
       </div>
+      <div class="items-center py-4 sm:grid sm:grid-cols-3">
+        <label
+          for="slackId"
+          class="block text-sm font-medium text-gray-700 sm:mt-px"
+        >
+          Slack ID
+        </label>
+        <div class="mt-1 sm:col-span-2 sm:mt-0">
+          <input
+            id="position"
+            v-model="form.slackId"
+            type="text"
+            class="block w-full max-w-lg rounded-md shadow-sm sm:text-sm"
+            :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.slackId, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.slackId }"
+          >
+          <p
+            v-if="form.errors.slackId"
+            class="mt-2 text-sm text-red-600"
+          >
+            {{ form.errors.slackId }}
+          </p>
+        </div>
+      </div>
       <div class="items-center py-4 sm:grid sm:grid-cols-3">
         <label
           for="birthday"
@@ -298,6 +321,7 @@ const form = useForm({
   position: null,
   employmentDate: null,
   birthday: null,
+  slackId: null,
 })
 
 function createUser() {

resources/js/Pages/Users/Edit.vue

@@ -264,6 +264,29 @@
           </p>
         </div>
       </div>
+      <div class="items-center py-4 sm:grid sm:grid-cols-3">
+        <label
+          for="slackId"
+          class="block text-sm font-medium text-gray-700 sm:mt-px"
+        >
+          Slack ID
+        </label>
+        <div class="mt-1 sm:col-span-2 sm:mt-0">
+          <input
+            id="position"
+            v-model="form.slackId"
+            type="text"
+            class="block w-full max-w-lg rounded-md shadow-sm sm:text-sm"
+            :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.slackId, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.slackId }"
+          >
+          <p
+            v-if="form.errors.slackId"
+            class="mt-2 text-sm text-red-600"
+          >
+            {{ form.errors.slackId }}
+          </p>
+        </div>
+      </div>
       <div class="flex justify-end py-3">
         <div class="space-x-3">
           <InertiaLink
@@ -306,6 +329,7 @@ const form = useForm({
   employmentForm: props.employmentForms.find(form => form.value === props.user.employmentForm),
   employmentDate: props.user.employmentDate,
   birthday: props.user.birthday,
+  slackId: props.user.slackId,
 })
 
 function editUser() {