---

  const HaderInterface = (
    <form name={"MySuperForm"} onSubmit={handleSave} ref={formRef}>
      <Box style={{overflowX: 'auto',}}>

      ....

        <LabeledInput
          label="Кол-во в партии"
          name="quantity"
          type="number"
          defaultValue={formData.quantity}
          error={!!errors.quantity}
          helperText={errors.quantity}
        />

      ....

      </Box>
      <Box
        sx={{
          display: 'grid',
          // gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 2fr))',
          gridTemplateColumns: 'repeat(auto-fill, minmax(250px, 1fr))',
          gap: 2, // отступы между всеми элементами
          alignItems: 'center',
          marginBottom: "15px",
          '& > *': {
            maxWidth: '530px',
            // width: '100%',
            // justifySelf: 'center'
          },
        }}
      >
        <Button
          variant="contained"
          startIcon={<AddIcon/>}
          // onClick={addRow}
          // onClick={() => setOpenModal(true)}
          onClick={() => openAddModal()}
          sx={{Height: "400px"}}
          disabled={mods !== 1 ? false: saveDisabled}
        >
          Добавить операцию
        </Button>

        <Button
          variant="contained"
          startIcon={<SaveIcon/>}
          // onClick={handelSaveDev}
          id="save"
          type="submit"
        >
          Сохранить
        </Button>

        <Button
          variant="contained"
          startIcon={<SaveIcon/>}
          // onClick={handleSave}
          type="submit"
        >
          Утвердить
        </Button>
      </Box>
    </form>
  );
....

return (
    <div style={{
      display: "flex",
      flexDirection: "column",
      padding: "10px",
      height: "calc(100% - 20px)",
      minHeight: "530px",
      // width: "100%",
      // overflowX: 'auto',
    }}>
      {/*Интерфейс данных над таблицей*/}
      {HaderInterface}
      <div style={{
        flex: 1,
        minHeight: 0
      }}>
        <CustomTable<MyRow>
          columns={columns}
          rows={rows}
          // editable={true}
          // onAddRow={() => ({
          //   nco_is_control: true,
          // })}
          deleteField="nco_is_delete"
          onAddRowRequest={addRow}
          // onSaveAllRequest={handleSave}
          onDeleteRowRequest={deleteRow}
          onRowUpdate={updateRow}
          onRowContextMenu={(row, e) => {
            setSelectedRow(row);
            openMenu(e);
          }}
          onRowDoubleClick={handleRowDoubleClick}
          // onSaveAll={async (rows) => {
          //   await axios.post(`${baseUrl}/save_rowsNewNc_no`, rows, {withCredentials: true});
          // }}
          // rows={}
        />
        <AddRowModal
          open={openModal}
          mode={modalMode}
          onClose={() => setOpenModal(false)}
          onAdd={handleAddRow}
          onEdit={handleEditRow}
          editRow={editRow}
          comboOptions={[
          //   <span style={{color: '#2e7d32', fontWeight: 'bold', fontSize: '20px'}}>✓</span>,
          //   <span style={{color: '#e31010', fontWeight: 'bold', fontSize: '20px'}}>✗</span>,
            items
          ]}
          rowNumber={rowNumber += 1}
          quantity={modalQuantity}
        />
        {menu}
      </div>
    </div>
  );