<iframe></noscript> <script type="text/javascript" src="https://dl.episerver.net/13.4.8/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> <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" alt="" /> </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 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" alt="" /></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" alt="" /></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" alt="" /> </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> <a href="/cookies/">Integritets- och cookiepolicy</a> </div> <div> <a id="ot-sdk-btn" class="ot-sdk-show-settings">Cookie-inställningar</a> </div> </div> <div class="member-of-midroc-image"> <a href="/om-wtc/granitor-properties/vi-ar-en-del-av-granitor/"><img src="/siteassets/images/logos/wtc_member_of_granitor_sv.png" alt="" /></a> </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" alt="" /></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" alt="" /></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" alt="" /> </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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.message.$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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.message.$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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.message.$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.message2.$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" alt="" /> Har ni mer specifika krav eller önskemål? <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-right" alt="" /> </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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.message.$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.name.$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.email.$dirty && $v.ia.email.$error" class="form-error"></span><span v-if="$v.ia.email.$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.name.$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.message2.$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" alt="" /> Har ni mer specifika krav eller önskemål? <img src="/Areas/WTC/Content/img/arrow-down.svg" class="ia-modal-arrow-img-right" alt="" /> </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"> När du kontaktar oss sparas de uppgifter som du anger i formuläret. Anledningen till varför vi sparar dessa uppgifter är för att vi ska kunna behandla dina frågor och synpunkter. Läs mer om hur vi behandlar dina personuppgifter och vilka rättigheter du har på <a :href="ia.policyUrl" class="policy-link" target="policy">vår integritets- och cookiepolicysida</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" alt="" /> {{ 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" alt="" /> </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-people" :class="{'is-current': sliderState == 'people'}" @click.prevent="sliderState = 'people'" @change="track($options.trackingCategory, $options.trackingAction, 'Personalstorlek')"> <span>Personalstorlek (st)</span> </div> <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> <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" alt="" /> {{ 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" alt="" /> </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" alt="" /> </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 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=bgmPAhGwm47dltCIcfNBBgfCFrbTRzUkoyChZLfsqsM1"></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"> 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":"56859","Text":"Kontor","Description":"","Url":"/varfor-wtc/kontor/","Items":[{"Level":3,"Key":"56860","Text":"Coworking","Description":"","Url":"/varfor-wtc/kontor/coworking/","Items":[]},{"Level":3,"Key":"57058","Text":"Kontorshotell","Description":"","Url":"/varfor-wtc/kontor/kontorshotell/","Items":[]},{"Level":3,"Key":"57117","Text":"Kontorslokal","Description":"","Url":"/varfor-wtc/kontor/kontorslokal/","Items":[]},{"Level":3,"Key":"57187","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":2,"Key":"58662","Text":"Inspiration","Description":"","Url":"/varfor-wtc/inspiration/","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 Granitor?","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":"Granitor Properties","Description":"","Url":"/om-wtc/granitor-properties/","Items":[{"Level":3,"Key":"12697","Text":"Press \u0026 media","Description":"","Url":"/om-wtc/granitor-properties/press-och-media/","Items":[]},{"Level":3,"Key":"12722","Text":"Jobba hos oss","Description":"","Url":"/om-wtc/granitor-properties/jobba-hos-oss/","Items":[]},{"Level":3,"Key":"12672","Text":"Hållbarhet","Description":"","Url":"/om-wtc/granitor-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":[]},{"Level":1,"Key":"100584","Text":"Inspiration","Description":null,"Url":"/varfor-wtc/inspiration/","Items":[]}], '15505', 'Ta bort alla favoriter?', [{"name":"Svenska","url":"/","isCurrent":true},{"name":"English","url":"https://www.wtcmalmolundhelsingborg.com/","isCurrent":false}]); </script> </body> </html>