How to create this kind a menu using wp menu?

Question

I want to create below code using wp_nav_menu. How do I create this code using wp_nav_menu? Also how to change UL class page to page using wp_nav_menu?

<div class="collapse navbar-collapse" id="navbarNavDropdown">
    <ul class="navbar-nav hatch-main-nav-inner hatch-main-nav-inner--red">
        <li class="nav-item">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/about">About</a>
        </li>
        <li class="nav-item active">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/co-working">Co-working <span class="sr-only">(current)</span></a>
            <div class="hatch-secondary-menu">
                <a class="hatch-secondary-menu-item hatch-secondary-menu-item--active" href="<?php bloginfo('url'); ?>/co-working">Overview</a>
                <a class="hatch-secondary-menu-item" href="#">Pricing</a>
                <a class="hatch-secondary-menu-item" href="#">Perks</a>
                <a class="hatch-secondary-menu-item" href="#">Locations</a>
            </div>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/start-ups">Start-ups</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/membership">Membership</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/events">Events</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="<?php bloginfo('url'); ?>/contact">Contact</a>
        </li>

    </ul>
</div>

I used this code for now:

<?php
wp_nav_menu( 
    array( 
        'menu_class' => 'navbar-nav hatch-main-nav-inner hatch-main-nav-inner--red', 
        'container' => false, 
        'theme_location' => 'header-menu', 
        'items_wrap' => '<ul>%3$s</ul>', 
        'depth' => 1, 

    ) 
);
?>

Using this code I can view main URL, but I don't know how to view sub menu items.