Browse Source

求购banner修改

gaoxm 7 years ago
parent
commit
a0a0eb5482

+ 182 - 1
components/home/floor/FloorList.vue

@@ -2,7 +2,35 @@
   <div class="floor-list">
     <div class="container">
       <floor-bar :floors="floors"></floor-bar>
-      <a href="/store/33069557578d44e69bd91ad12d28a8d4" target="_blank"><img src="/images/all/banner-cuxiao.png" alt=""></a>
+      <div class="banner">
+        <ul>
+          <li><a href="/store/33069557578d44e69bd91ad12d28a8d4" target="_blank"><img src="/images/all/banner-cuxiao01.png" alt=""></a></li>
+          <li>
+            <div class="banner-cuxiao">
+              <table>
+                <caption><span>最新求购</span><img src="/images/all/banner-cuxiao03.jpg" alt=""></caption>
+                <thead>
+                <tr>
+                  <th>发布时间</th>
+                  <th>买家名称</th>
+                  <th>型号</th>
+                  <th>操作</th>
+                </tr>
+                </thead>
+                <tbody>
+                <tr v-for="data in tableData">
+                  <td>{{data.publicTime}}</td>
+                  <td>{{data.name.slice(0, 1) + '**'}}</td>
+                  <td>{{data.productModel | titleFilter}}</td>
+                  <td><a>我要报价</a></td>
+                </tr>
+                </tbody>
+              </table>
+              <a class="purchase">我要求购</a>
+            </div>
+          </li>
+        </ul>
+      </div>
       <floor :floor="defaultFloors[0]" :isDefault="true" v-if="!isEmpty"></floor>
       <floor :floor="defaultFloors[1]" :isDefault="true" v-if="!isEmpty"></floor>
       <floor v-for="(floor, index) in floors.data" :floor="floor" :isDefault="false" :key="index"></floor>
@@ -21,6 +49,27 @@
     },
     data () {
       return {
+        tableData: [{
+          publicTime: '7分钟前',
+          name: '杨某某',
+          productModel: '9w8r9r'
+        }, {
+          publicTime: '7分钟前',
+          name: '杨某某',
+          productModel: '9w8r9r8r78e'
+        }, {
+          publicTime: '7分钟前',
+          name: '杨某某',
+          productModel: '9w8r9r8r78e'
+        }, {
+          publicTime: '7分钟前',
+          name: '杨某某',
+          productModel: '9w8r9r8r78e'
+        }, {
+          publicTime: '7分钟前',
+          name: '杨某某',
+          productModel: '9w8r9r8r78e'
+        }],
         defaultFloors: [
           {
             items: [
@@ -103,6 +152,31 @@
           }
         }
       }
+    },
+    filters: {
+      titleFilter: function (title) {
+        if (title === '') {
+          return title
+        }
+        let len = 0
+        let index = 0
+        for (let i = 0; i < title.length; i++) {
+          if (index === 0 && title.charAt(i).charCodeAt(0) > 255) {
+            len = len + 2
+          } else {
+            len++
+          }
+          if (len > 50) {
+            index = i
+            break
+          }
+        }
+        if (index > 0) {
+          return title.substring(0, index) + '...'
+        } else {
+          return title
+        }
+      }
     }
   }
 </script>
@@ -118,4 +192,111 @@
   .floor-list .container > a > img {
     margin-top: 30px;
   }
+  @keyframes myfirst {
+    0% {
+      transform: translate(0px, 0px);
+    }
+    50% {
+      transform: translate(0px, -3px);
+    }
+    100% {
+      transform: translate(0px, 0px);
+    }
+  }
+  .banner{
+    width:1190px;
+    height: 253px;
+    margin-top: 20px;
+    li{
+      float: left;
+      padding-left: 14px;
+      position: relative;
+      &:first-child{
+        padding-left: 0px;
+      }
+    }
+    .banner-cuxiao {
+      width: 660px;
+      height: 253px;
+      background: url('/images/all/banner-cuxiao02.png') no-repeat;
+      table {
+        width: 436px;
+        caption {
+          color: #f57a2e;
+          font-size: 20px;
+          font-weight: bold;
+          padding: 10px 30px;
+          img{
+            position: relative;
+            top: -7px;
+            animation: myfirst 1s infinite;
+          }
+        }
+        thead tr th {
+          height: 30px;
+          color: #fff;
+          font-size: 14px;
+          background-color: #f57a2e;
+        }
+       tr th, tr td {
+          height: 30px;
+          &:first-child {
+            padding: 6px 7px 6px 16px;
+          }
+         &:nth-child(2) {
+           padding-right: 7px;
+         }
+         &:nth-child(3) {
+           text-align: center;
+           padding: 6px 10px 6px 10px;
+         }
+         &:nth-child(4) {
+           text-align: center;
+           padding: 6px 10px 6px 10px;
+         }
+          a {
+            width: 64px;
+            height: 22px;
+            line-height: 22px;
+            text-align: center;
+            padding: 3px 5px;
+            color: #fd3904;
+            font-size: 12px;
+            border-radius: 2px;
+            border: 1px solid #fd3904;
+            &:hover {
+              border: 1px solid #fd3904;
+              background-color: #fd3904;
+              color: #fff;
+              -moz-box-shadow: 0px 3px 5px #f57a2e; /* 老的 Firefox */
+              box-shadow: 0px 3px 10px #f57a2e;
+            }
+          }
+        }
+        tr td{
+          &:first-child {
+            color: #f57a2e;
+          }
+        }
+      }
+      .purchase {
+        position: absolute;
+        left: 515px;
+        top: 184px;
+        width: 100px;
+        height: 28px;
+        line-height: 28px;
+        background-color: #fff;
+        color: #f57a2e;
+        border-radius: 25px;
+        text-align: center;
+        font-weight: bold;
+        &:hover{
+          background-color: #FB6102;
+          color: #fff;
+          box-shadow: 0px 3px 10px #fd863d;
+        }
+      }
+    }
+  }
 </style>

+ 1 - 1
nuxt.config.js

@@ -1,6 +1,6 @@
 const path = require('path')
 const isProdMode = Object.is(process.env.NODE_ENV, 'production')
-const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://192.168.253.60:9090/platform-b2c/' : 'http://10.1.51.90:8080/platform-b2c/')
+const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://192.168.253.60:9090/platform-b2c/' : 'http://10.1.51.88:8080/platform-b2c/')
 const commonUrl = process.env.COMMON_URL || (isProdMode ? 'http://218.17.158.219:24000/' : 'http://218.17.158.219:24000/')
 
 module.exports = {

BIN
static/images/all/banner-cuxiao01.jpg


BIN
static/images/all/banner-cuxiao01.png


BIN
static/images/all/banner-cuxiao02.png


BIN
static/images/all/banner-cuxiao03.jpg