._.

src/pages/Cities.jsx

@@ -16,6 +16,8 @@ const Cities = () => {
   const [newCity, setNewCity] = useState({
     name: "",
     federal_district_id: "",
+    x_coordinate: "",
+    y_coordinate: "",
   });
   const [editingCityId, setEditingCityId] = useState(null);
   const [error, setError] = useState(null);
@@ -53,7 +55,12 @@ const Cities = () => {
   const handleSubmit = async (e) => {
     e.preventDefault();
 
-    if (!newCity.name || !newCity.federal_district_id) {
+    if (
+      !newCity.name ||
+      !newCity.federal_district_id ||
+      !newCity.x_coordinate ||
+      !newCity.y_coordinate
+    ) {
       setError("Пожалуйста, заполните все поля.");
       return;
     }
@@ -76,6 +83,8 @@ const Cities = () => {
       name: city.name,
       federal_district_id: city.federal_district_id,
       federal_district_name: city.federal_district_name,
+      x_coordinate: city.x_coordinate,
+      y_coordinate: city.y_coordinate,
     });
     setEditingCityId(city.id);
   };
@@ -93,6 +102,8 @@ const Cities = () => {
     setNewCity({
       name: "",
       federal_district_id: "",
+      x_coordinate: "",
+      y_coordinate: "",
     });
     setEditingCityId(null);
   };
@@ -127,6 +138,32 @@ const Cities = () => {
           />
         </div>
 
+        <div className="form-group">
+          <label htmlFor="xCoordinate">Координата X</label>
+          <input
+            type="text"
+            className="form-control"
+            id="xCoordinate"
+            name="x_coordinate"
+            placeholder="Введите координату X"
+            value={newCity.x_coordinate}
+            onChange={handleInputChange}
+          />
+        </div>
+
+        <div className="form-group">
+          <label htmlFor="yCoordinate">Координата Y</label>
+          <input
+            type="text"
+            className="form-control"
+            id="yCoordinate"
+            name="y_coordinate"
+            placeholder="Введите координату Y"
+            value={newCity.y_coordinate}
+            onChange={handleInputChange}
+          />
+        </div>
+
         <div className="input-group mb-3">
           <input
             type="text"
@@ -169,11 +206,14 @@ const Cities = () => {
           </div>
         )}
       </form>
+
       <h3 className="mt-5">Список городов</h3>
       <table className="table table-bordered">
         <thead>
           <tr>
             <th>Название</th>
+            <th>Координата X</th>
+            <th>Координата Y</th>
             <th>Федеральный округ</th>
             <th>Действия</th>
           </tr>
@@ -182,6 +222,8 @@ const Cities = () => {
           {cities.map((city) => (
             <tr key={city.id}>
               <td>{city.name}</td>
+              <td>{city.x_coordinate}</td>
+              <td>{city.y_coordinate}</td>
               <td>{city.federal_district_name}</td>
               <td>
                 <div className="btn-group">