Authored by ccbikai

add title image

@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
5 <focus v-bind:list="floor.data"></focus> 5 <focus v-bind:list="floor.data"></focus>
6 </div> 6 </div>
7 <div class="title-image" v-if="floor.titleImage"> 7 <div class="title-image" v-if="floor.titleImage">
8 - <title-image></title-image> 8 + <title-image v-bind:floor="floor.data"></title-image>
9 </div> 9 </div>
10 </template> 10 </template>
11 </div> 11 </div>
@@ -40,5 +40,7 @@ @@ -40,5 +40,7 @@
40 </script> 40 </script>
41 41
42 <style> 42 <style>
43 - 43 + .resources {
  44 + background: #f6f6f6;
  45 + }
44 </style> 46 </style>
  1 +<template>
  2 + <div class="floor-header">
  3 + {{title.title}}
  4 +
  5 + <a class="more" href="{{title.moreUrl}}">
  6 + {{title.moreName}}
  7 + </a>
  8 + </div>
  9 +</template>
  10 +
  11 +<script>
  12 + module.exports = {
  13 + props: ['title']
  14 + };
  15 +</script>
  16 +
  17 +<style>
  18 + .floor-header {
  19 + position: relative;
  20 + width: 100%;
  21 + height: 100px;
  22 + font-size: 32px;
  23 + line-height: 100px;
  24 + text-align: center;
  25 + font-weight: bold;
  26 + border-top: 1px solid #eee;
  27 + margin-top: 20px;
  28 + background: #fff;
  29 +
  30 + .more {
  31 + position: absolute;
  32 + top: 0;
  33 + right: 0;
  34 + width: 100px;
  35 + height: 100px;
  36 + }
  37 + }
  38 +</style>
@@ -34,6 +34,9 @@ @@ -34,6 +34,9 @@
34 } 34 }
35 35
36 .swipe-item { 36 .swipe-item {
  37 + a {
  38 + display: block;
  39 + }
37 img { 40 img {
38 width: 100%; 41 width: 100%;
39 height: 100%; 42 height: 100%;
1 <template> 1 <template>
2 - <div class="xss">  
3 - title-image  
4 - </div> 2 + <floor-header v-bind:title="floor.title"></floor-header>
  3 + <a class="image" v-bind:href="floor.image.url">
  4 + <img v-bind:src="floor.image.src | resize 750 364">
  5 + </a>
5 </template> 6 </template>
6 7
7 <script> 8 <script>
  9 + const floorHeader = require('component/resources/floor-header.vue');
  10 +
8 module.exports = { 11 module.exports = {
9 - data() {  
10 - return {  
11 - message: 'resources'  
12 - }; 12 + props: ['floor'],
  13 + components: {
  14 + floorHeader: floorHeader
13 } 15 }
14 }; 16 };
15 </script> 17 </script>
16 18
17 <style> 19 <style>
  20 + .title-image {
  21 + a {
  22 + display: block;
  23 + }
18 24
  25 + .image {
  26 + width: 100%;
  27 + height: 364px;
  28 + }
  29 +
  30 + img {
  31 + width: 100%;
  32 + height: 100%;
  33 + }
  34 + }
19 </style> 35 </style>