ソースを参照

Virtual Tour Update

master
30117125 4年前
コミット
c6cfc62bac

+ 26
- 15
src/components/property/commercial/singleView/contentSection.vue ファイルの表示

53
             </div>-->
53
             </div>-->
54
             <p>{{ property.shortDescription }}</p>
54
             <p>{{ property.shortDescription }}</p>
55
             <p>{{ property.price | toCurrency }}</p>
55
             <p>{{ property.price | toCurrency }}</p>
56
-            <div class="btn-white-border">
57
-              <i class="fa fa-search"></i>BOOK A VIEWING
58
-            </div>
59
           </div>
56
           </div>
60
           <div class="panel-left px-5 pb-5 text-center">
57
           <div class="panel-left px-5 pb-5 text-center">
61
             <h4 class="text-white">Share this Property</h4>
58
             <h4 class="text-white">Share this Property</h4>
81
         </div>
78
         </div>
82
         <div class="col-md-8 p-5 resort-profile">
79
         <div class="col-md-8 p-5 resort-profile">
83
           <h2 v-if="property.showAddress">
80
           <h2 v-if="property.showAddress">
84
-            <div
85
-              style="display:inline"
86
-              v-if="property.propertyName !== null"
87
-            >{{ property.propertyName }} /</div>
81
+            <div style="display:inline" v-if="property.propertyName !== null">
82
+              {{ property.propertyName }} /
83
+            </div>
88
             {{ property.streetNumber }} {{ property.streetName }}
84
             {{ property.streetNumber }} {{ property.streetName }}
89
           </h2>
85
           </h2>
90
           <h2 v-else>{{ property.propertyName }}</h2>
86
           <h2 v-else>{{ property.propertyName }}</h2>
107
 
103
 
108
           <div class="mt-5" v-html="property.description"></div>
104
           <div class="mt-5" v-html="property.description"></div>
109
           <router-link
105
           <router-link
110
-            style="float:right"
106
+            style="float:right; white-space: nowrap;"
111
             class="btn-solid-blue mt-3"
107
             class="btn-solid-blue mt-3"
112
             :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
108
             :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
113
-          >MORE INFO...</router-link>
114
-          <h4 v-if="property.video !== null" class="mt-5">Video Tour</h4>
109
+            >ENQUIRE NOW</router-link
110
+          >
111
+
112
+          <h4 v-if="property.virtualTour !== null" style="margin-top:150px">Virtual Tour</h4>
113
+          <iframe
114
+            v-if="property.virtualTour !== null"
115
+            width="100%"
116
+            height="500px"
117
+            :src="property.virtualTour"
118
+            frameborder="0"
119
+            allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
120
+            allowfullscreen
121
+            style="margin-bottom:-6px"
122
+            class="mt-3"
123
+          ></iframe>
124
+
125
+          <h4 v-if="property.video !== null" class="mt-5">Video</h4>
115
           <iframe
126
           <iframe
116
             v-if="property.video !== null"
127
             v-if="property.video !== null"
117
             width="100%"
128
             width="100%"
179
 import gallery from "../../../shared/gallerySlideShow";
190
 import gallery from "../../../shared/gallerySlideShow";
180
 export default {
191
 export default {
181
   components: {
192
   components: {
182
-    gallery,
193
+    gallery
183
   },
194
   },
184
   props: {
195
   props: {
185
     property: {},
196
     property: {},
186
-    propertyImages: {},
197
+    propertyImages: {}
187
   },
198
   },
188
   mounted() {
199
   mounted() {
189
     console.log(this.property);
200
     console.log(this.property);
191
   data() {
202
   data() {
192
     return {
203
     return {
193
       index: null,
204
       index: null,
194
-      date: new Date(),
205
+      date: new Date()
195
     };
206
     };
196
   },
207
   },
197
   computed: {
208
   computed: {
201
         list.push(this.propertyImages[i].image);
212
         list.push(this.propertyImages[i].image);
202
       }
213
       }
203
       return list;
214
       return list;
204
-    },
215
+    }
205
   },
216
   },
206
   created() {
217
   created() {
207
     this.$emit("Loaded", true);
218
     this.$emit("Loaded", true);
208
-  },
219
+  }
209
 };
220
 };
210
 </script>
221
 </script>
211
 
222
 

+ 18
- 4
src/components/property/residential/singleView/contentSection.vue ファイルの表示

1
 <template>
1
 <template>
2
   <section>
2
   <section>
3
-    <div class="container pb-5">
3
+    <div class="container">
4
       <div class="row" id="resort-profile">
4
       <div class="row" id="resort-profile">
5
         <div class="col-md-4">
5
         <div class="col-md-4">
6
           <div class="resPortfolioSection">
6
           <div class="resPortfolioSection">
111
               </div>
111
               </div>
112
               <div class="col-md-4">
112
               <div class="col-md-4">
113
                 <router-link
113
                 <router-link
114
-                  style="float:right"
114
+                  style="float:right; white-space: nowrap;"
115
                   class="btn-solid-blue mt-3"
115
                   class="btn-solid-blue mt-3"
116
                   :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
116
                   :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
117
-                  >Enquire Now</router-link
117
+                  >ENQUIRE NOW</router-link
118
                 >
118
                 >
119
               </div>
119
               </div>
120
             </div>
120
             </div>
121
           </div>
121
           </div>
122
-          <h4 v-if="property.video != null" class="mt-5">Video Tour</h4>
122
+
123
+          <h4 v-if="property.virtualTour != null" style="margin-top:150px">Virtual Tour</h4>
124
+          <iframe
125
+            v-if="property.virtualTour != null"
126
+            width="100%"
127
+            :src="property.virtualTour"
128
+            frameborder="0"
129
+            allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
130
+            allowfullscreen
131
+            style="margin-bottom:-6px"
132
+            class="mt-3"
133
+          ></iframe>
134
+
135
+          <h4 v-if="property.video != null" class="mt-5">Video</h4>
123
           <iframe
136
           <iframe
124
             v-if="property.video != null"
137
             v-if="property.video != null"
125
             width="100%"
138
             width="100%"
130
             style="margin-bottom:-6px"
143
             style="margin-bottom:-6px"
131
             class="mt-3"
144
             class="mt-3"
132
           ></iframe>
145
           ></iframe>
146
+
133
           <p></p>
147
           <p></p>
134
           <div class="d-flex mt-3">
148
           <div class="d-flex mt-3">
135
             <iframe
149
             <iframe

読み込み中…
キャンセル
保存