<iframe></noscript> <div id="app" v-cloak> <nav id="site-nav" class="site-navigation fixed page-header"> <div class="nav-wrapper"> <div class="branding-nav-wtc"> <h1 class="site-branding" ref="logo" > <a href="/"> <img src="/siteassets/logotyper-svg-nya/wtc_logo-alla-svart.svg" /> </a> </h1> <div class="sweet-nav-wtc priority-nav-wtc"> <top-menu :menus="menus" :startpage="false"></top-menu> <ul class="nav navbar-nav navbar-right" ref="rightMenu" > <li id="ia" class="nav-item-right nav-right navbar-cta cta-1" v-show="!showHamburger"> <ia-modal url="/api/wtc/ia" page-id="15505" dialog-type="auto"> Intresse­anmälan </ia-modal> </li> <li class="nav-item-right navbar-cta cta-2" v-show="!showHamburger"> <a href="/lediga-lokaler/">Lediga lokaler</a> </li> <li class="nav-item-right favorites" :class="{'contains-items': $root.favorites.length > 0 }" v-show="!showHamburger"> <a href="/favoriter/"> <div class="favorite-counter" v-show="$root.favorites.length > 0">{{ $root.favorites.length }}</div> <img class="convert-svg" src="/Areas/WTC/Content/img/favorit_fill.svg" /> </a> </li> <li class="nav-item-right nav-search" ref="search"> <a href="/sok/"><img src="/Areas/WTC/Content/img/ikon-sok.svg" /></a> </li> <li class="nav-item-right nav-language-switcher" v-show="!showHamburger && $root.languages.length > 1" :class="{'is-expanded' : langExpanded }"> <a href="#" @click.stop.prevent="$root.toggleLangExpand"><img src="/Areas/WTC/Content/img/globe-icon.svg" /></a> <ul class="dropdown-menu-holder nav-language-switcher-holder"> <li v-for="language in $root.languages" :class="{'is-current-language': language.isCurrent }"> <span v-if="language.isCurrent">{{language.name}}</span> <a v-else :href="language.url" @click.self=""> {{language.name}} </a> </li> </ul> </li> </ul> </div> </div> </div> </nav> <div class="container-fluid pod-full-page-container no-blocks-top" style="padding-left: 0; padding-right: 0;"> <div class="container-fluid container-fullbleed"> <div class="row"> <div class="search"> <div class="search-form"> <div class="search-form-wrapper container"> <div class="search-form-container"> <h2>Sök</h2> <form action="/sok/" method="get"> <div class="search-block"> <div class="search-block-form input-group"> <span> <img aria-hidden="true" class="search-form-icon" src="/Areas/WTC/Content/img/search-form-icon.svg" alt="Sök här" /> </span> <input type="text" tabindex="1" name="q" /> <input type="submit" tabindex="2" class="btn" value="Sök" /> </div> </div> <div class="filter-navigation"> <ul> </ul> </div> </form> </div> </div> </div> <div class="search-list"> <div class="search-list-wrapper container"> </div> </div> </div> </div> </div> </div> <main class="main-body"> </main> <footer> <div class="top-banner"> <div class="container"> <a href="/"> <img src="/siteassets/logotyper-svg-nya/wtc_logo-alla-svart.svg" /> </a> <div class="language-switcher" v-if="$root.languages.length > 1"> <template v-for="language in $root.languages"> <span v-if="language.isCurrent" class="is-current-language">{{language.name}}</span> <a v-else :href="language.url">{{language.name}}</a> </template> </div> </div> </div> <div class="footer-holder"> <div class="container"> <div class="row" data-equal-btns> <div class="col-sm-12 col-lg-6 col-xl-3 menu-column" v-for="menu in menusWithChildren" :key="menu.Key"> <h4 v-if="menu.Url"><a :href="menu.Url">{{ menu.Text }}</a></h4> <h4 v-else>{{ menu.Text }}</h4> <ul v-if="menu.Items.length > 0"> <li v-for="item in menu.Items" :key="item.Key"> <a v-if="item.Url" :href="item.Url">{{ item.Text }}</a> <h4 v-else>{{ item.Text }}</h4> <ul v-if="item.Items.length > 0"> <li v-for="subItem in item.Items" :key="subItem.Key"><a :href="subItem.Url">{{subItem.Text}}</a></li> </ul> </li> </ul> </div> <div class="col-sm-12 col-lg-6 col-xl-3 menu-column contact-column"> <h4>Kontakt</h4> <div class="contact-info-container"> <div class="contact-info"> <div> <svg id="Group_6288" data-name="Group 6288" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 22.5"> <path id="Path_3559" data-name="Path 3559" class="cls-1" d="M8.5,0C3.8,0,0,3,0,8.3S8.5,22.5,8.5,22.5,17,13.5,17,8.3C17,3,13.2,0,8.5,0Zm0,19.4q-1.2-1.35-2.7-3.3C2.5,11.6,2,9.2,2,8.3A6.025,6.025,0,0,1,3.8,3.7,6.771,6.771,0,0,1,8.5,2a7.212,7.212,0,0,1,4.7,1.6A6.1,6.1,0,0,1,15,8.3c0,1-.5,3.3-3.9,7.9C10.2,17.4,9.2,18.6,8.5,19.4Z" /> <path id="Path_3560" data-name="Path 3560" class="cls-1" d="M8.5,6A2.5,2.5,0,1,0,11,8.5,2.476,2.476,0,0,0,8.5,6Zm0,3A.5.5,0,1,1,9,8.5.472.472,0,0,1,8.5,9Z" /> </svg> <span>Jungmansgatan 12, 211 11 Malmö</span> </div> <div class="phone"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.554 20.555"> <g id="phone-talking" transform="translate(-1.215 -2.546)"> <g id="phone-talking-2" data-name="phone-talking"> <path id="shape" class="cls-1" d="M18.115,21.092A1,1,0,0,0,19,20.41l.718-2.153a1,1,0,0,0-.242-1.023L17.646,15.4a1,1,0,0,0-1.23-.145l-1.7,1.039a3,3,0,0,1-3.689-.436L8.454,13.282a3,3,0,0,1-.436-3.689L9.057,7.9a1,1,0,0,0-.145-1.23L7.082,4.839A1,1,0,0,0,6.058,4.6l-2.153.718a1,1,0,0,0-.682.884C3.1,8.167,4.467,11.79,8.5,15.819S16.148,21.218,18.115,21.092Zm.129,2c-2.727.176-6.751-1.443-11.162-5.854S1.052,8.8,1.228,6.071A3,3,0,0,1,3.273,3.418L5.426,2.7a3,3,0,0,1,3.07.725l1.829,1.829a3,3,0,0,1,.436,3.689l-1.039,1.7a1,1,0,0,0,.145,1.23l2.578,2.578a1,1,0,0,0,1.23.145l1.7-1.039a3,3,0,0,1,3.689.436l1.829,1.829a3,3,0,0,1,.725,3.07L20.9,21.042A3,3,0,0,1,18.244,23.087Z" /> </g> </g> </svg> <a href="tel:+46 40 627 11 00">+46 40 627 11 00</a> </div> <div class="email"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 16"> <g id="mail" transform="translate(-1 -4)"> <g id="mail-2" data-name="mail"> <path id="shape" class="cls-1" d="M23,8.978Q23,9,23,9.023V16a4,4,0,0,1-4,4H5a4,4,0,0,1-4-4V9.023Q1,9,1,8.978V8A4,4,0,0,1,5,4H19a4,4,0,0,1,4,4v.978Zm-2-.722V8a2,2,0,0,0-2-2H5A2,2,0,0,0,3,8v.256l8.344,4.474a5.4,5.4,0,0,0,1.347,0Zm0,2.088-8.138,4.441a3,3,0,0,1-1.724,0L3,10.344V16a2,2,0,0,0,2,2H19a2,2,0,0,0,2-2Z" /> </g> </g> </svg> <a href="mailto:info@wtcmalmo.se">info@wtcmalmo.se</a> </div> </div> <div class="member-of-midroc-image"> <img src="/siteassets/qbank/member_of_midroc-logo-vit-5956.png" /> </div> </div> </div> </div> </div> </div> </footer> <div class="footer-navigation"> <div class="footer-navigation-item footer-navigation-item--scroll"><a href="#">Scrolla till toppen <img src="/Areas/WTC/Content/img/footer-arrow-right.svg" /></a></div> <div class="footer-navigation-item footer-navigation-item--next"><a href="https://www.wtcmalmolundhelsingborg.se/varfor-wtc/">Gå vidare till: Varför WTC <img src="/Areas/WTC/Content/img/footer-arrow-right.svg" /></a></div> </div> </div> <script type="text/x-template" id="top-menu"> <ul class="nav navbar-nav navbar-left" :class="{'hamburger-is-present' : showHamburger}" ref="navbar"> <top-menu-item :menu="menu" v-for="(menu,index) in menus" :index="index" :key="menu.Key" ref="topMenu" @close-menus="closeMenus" :breakpoint="breakPoint" :forceHidden="showHamburger" ></top-menu-item> <li class="nav-item has-child-menu is-nav-more" :class="{'is-expanded' : expanded, 'mobile-nav-more' : showHamburger, }" ref="more" v-show="breakPoint > -1 || showHamburger"> <a href="#" class="nav-link" @click.stop.prevent="toggleExpand" @keydown.esc="expanded = false"> <template v-if="!showHamburger"> FLER </template> <template v-else> <span></span> </template> </a> <ul class="dropdown-menu-holder more-sub-menu" v-show="expanded"> <top-menu-item :menu="menu" v-for="(menu,index) in menus" :index="!showHamburger ? index : menus.length" :key="'dropdown-' + menu.Key" ref="dropDownMenu" @close-menus="closeDropDownMenus" :dropdown="true" :breakpoint="breakPoint"></top-menu-item> <li class="dropdown-nav-item nav-item navbar-cta cta-1" v-show="showHamburger"> <ia-modal url="/api/wtc/ia" page-id="15505" dialog-type="auto"> Intresse­anmälan </ia-modal> </li> <li class="dropdown-nav-item nav-item navbar-cta cta-2" v-show="showHamburger"> <a href="/lediga-lokaler/">Lediga lokaler</a> </li> <li class="dropdown-nav-item nav-item favorites" :class="{'contains-items': $root.favorites.length > 0 }" v-show="showHamburger"> <a href="/favoriter/"> <div class="favorite-text">Favoriter</div> <div class="favorite-heart"> <div class="favorite-counter" v-show="$root.favorites.length > 0">{{ $root.favorites.length }}</div> <svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 29 26" class="convert-svg replaced-svg"> <path class="cls-1" d="M21.09,0c-2.64,0-4.61,1.05-6.59,3.29C12.52,1.05,10.55,0,7.91,0A7.82,7.82,0,0,0,0,8.15a11,11,0,0,0,.44,3,17.35,17.35,0,0,0,1.87,4.19A27.74,27.74,0,0,0,8.52,22.2a54.37,54.37,0,0,0,4.4,3.31,2.59,2.59,0,0,0,1.51.49h.14a2.59,2.59,0,0,0,1.51-.49,54.37,54.37,0,0,0,4.4-3.31,27.74,27.74,0,0,0,6.21-6.85,17.35,17.35,0,0,0,1.87-4.19,11,11,0,0,0,.44-3A7.82,7.82,0,0,0,21.09,0Z"></path> </svg> </div> </a> </li> <li class="dropdown-nav-item nav-item mobile-language-picker nav-language-switcher" v-show="showHamburger && $root.languages.length > 1" :class="{'is-expanded' : $root.langExpanded }" @close-menus="closeMenus"> <a @click.stop.prevent="$root.toggleLangExpand"> <div class="language-picker-text"> Language / Språk </div> <div class="language-icon"> <img src="/Areas/WTC/Content/img/globe-icon.svg" /> </div> </a> <ul class="dropdown-menu-holder nav-language-switcher-holder sub-sub-menu"> <li v-for="language in $root.languages" :class="{ 'is-current-language': language.isCurrent}"> <span v-if="language.isCurrent">{{language.name}}</span> <a v-else :href="language.url" @click.self="">{{language.name}}</a> </li> </ul> </li> <li class="dropdown-nav-item nav-item search" ref="dropdownSearch" v-show="showHamburger"> <a href="/sok/">Sök</a> </li> </ul> </li> </ul> </script> <script type="text/x-template" id="top-menu-item"> <li v-if="!dropdown" class="nav-item" :class="{'nav-hidden' : (breakpoint > -1 && breakpoint < index) || forceHidden, 'has-child-menu' : menu.Items.length > 0, 'is-expanded' : expanded, 'selected': isSelected(menu)}"> <a v-if="menu.Items.length > 0" class="nav-link" href="#" @click.stop.prevent="toggleExpand" @keydown.esc="expanded = false">{{ menu.Text }}</a> <a v-else class="nav-link" :href="menu.Url">{{ menu.Text }}</a> <ul class="dropdown-menu-holder" v-if="menu.Items.length > 0"> <li class="nav-item"> <div class="mega-menu" style="max-width: 1180px; margin: 0 auto; width: 100%;"> <div class="container"> <div class="row menu-column-container" data-equal-btns> <div class="col-sm menu-column" :class="{'menu-description':!!menu.Description}"> <h4 v-if="menu.Description">{{ menu.Text }}</h4> <h4 v-else :class="{selected: isSelected(menu, true)}"><a :href="menu.Url">{{ menu.Text }}</a></h4> <ul v-if="menu.Description"> <li class="sub-nav-item with-arrow" :class="{selected: isSelected(menu, true)}"> <a :href="menu.Url">{{ menu.Description }}</a> </li> </ul> </div> <!-- level 2 --> <div class="col-sm menu-column" v-for="item in menu.Items" :key="item.Key"> <h4 v-if="item.Url"><a :href="item.Url">{{ item.Text }}</a></h4> <h4 v-else>{{ item.Text }}</h4> <ul v-if="item.Items.length > 0"> <!-- level 3 --> <li class="sub-nav-item" :class="{selected: isSelected(subItem, true)}" v-for="subItem in item.Items" :key="subItem.Key"> <a class="nav-link" :href="subItem.Url">{{ subItem.Text }}</a> </li> </ul> </div> </div> </div> </div> </li> <div class="container language-switcher-container" v-if="$root.languages.length > 1"> <div class="language-switcher"> <template v-for="language in $root.languages"> <span v-if="language.isCurrent" class="is-current-language">{{language.name}}</span> <a v-else :href="language.url">{{language.name}}</a> </template> </div> </div> </ul> </li> <li v-else class="dropdown-nav-item nav-item" :class="{'has-child-menu' : menu.Items.length > 0, 'is-expanded' : expanded, selected: isSelected(menu, true)}" v-show="breakpoint > -1 && breakpoint < index"> <a v-if="menu.Items.length > 0" class="nav-link" href="#" @click.stop.prevent="toggleExpand" @keydown.esc="expanded = false">{{ menu.Text }}</a> <a v-else class="nav-link" :href="menu.Url">{{ menu.Text }}</a> <ul v-if="menu.Items.length > 0" class="dropdown-menu-holder sub-sub-menu"> <li class="dropdown-sub-nav-item" v-for="item in menu.Items" :key="'dropdown-' + item.Key" :class="{selected: isSelected(item, true)}"> <a v-if="item.Url" :href="item.Url">{{ item.Text }}</a> <h4 v-else>{{ item.Text }}</h4> <ul v-if="item.Items.length > 0"> <li class="dropdown-sub-sub-nav-item" v-for="subItem in item.Items" :key="'dropdown-' + subItem.Key" :class="{selected: isSelected(subItem, true)}"> <a :href="subItem.Url">{{ subItem.Text }}</a> </li> </ul> </li> </ul> </li> </script> <script type="text/x-template" id="ia-modal-template"> <span> <a href="#" :class="attrs" @click.prevent="showModal = true" :title="title"><slot></slot></a> <transition name="modal" v-if="showModal"> <div class="ia-modal ia-modal-mask modal" :class="{'ia-modal-mask-startpage':startpage}" ref="modal"> <div class="modal-dialog" :class="{'modal-lg': isPropertyOrObject }"> <div class="modal-content"> <div class="modal-header ia-modal-header"> <slot name="header"> <h5 class="modal-title" v-html="ia.pageHeader"></h5> <a href="#" class="ia-modal-close" aria-label="CLOSE" data-dismiss="modal" @click.stop.prevent="showModal = false"> <span aria-hidden="true">×</span> </a> </slot> </div> <div class="modal-body ia-modal-body"> <slot name="body"> <div class="container"> <div class="row"> <div :class="{'col-md-8 col-sm-12 order-last order-md-first' : isPropertyOrObject, 'col-12': !isPropertyOrObject }"> <form @submit.prevent="post" class="needs-validation" novalidate> <template v-if="ia.dialogType == 'project-follow'"> <div v-html="ia.title"></div> <div class="form-group" :class="{ 'form-group--error': $v.ia.email.$error }"> <label for="email" class="ia-modal-input"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> </template> <template v-if="ia.dialogType == 'share' || ia.dialogType == 'share-event'"> <p v-html="ia.title"></p> <div class="form-group"> <label for="email" class="ia-modal-input" :class="{ 'form-group--error': $v.ia.email.$error }"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="message" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message" key="message"></textarea> <span class="ia-modal-label">Meddelande till mottagaren</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> </template> <template v-if="ia.dialogType == 'share-favorites'"> <p v-html="ia.title"></p> <div class="form-group" :class="{ 'form-group--error': $v.ia.email.$error }"> <label for="email" class="ia-modal-input"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="message" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message" key="message"></textarea> <span class="ia-modal-label">Meddelande till mottagaren</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> </template> <template v-if="ia.dialogType == 'auto' && showFormFields"> <div class="form-group" :class="{ 'form-group--error': $v.ia.email.$error }"> <label for="email" class="ia-modal-input"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="requests" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message" key="message"></textarea> <span class="ia-modal-label">Önskemål och frågor</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="required-text" v-if="!expanded"> <p>Obligatoriska fält markerade med <span class="required-red">*</span></p> </div> <div class="expanded" v-if="expanded"> <div class="ia-modal-middle-divider"> <p>Våra önskemål</p> <hr> </div> <div class="form-group"> <label class="form-check-label ia-modal-check" for="callMe"> Jag vill bli uppringd av en uthyrare <input type="checkbox" class="form-check-input" v-model="ia.callMe" id="callMe" /> <span class="checkmark"></span> </label> </div> <div class="form-group" :class="{ 'form-group--error': $v.ia.phone.$error }"> <label for="phone" class="ia-modal-input"> <input class="form-control ia-modal-form" id="phone" type="tel" placeholder=" " v-model="$v.ia.phone.$model" key="phone" /> <span class="ia-modal-label">Telefonnummer <span v-if="ia.callMe" class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.phone.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.phone.$error" class="form-success"></span> </label> </div> <div class="form-group ia-modal-select"> <custom-select :items="ia.cities" v-model="ia.city"></custom-select> </div> <div class="form-group"> <label for="size" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message2" key="message2"></textarea> <span class="ia-modal-label">Önskad lokalstorlek</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="required-text"> <p>Obligatoriska fält markerade med <span class="required-red">*</span></p> </div> <div class="form-group"> <label class="form-check-label ia-modal-check" for="booking"> Jag är intresserad av att boka en visning <input class="form-check-input" id="booking" type="checkbox" v-model="ia.booking" key="booking" /> <span class="checkmark"></span> </label> </div> </div> <button class="ia-modal-btn ia-modal-collapse" @click="expanded = true" type="button" v-if="!expanded"> <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-left"> Har ni mer specifika krav eller önskemål? <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-right"> </button> </template> <template v-if="isPropertyOrObject && showFormFields"> <div class="form-group" :class="{ 'form-group--error': $v.ia.email.$error }"> <label for="email" class="ia-modal-input"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="requests-and-questions" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message" key="message"></textarea> <span class="ia-modal-label">Önskemål och frågor</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="form-group"> <label for="name" class="ia-modal-input"> <input class="form-control ia-modal-form" type="text" placeholder=" " id="name" v-model="ia.name" key="name" /> <span class="ia-modal-label">Namn</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="required-text" v-if="!expanded"> <p>Obligatoriska fält markerade med <span class="required-red">*</span></p> </div> <div class="ia-modal-middle-divider"> <p>Våra önskemål</p> <hr> </div> <div class="form-group"> <label class="form-check-label ia-modal-check" for="callMe"> Jag vill bli uppringd av en uthyrare <input type="checkbox" class="form-check-input" v-model="ia.callMe" id="callMe" /> <span class="checkmark"></span> </label> </div> <div class="form-group" :class="{ 'form-group--error': $v.ia.phone.$error }"> <label for="phone" class="ia-modal-input"> <input class="form-control ia-modal-form" id="phone" type="tel" placeholder=" " v-model="$v.ia.phone.$model" key="phone" /> <span class="ia-modal-label">Telefonnummer <span v-if="ia.callMe" class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.phone.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.phone.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label class="form-check-label ia-modal-check" for="booking"> Jag är intresserad av att boka en visning <input class="form-check-input" id="booking" type="checkbox" v-model="ia.booking" key="booking" /> <span class="checkmark"></span> </label> </div> </template> <template v-if="ia.dialogType == 'conference' && showFormFields"> <div class="form-group" :class="{ 'form-group--error': $v.ia.email.$error }"> <label for="email" class="ia-modal-input" :class="{ 'form-group--error': $v.ia.email.$error }"> <input class="form-control ia-modal-form" id="email" type="email" placeholder=" " v-model="$v.ia.email.$model" key="email" /> <span class="ia-modal-label">E-postadress <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.email.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="phone" class="ia-modal-input"> <input class="form-control ia-modal-form" id="phone" type="tel" placeholder=" " v-model="$v.ia.phone.$model" key="phone" /> <span class="ia-modal-label">Telefonnummer <span class="required-red">*</span></span> <span v-if="$v.ia.phone.$dirty && $v.ia.phone.$error" class="form-error"></span><span v-if="$v.ia.phone.$dirty && !$v.ia.phone.$error" class="form-success"></span> </label> </div> <div class="form-group"> <label for="name" class="ia-modal-input"> <input class="form-control ia-modal-form" type="text" placeholder=" " id="name" v-model="ia.name" key="name" /> <span class="ia-modal-label">Namn</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="required-text" v-if="!expanded"> <p>Obligatoriska fält markerade med <span class="required-red">*</span></p> </div> <div class="expanded" v-if="expanded"> <div class="ia-modal-middle-divider"> <p>Våra önskemål</p> <hr> </div> <div class="form-group ia-modal-select"> <custom-select :items="ia.cities" v-model="ia.city"></custom-select> </div> <div class="form-group ia-modal-select"> <custom-select :items="ia.conferencePeoples" v-model="ia.peopleCount"></custom-select> </div> <div class="form-group"> <label for="other-request" class="ia-modal-input"> <textarea class="form-control ia-modal-form" placeholder=" " v-model="ia.message2" key="message"></textarea> <span class="ia-modal-label">Övriga önskemål - T ex tid, förtäring</span> <span v-if="$v.ia.phone.$dirty" class="form-success"></span> </label> </div> <div class="required-text"> <p>Obligatoriska fält markerade med <span class="required-red">*</span></p> </div> <div class="form-group"> <label class="form-check-label ia-modal-check" for="member"> Jag är hyresgäst i World Trade Center <input class="form-check-input" type="checkbox" id="member" v-model="ia.isMember" key="member" /> <span class="checkmark"></span> </label> </div> </div> <button class="ia-modal-btn ia-modal-collapse" @click.stop.prevent="expanded = true" type="button" v-if="!expanded"> <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-left"> Har ni mer specifika krav eller önskemål? <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-right"> </button> </template> <div class="error-summary-group" v-if="$v.ia.$error || ia.errorMessage"> <ul class="error-summary"> <li v-if="!$v.ia.email.required"> Ange en e-postadress </li> <li v-if="!$v.ia.email.email"> Ange en giltig e-postadress </li> <li v-if="!$v.ia.phone.required"> Ange ett telefonnummer </li> <li v-if="!$v.ia.phone.number"> Ange ett giltigt telefonnummer </li> <li v-if="ia.errorMessage"> <blockquote> {{ ia.errorMessage }} </blockquote> </li> </ul> </div> <div class="success-summary-group" v-if="ia.successMessage && submitStatus == 'completed'"> <ul class="success-summary"> <li>{{ ia.successMessage }}</li> </ul> </div> <div class="form-footer ia-modal-footer"> <p v-if="ia.policyUrl"> World Trade Center är personuppgiftsansvarig för behandlingen av dina personuppgifter. Dina uppgifter kommer att behandlas enligt vår <a :href="ia.policyUrl" class="policy-link" target="policy">integritets- och cookiepolicy</a> </p> <button class="btn ia-modal-btn ia-modal-send" type="submit" :disabled="loading || submitStatus == 'invalid'"> <img :src="getSubmitImage" class="ia-modal-send-img"> {{ getSubmitStatusText }}<span v-show="loading">...</span> </button> </div> <input type="text" v-model="honeypot" class="hidden" /> </form> </div> <!-- col-8 --> <div class="col-md-4 col-sm-12" align="center" v-if="isPropertyOrObject"> <div class="ia-modal-sidebar"> <div class="ia-modal-sidebar-header"> <h3>Jag vill veta mer om</h3> </div><!-- header--> <div class="ia-modal-title"> <div class="ia-modal-sidebar-image-wrapper"> <img v-if="ia.propertyImageUrl" :src="ia.propertyImageUrl"> </div> <h1>{{ia.propertyName }}</h1> <h3>{{ ia.propertyCity }}<span v-if="ia.propertyLocation"> - {{ ia.propertyLocation }}</span></h3> </div><!-- title --> <div class="row ia-modal-sidebar-info" v-if="ia.dialogType == 'object'"> <div class="col-6 divider"> <h2>{{ ia.objectSpace }}</h2> <span>(kvadratmeter)</span> </div><!-- col-6 --> <div class="col-6"> <h2>{{ ia.objectPeople }}</h2> <span>(antal personer)</span> </div><!-- col-6 --> </div><!-- row --> <div class="ia-modal-sidebar-footer" v-if="ia.objectFloor"> <h3>VÅNINGSPLAN</h3> <span>{{ ia.objectFloor }}</span> <p>{{ ia.objectQuote }}</p> </div><!-- footer --> </div> </div> </div> </div> </slot> </div> </div> </div> </div> </transition> </span> </script> <script type="text/x-template" id="find-office-modal-template"> <span v-if="objectSearchPageUrl"> <a href="#" @click.prevent="showModal = true"><slot></slot></a> <transition name="modal" v-if="showModal"> <div class="ia-modal ia-modal-mask modal" ref="modal"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header ia-modal-header"> <slot name="header"> <h5 class="modal-title">{{ find.pageHeader }}</h5> <a href="#" class="ia-modal-close" aria-label="CLOSE" data-dismiss="modal" @click.stop.prevent="showModal = false"> <span aria-hidden="true">×</span> </a> </slot> </div> <div class="modal-body ia-modal-body"> <slot name="body"> <div class="container"> <div class="row"> <div class="col-12"> <div v-if="!find.errorMessage"> <p v-html="find.title"></p> <form @submit.prevent="post"> <div class="object-search-sliders" style="margin-bottom:1.5rem"> <div class="object-search-sliders-tabs"> <div class="object-search-sliders-tab tab-area" :class="{'is-current': sliderState == 'area'}" @click.prevent="sliderState = 'area'" @change="track($options.trackingCategory, $options.trackingAction, 'Lokalyta')"> <span>Lokalyta</span> </div> <div class="object-search-sliders-tab tab-people" :class="{'is-current': sliderState == 'people'}" @click.prevent="sliderState = 'people'" @change="track($options.trackingCategory, $options.trackingAction, 'Personalstorlek')"> <span>Personalstorlek (st)</span> </div> </div> <div class="object-search-slider"> <span class="object-search-slider-area" v-show="sliderState == 'area'"> <custom-range-slider v-if="find.fromArea < find.toArea" style="margin: 3rem 0;" :min="find.fromArea" :max="find.toArea" :step="1" :value="[find.selectedAreaFrom, find.selectedAreaTo]" @change="updateSlider" ref="space"></custom-range-slider> <div v-else> Flexibelt </div> </span> <span class="object-search-slider-people" v-show="sliderState == 'people'"> <custom-range-slider v-if="find.fromPeople < find.toPeople" style="margin: 3rem 0;" :min="find.fromPeople" :max="find.toPeople" :step="1" :value="[find.selectedPeopleFrom, find.selectedPeopleTo]" @change="updateSlider" ref="people"></custom-range-slider> <div v-else> Flexibelt </div> </span> </div> </div> <div class="form-footer ia-modal-footer"> <button class="btn ia-modal-btn ia-modal-send text-center" type="submit"> <img v-show="loading" src="/Areas/WTC/Content/img/time.svg" class="ia-modal-send-img ia-modal-sending"> {{ find.buttonText }} </button> </div> </form> </div> <div v-else class="error-summary-group"> <ul class="error-summary"> <li> {{ find.errorMessage }} </li> </ul> </div> </div> </div> </div> </slot> </div> </div> </div> </div> </transition> </span> </script> <script type="text/x-template" id="start-page-menu-left-template"> <div class="nav-branding-container"> <div class="top-branding"> <div class="frontpage-logo"> <img :src="model.HeaderLogo" /> </div> <div class="frontpage-menu-mobile d-flex d-md-none"> <div class="frontpage-menu-mobile-holder"> <transition name="start-page-menu"> <a class="McButton" :class="{'active': expanded}" data="hamburger-menu" @click.prevent="expanded = !expanded"> <i ref="bar1"></i> <i ref="bar2"></i> <i ref="bar3"></i> </a> </transition> </div> <div class="frontpage-menu-mobile-search"> <a href="/sok/"> <img src="/Areas/WTC/Content/img/ikon-sok.svg" /> </a> </div> </div> </div> <span style="position: fixed;left: 0; top: 0; right: 0; bottom: 0; z-index: 1;" v-if="expanded" @click="expanded = false" @keydown.esc="expanded = false"></span> <nav id="site-nav" class="mobile-front-navigation" v-if="expanded"> <div class="nav-wrapper"> <div class="branding-nav-wtc"> <div class="sweet-nav-wtc priority-nav-wtc"> <top-menu :menus="menus" :startpage="true"></top-menu> <ul class="nav navbar-nav navbar-right"> <li id="ia" class="nav-item-right nav-right navbar-cta cta-1"> <ia-modal url="/api/wtc/ia" page-id="15505" dialog-type="auto" startpage="true"> Intresse­anmälan </ia-modal> </li> <li class="nav-item-right navbar-cta cta-2"> <a href="/lediga-lokaler/">Lediga lokaler</a> </li> <li class="nav-item-right favorites" :class="{'contains-items': $root.favorites.length > 0 }"> <a href="/favoriter/"> <div class="favorite-text">Favoriter</div> <div class="favorite-heart"> <div class="favorite-counter" v-show="$root.favorites.length > 0">{{ $root.favorites.length }}</div> <svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 29 26" class="convert-svg replaced-svg"> <path class="cls-1" d="M21.09,0c-2.64,0-4.61,1.05-6.59,3.29C12.52,1.05,10.55,0,7.91,0A7.82,7.82,0,0,0,0,8.15a11,11,0,0,0,.44,3,17.35,17.35,0,0,0,1.87,4.19A27.74,27.74,0,0,0,8.52,22.2a54.37,54.37,0,0,0,4.4,3.31,2.59,2.59,0,0,0,1.51.49h.14a2.59,2.59,0,0,0,1.51-.49,54.37,54.37,0,0,0,4.4-3.31,27.74,27.74,0,0,0,6.21-6.85,17.35,17.35,0,0,0,1.87-4.19,11,11,0,0,0,.44-3A7.82,7.82,0,0,0,21.09,0Z"></path> </svg> </div> </a> </li> <li v-if="$root.languages.length > 1" class="dropdown-nav-item nav-item mobile-language-picker nav-language-switcher" @keydown.esc="$root.langExpanded = false" :class="{'is-expanded' : $root.langExpanded}"> <a @click.stop.prevent="$root.toggleLangExpand"> <div class="language-picker-text"> Språk </div> <div class="language-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="28.033" height="27.773" viewBox="0 0 28.033 27.773"> <g id="Group_7012" data-name="Group 7012" transform="translate(0.315 0.25)"> <path id="Path_4161" data-name="Path 4161" d="M13.637.75A12.887,12.887,0,1,1,.75,13.637,12.887,12.887,0,0,1,13.637.75Z" transform="translate(0 0)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> <path id="Path_4162" data-name="Path 4162" d="M8,16.623a1.718,1.718,0,0,0,1.667-2.135l-.859-3.436c-.191-.765-.879-2.3-1.667-2.3l-6.132,1A12.883,12.883,0,0,0,5.609,22.4l1.155-5.776Z" transform="translate(0 1.309)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> <path id="Path_4163" data-name="Path 4163" d="M21.9,5.25H17.248a1.718,1.718,0,0,0-1.667,1.3l-.859,3.436a1.719,1.719,0,0,0,1.667,2.135H18.2L18.1,17.564C18.243,18.392,19.96,19,20.8,19H23A12.829,12.829,0,0,0,21.9,5.253Z" transform="translate(2.025 0.655)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> </g> </svg> </div> </a> <ul class="dropdown-menu-holder nav-language-switcher-holder sub-sub-menu"> <li v-for="language in $root.languages" :class="{ 'is-current-language': language.isCurrent}"> <span v-if="language.isCurrent">{{language.name}}</span> <a v-else :href="language.url" @click.self="">{{language.name}}</a> </li> </ul> </li> </ul> </div> </div> </div> </nav> </div> </script> <script type="text/x-template" id="start-page-menu-right-template"> <div class="frontpage-menu d-none d-md-flex"> <div class="frontpage-menu-holder"> <transition name="start-page-menu"> <a class="McButton" :class="{'active': expanded}" data="hamburger-menu" @click.prevent="expanded = !expanded"> <i></i> <i></i> <i></i> </a> </transition> <div class="menu-text" @click.prevent="expanded = !expanded"> MENY </div> </div> <div class="frontpage-search"> <a href="/sok/"> <span>Sök</span> <img class="convert-svg" src="/Areas/WTC/Content/img/ikon-sok.svg" /> </a> </div> </div> </script> <script type="text/x-template" id="custom-select-template"> <div class="wtc-dropdown" :class="{'open' : expanded }" @click.stop.prevent="setExpanded(!expanded)" tabindex="0"> <span class="current">{{selectedText}}</span> <div class="list"> <ul> <li v-if="emptyText" class="option" :class="{'selected' : !value}" tabindex="-1" @click.stop.prevent="setValue(null)">{{ emptyText }}</li> <li v-for="(item, index) in items" class="option" :class="{'selected' : value == (item.id || item)}" :tabindex="index" @click.stop.prevent="setValue(item)">{{ item.text || item }}</li> </ul> </div> </div> </script> <script src="/Bundles/EpiCrateScripts?v=g7rBsTetZRK16f99CJ9M5OwgjwtT7989TJJrc2w_ojs1"></script> <script src="/Bundles/WTCScripts?v=gNNagdvulpXiin5qmViyyEp43_PiKPJjLf_LTVt8TjY1"></script> <script>(function ($, d) { $.each(readyQ, function (i, f) { $(f) }); $.each(bindReadyQ, function (i, f) { $(d).bind("ready", f) }) })(jQuery, document)</script> <script type="text/javascript"> function loadMore(btn, noOfResults) { var $btn = $(btn); var $list = $btn.closest(".search").find("> div .list-items"); $btn.addClass("button-loading"); $.get("/WTC/SearchPage?q=&sf=&offset=" + $list.find(".item").length + "&nr=" + noOfResults, function (result) { $list.append(result.html); if ($list.find(".item").length >= result.total) { $btn.closest(".button-load-more").remove(); } $btn.removeClass("button-loading"); }); } </script> <script type="text/javascript" src="https://dl.episerver.net/13.3.0/epi-util/find.js"></script> <script type="text/javascript"> if(FindApi){var api = new FindApi();api.setApplicationUrl('/');api.setServiceApiBaseUrl('/find_v2/');api.processEventFromCurrentUri();api.bindWindowEvents();api.bindAClickEvent();api.sendBufferedEvents();} </script> <script type="text/javascript"> window.PageEditing = { PageIsInEditMode:false }; (function () { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = '//maps.googleapis.com/maps/api/js?v=3.exp&key=AIzaSyCHHj_hXSbYvU8sn9e5vcZCjTa-zg5pGPE&callback=google_maps_initialize&language=sv-SE&libraries=places'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); function google_maps_initialize() { $(document).trigger("google-maps-initialize"); } initVue([{"Level":1,"Key":"11839","Text":"Varför WTC","Description":"Vad är det som gör det så speciellt med World Trade Center?","Url":"/varfor-wtc/","Items":[{"Level":2,"Key":"11903","Text":"Kontor","Description":"","Url":"/varfor-wtc/kontor/","Items":[{"Level":3,"Key":"11904","Text":"Coworking","Description":"","Url":"/varfor-wtc/kontor/coworking/","Items":[]},{"Level":3,"Key":"12003","Text":"Kontorshotell","Description":"","Url":"/varfor-wtc/kontor/kontorshotell/","Items":[]},{"Level":3,"Key":"12058","Text":"Kontorslokal","Description":"","Url":"/varfor-wtc/kontor/kontorslokaler/","Items":[]},{"Level":3,"Key":"11906","Text":"Aktivitetsbaserad kontorsmiljö","Description":"","Url":"/varfor-wtc/kontor/aktivitetsbaserade-kontor/","Items":[]}]},{"Level":2,"Key":"11912","Text":"Service","Description":"","Url":"/varfor-wtc/service/","Items":[{"Level":3,"Key":"12169","Text":"Medlemsförmåner","Description":"","Url":"/varfor-wtc/service/medlemsformaner/","Items":[]},{"Level":3,"Key":"19346","Text":"Konferenslokaler","Description":"","Url":"/link/796d8d380d0d4095a0192eec96a2b161.aspx","Items":[]}]},{"Level":2,"Key":"11911","Text":"Klubb","Description":"","Url":"/varfor-wtc/klubb/","Items":[{"Level":3,"Key":"12149","Text":"Medlemmar","Description":"","Url":"/varfor-wtc/klubb/medlemmar/","Items":[]},{"Level":3,"Key":"38172","Text":"Medlemsbrev","Description":"","Url":"/varfor-wtc/klubb/medlemsbrev/","Items":[]},{"Level":3,"Key":"12199","Text":"Evenemang","Description":"","Url":"/varfor-wtc/klubb/evenemang/","Items":[]},{"Level":3,"Key":"42575","Text":"Arkiv webbinarier \u0026 podcasts","Description":"","Url":"/varfor-wtc/klubb/arkiv-webbinarier--podcasts/","Items":[]}]},{"Level":2,"Key":"22526","Text":"Magasinet","Description":"","Url":"/varfor-wtc/magasinet/","Items":[]}]},{"Level":1,"Key":"11916","Text":"Fastigheter och lokaler","Description":"Vi erbjuder moderna kontor och hyr även ut konferenslokaler.","Url":"/fastigheter-och-lokaler/","Items":[{"Level":2,"Key":"12334","Text":"Våra fastigheter","Description":"","Url":"/fastigheter-och-lokaler/vara-fastigheter/","Items":[{"Level":3,"Key":"12329","Text":"Malmö","Description":"","Url":"/fastigheter-och-lokaler/vara-fastigheter/malmo/","Items":[]},{"Level":3,"Key":"12784","Text":"Lund","Description":"","Url":"/fastigheter-och-lokaler/vara-fastigheter/lund/","Items":[]},{"Level":3,"Key":"12787","Text":"Helsingborg","Description":"","Url":"/fastigheter-och-lokaler/vara-fastigheter/helsingborg/","Items":[]}]},{"Level":2,"Key":"14333","Text":"Konferenslokaler","Description":"","Url":"/fastigheter-och-lokaler/konferenslokaler/","Items":[{"Level":3,"Key":"14371","Text":"Malmö","Description":"","Url":"/fastigheter-och-lokaler/konferenslokaler/malmo/","Items":[]},{"Level":3,"Key":"18217","Text":"Lund","Description":"","Url":"/fastigheter-och-lokaler/konferenslokaler/lund/","Items":[]},{"Level":3,"Key":"18462","Text":"Helsingborg","Description":"","Url":"/fastigheter-och-lokaler/konferenslokaler/helsingborg/","Items":[]}]},{"Level":2,"Key":"11930","Text":"Lediga lokaler","Description":"","Url":"","Items":[{"Level":3,"Key":"19343","Text":"Malmö","Description":"","Url":"/link/f157ae5ef624449dafabe76177ac3254.aspx?q=Malmö","Items":[]},{"Level":3,"Key":"19344","Text":"Lund","Description":"","Url":"/link/f157ae5ef624449dafabe76177ac3254.aspx?q=Lund","Items":[]},{"Level":3,"Key":"19345","Text":"Helsingborg","Description":"","Url":"/link/f157ae5ef624449dafabe76177ac3254.aspx?q=Helsingborg","Items":[]}]},{"Level":2,"Key":"14295","Text":"Nyproduktion","Description":"","Url":"/fastigheter-och-lokaler/nyproduktion/","Items":[]}]},{"Level":1,"Key":"12340","Text":"Om Oss","Description":"Vill du veta mer om World Trade Center eller vår ägare Midroc?","Url":"/om-wtc/","Items":[{"Level":2,"Key":"12622","Text":"World Trade Centers Association","Description":"","Url":"/om-wtc/world-trade-centers-association/","Items":[{"Level":3,"Key":"13408","Text":"About us","Description":"","Url":"/om-wtc/world-trade-centers-association/about-us/","Items":[]}]},{"Level":2,"Key":"12646","Text":"Midroc Properties","Description":"","Url":"/om-wtc/midroc-properties/","Items":[{"Level":3,"Key":"12722","Text":"Jobba hos oss","Description":"","Url":"/om-wtc/midroc-properties/jobba-hos-oss/","Items":[]},{"Level":3,"Key":"12697","Text":"Press \u0026 media","Description":"","Url":"/om-wtc/midroc-properties/press-och-media/","Items":[]},{"Level":3,"Key":"12672","Text":"Hållbarhet","Description":"","Url":"/om-wtc/midroc-properties/hallbarhet/","Items":[]}]},{"Level":2,"Key":"15506","Text":"Nyheter","Description":"","Url":"/om-wtc/nyheter/","Items":[]},{"Level":2,"Key":"13456","Text":"Kontakta oss","Description":"","Url":"/om-wtc/kontakta-oss/","Items":[]}]},{"Level":1,"Key":"11935","Text":"För hyresgäster","Description":null,"Url":"/for-hyresgaster/","Items":[]}], '15505', 'Ta bort alla favoriter?', [{"name":"Svenska","url":"/","isCurrent":true},{"name":"English","url":"https://www.wtcmalmolundhelsingborg.com/","isCurrent":false}]); </script> </body> </html>