product-detailed.vue 16.5 KB
Newer Older
786817560's avatar
786817560 committed
1
<!--
786817560's avatar
786817560 committed
2
 * @Descrip: 产品明细
786817560's avatar
786817560 committed
3 4
 * @Author: your name
 * @Date: 2019-10-15 14:30:00
786817560's avatar
786817560 committed
5
 * @LastEditTime: 2019-11-14 15:19:39
786817560's avatar
786817560 committed
6 7 8
 * @LastEditors: Please set LastEditors
   -->
<template>
786817560's avatar
786817560 committed
9
  <h-view
786817560's avatar
786817560 committed
10
    id="detailed" class="public-style"
786817560's avatar
786817560 committed
11
    title="产品查询">
786817560's avatar
786817560 committed
12 13
    <h-header :proportion="[5,1,1]" class="bar-custom">
      <div slot="left" class="h-header-btn">
786817560's avatar
786817560 committed
14
        <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
786817560's avatar
786817560 committed
15 16 17
        <span>产品明细</span>
      </div>
    </h-header>
786817560's avatar
786817560 committed
18
    <div v-if="slide" class="tab-style">
786817560's avatar
786817560 committed
19
      <div :class="{'done':num === 0,'undone':num !== 0}" @click="tabCheck(0)"><img :src="num === 0?baseInfoImg:unBaseInfo"><span>基本信息</span></div>
786817560's avatar
786817560 committed
20 21 22
      <div :class="{'done':num === 1,'undone':num !== 1}" @click="tabCheck(1)"><img :src="num === 1?detail:unDetail"><span>商品详情</span></div>
      <div :class="{'done':num === 2,'undone':num !== 2}" @click="tabCheck(2)"><img :src="num === 2?config:unConfig"><span>产品配置</span></div>
    </div>
786817560's avatar
786817560 committed
23

786817560's avatar
786817560 committed
24
    <!-- 基本信息 -->
786817560's avatar
786817560 committed
25 26 27 28 29 30 31 32 33 34 35 36 37
    <h-content v-swipeup="(e)=>vueTouch('上滑',e)" v-swipedown="(e)=>vueTouch('下滑',e)" class="hcontent">
      <scroll ref="scrolls" :listenScroll="true" class="scrolls" @scroll="startScroll">
        <!-- 基本信息 -->
        <div id="baseInfo" class="base">
          <swipe :interval="5000" class="hls-swipe">
            <swipe-item v-for="(item,index) in picLists" :key="index" class="hls-swipe">
              <img :src="item.url" alt="">
            </swipe-item>
          </swipe>
          <div class="base-content">
            <div class="top-code">
              <div>参数项 &nbsp;{{ baseInfo.product_code }}</div>
              <div>{{ baseInfo.division_n }}</div>
786817560's avatar
786817560 committed
38
            </div>
786817560's avatar
786817560 committed
39 40 41 42
            <div class="pro-name">{{ baseInfo.product_name }}</div>
            <div class="pro-price">
              <p>参考价 <span class="prices">{{ baseInfo.plan_price | currency }}</span></p>
              <p class="dates">价格有效期 &nbsp;{{ baseInfo.price_date_to | dateFormat }}</p>
786817560's avatar
786817560 committed
43
            </div>
786817560's avatar
786817560 committed
44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60
            <div class="agent">
              <div class="items">
                <img src="@/assets/productQuery/agent.png" alt="">
                <p>{{ baseInfo.agent_bp_name }}</p>
              </div>
              <div class="items">
                <img src="@/assets/productQuery/address.png" alt="">
                <p>{{ baseInfo.business_address }} .{{ baseInfo.province_name }}</p>
              </div>
              <div class="items">
                <img src="@/assets/productQuery/call.png" alt="">
                <p>{{ baseInfo.phone }}</p>
              </div>
              <div class="items">
                <img src="@/assets/productQuery/house.png" alt="">
                <p>{{ baseInfo.factory_bp_name }}</p>
              </div>
786817560's avatar
786817560 committed
61
            </div>
786817560's avatar
786817560 committed
62 63 64
          </div>
        </div>

786817560's avatar
786817560 committed
65 66 67
        <!-- 商品详情 -->
        <div id="prodetail" ref="detail" class="pro-details prodetail">
          <div class="equipment-list">商品详情</div>
786817560's avatar
786817560 committed
68

786817560's avatar
786817560 committed
69 70 71
          <div v-for="item in picLists" :key="item.product_attachment_id" class="proPic">
            <img :src="item.url" alt="">
          </div>
786817560's avatar
786817560 committed
72

786817560's avatar
786817560 committed
73 74 75 76 77 78
        </div>
        <!-- 产品配置 -->
        <div id="procfg" class="pro-details procnf">
          <div class="equipment-list">产品配置</div>
          <div class="table-wrap" v-html="confgInfo.product_properties"/>
        </div>
786817560's avatar
786817560 committed
79
      </scroll>
786817560's avatar
786817560 committed
80 81
    </h-content>
    <bottom-tab class="footer-button">
786817560's avatar
786817560 committed
82 83 84
      <tab-button
        :class="{bgcolor: bgc_flag}" class="butt"
        @click.native="goTrial(baseInfo.plan_price,baseInfo.price_date_to)"><img
李晓兵's avatar
李晓兵 committed
85 86
        src="@/assets/productQuery/trial.png" alt=""> 试算
      </tab-button>
786817560's avatar
786817560 committed
87
      <tab-button class="collect butt" @click.native="collect"><img :src="src" alt="">收藏</tab-button>
786817560's avatar
786817560 committed
88 89
    </bottom-tab>
    <div v-if="collect_flag" class="show-collect">
786817560's avatar
786817560 committed
90
      <img src="@/assets/productQuery/collectImg.png" alt="">
786817560's avatar
786817560 committed
91
      <p>{{ show_text }}</p>
786817560's avatar
786817560 committed
92
    </div>
786817560's avatar
786817560 committed
93 94 95 96
  </h-view>
</template>

<script>
786817560's avatar
786817560 committed
97
import Tab from './tab'
786817560's avatar
786817560 committed
98
import baseInfoImg from '@/assets/productQuery/baseInfo.png'
786817560's avatar
786817560 committed
99 100 101 102 103
import unBaseInfo from '@/assets/productQuery/unBaseInfo.png'
import detail from '@/assets/productQuery/detail.png'
import unDetail from '@/assets/productQuery/unDetail.png'
import config from '@/assets/productQuery/config.png'
import unConfig from '@/assets/productQuery/unConfig.png'
786817560's avatar
786817560 committed
104 105 106 107 108 109 110
export default {
  name: 'ProDetailed',
  components: {
    Tab,
  },
  data () {
    return {
786817560's avatar
786817560 committed
111
      num: 0,
786817560's avatar
786817560 committed
112 113
      picLists: [], // 图片列表
      baseInfo: {}, // 基本信息
786817560's avatar
786817560 committed
114
      show_text: '',
786817560's avatar
786817560 committed
115 116 117
      confgInfo: {}, // 配置信息
      detailInfo: {}, // 详情
      bgc_flag: true, // 背景图切换
786817560's avatar
786817560 committed
118
      collect_flag: false,
786817560's avatar
786817560 committed
119
      slide: false,
786817560's avatar
786817560 committed
120
      baseInfoImg: baseInfoImg,
786817560's avatar
786817560 committed
121 122 123 124 125 126
      unBaseInfo: unBaseInfo,
      detail: detail,
      unDetail: unDetail,
      config: config,
      unConfig: unConfig,
      height: 0,
786817560's avatar
786817560 committed
127 128 129
    }
  },
  computed: {},
786817560's avatar
786817560 committed
130 131 132
  watch: {

  },
786817560's avatar
786817560 committed
133
  beforeRouteEnter (to, from, next) {
李晓兵's avatar
李晓兵 committed
134
    debugger
李晓兵's avatar
李晓兵 committed
135
    if (from.name === 'ProductList' || from.name === 'MyProductList' || from.name === 'HomePage') {
786817560's avatar
786817560 committed
136
      next(vm => {
李晓兵's avatar
李晓兵 committed
137 138 139 140
        vm.baseInfo = {}
        vm.confgInfo = {}
        vm.detailInfo = {}
        vm.picLists = []
786817560's avatar
786817560 committed
141
        vm.tabNum = 0
786817560's avatar
786817560 committed
142
        vm.slide = false
786817560's avatar
786817560 committed
143
        vm.product_id = vm.$route.params.product_id
786817560's avatar
786817560 committed
144
        vm.bp_id = vm.$route.params.bp_id
786817560's avatar
786817560 committed
145 146 147 148 149 150 151 152
        vm.baseMsg()
        vm.detailMsg()
        vm.confgMsg()
      })
    }
    next()
  },
  created () {
李晓兵's avatar
李晓兵 committed
153

786817560's avatar
786817560 committed
154 155 156 157 158 159 160 161 162
  },
  activated () {
    if (window.sessionStorage.getItem('collect_status') === 'Y') {
      this.src = require('@/assets/productQuery/coll-success.png')
    } else {
      this.src = require('@/assets/productQuery/collect.png')
    }
  },
  methods:
786817560's avatar
786817560 committed
163

李晓兵's avatar
李晓兵 committed
164
      {
786817560's avatar
786817560 committed
165
        startScroll () {
786817560's avatar
786817560 committed
166 167
          this.slide = true
        },
786817560's avatar
786817560 committed
168 169
        // tab切换
        tabCheck (num) {
786817560's avatar
786817560 committed
170
          let scrollContent = document.getElementsByClassName('scrollContent')[0]
786817560's avatar
786817560 committed
171
          if (num === 0) {
786817560's avatar
786817560 committed
172
            this.num = 0
786817560's avatar
786817560 committed
173
            this.$refs.scrolls.scrollToElement(document.getElementsByClassName('base')[0])
786817560's avatar
786817560 committed
174
          } else if (num === 1) {
786817560's avatar
786817560 committed
175
            this.num = 1
786817560's avatar
786817560 committed
176
            this.$refs.scrolls.scrollToElement(document.getElementsByClassName('prodetail')[0])
786817560's avatar
786817560 committed
177
          } else {
786817560's avatar
786817560 committed
178
            this.num = 2
786817560's avatar
786817560 committed
179
            this.$refs.scrolls.scrollToElement(document.getElementsByClassName('procnf')[0])
786817560's avatar
786817560 committed
180 181
          }
        },
786817560's avatar
786817560 committed
182

786817560's avatar
786817560 committed
183 184 185 186 187
        vueTouch: function (s, e) {
          let clientHeight = document.body.clientHeight // 屏幕可视高度
          let procnfGather = document.getElementsByClassName('procnf')[0].getBoundingClientRect() // 配置信息元素集合
          let detailGather = document.getElementsByClassName('prodetail')[0].getBoundingClientRect() // 详情信息元素集合
          let baseGather = document.getElementsByClassName('base')[0].getBoundingClientRect() // 基本信息元素集合
786817560's avatar
786817560 committed
188
          if (clientHeight - procnfGather.top >= procnfGather.height) {
786817560's avatar
786817560 committed
189
            this.num = 2
786817560's avatar
786817560 committed
190
          } else if (clientHeight - detailGather.top >= detailGather.height) {
786817560's avatar
786817560 committed
191
            this.num = 1
786817560's avatar
786817560 committed
192
          } else if (-(baseGather.top) <= baseGather.height / 2) {
786817560's avatar
786817560 committed
193
            this.num = 0
786817560's avatar
786817560 committed
194
          }
786817560's avatar
786817560 committed
195
        },
786817560's avatar
786817560 committed
196

李晓兵's avatar
李晓兵 committed
197
        // 收藏
786817560's avatar
786817560 committed
198
        collect () {
李晓兵's avatar
李晓兵 committed
199 200
          if (window.sessionStorage.getItem('collect_status') === 'Y') {
            let vm = this
786817560's avatar
786817560 committed
201 202 203 204 205
            let url = $config.basePath + 'delete_collection'
            let param = {
              master: {
                product_id: vm.product_id,
                user_phone: window.localStorage.user_phone,
786817560's avatar
786817560 committed
206
                bp_id: vm.bp_id,
李晓兵's avatar
李晓兵 committed
207
              },
786817560's avatar
786817560 committed
208
            }
786817560's avatar
786817560 committed
209
            vm.hlsPopup.showLoading('请稍后')
786817560's avatar
786817560 committed
210
            vm.$post(url, param).then(function (res) {
786817560's avatar
786817560 committed
211
              vm.hlsPopup.hideLoading()
786817560's avatar
786817560 committed
212 213 214 215 216 217 218 219 220 221
              if (res.result === 'S') {
                window.sessionStorage.setItem('collect_status', 'N')
                vm.show_text = '取消成功'
                vm.collect_flag = true
                vm.src = require('@/assets/productQuery/collect.png')
                setTimeout(() => {
                  vm.text = '收藏'
                  vm.collect_flag = false
                }, 1500)
              }
李晓兵's avatar
李晓兵 committed
222 223
            })
          } else {
786817560's avatar
786817560 committed
224
            this.show_text = '恭喜,收藏成功!'
李晓兵's avatar
李晓兵 committed
225 226 227 228 229 230 231
            this.collect_flag = true
            let vm = this
            let url = $config.basePath + 'save_collection'
            let param = {
              master: {
                product_id: vm.product_id,
                user_phone: window.localStorage.user_phone,
786817560's avatar
786817560 committed
232
                bp_id: vm.bp_id,
李晓兵's avatar
李晓兵 committed
233 234
              },
            }
786817560's avatar
786817560 committed
235
            vm.hlsPopup.showLoading('请稍后')
李晓兵's avatar
李晓兵 committed
236
            vm.$post(url, param).then(function (res) {
786817560's avatar
786817560 committed
237
              vm.hlsPopup.hideLoading()
李晓兵's avatar
李晓兵 committed
238 239 240 241 242 243 244 245 246 247 248 249 250 251
              if (res.result === 'S') {
                window.sessionStorage.setItem('collect_status', 'Y')
                vm.src = require('@/assets/productQuery/coll-success.png')
                setTimeout(() => {
                  vm.text = '取消收藏'
                  vm.collect_flag = false
                }, 1500)
              } else {
                hlsPopup.showLongCenter(res.message)
              }
            })
          }
        },
        // 基本信息查询
786817560's avatar
786817560 committed
252
        baseMsg () {
李晓兵's avatar
李晓兵 committed
253 254 255 256
          let vm = this
          let url = $config.basePath + 'prd_product_info'
          let param = {
            product_id: vm.$route.params.product_id,
786817560's avatar
786817560 committed
257
            bp_id: vm.bp_id,
李晓兵's avatar
李晓兵 committed
258
          }
786817560's avatar
786817560 committed
259
          vm.hlsPopup.showLoading('数据加载中')
李晓兵's avatar
李晓兵 committed
260
          vm.$post(url, param).then(function (res) {
786817560's avatar
786817560 committed
261
            vm.hlsPopup.hideLoading()
李晓兵's avatar
李晓兵 committed
262 263 264 265 266 267 268 269
            if (res.result === 'S') {
              vm.baseInfo = res.info
            } else {
              hlsPopup.showLongCenter(res.message)
            }
          })
        },
        // 详情查询
786817560's avatar
786817560 committed
270
        detailMsg () {
李晓兵's avatar
李晓兵 committed
271 272 273 274 275
          let vm = this
          let url = $config.basePath + 'prd_product_detial'
          let param = {
            product_id: vm.$route.params.product_id,
          }
786817560's avatar
786817560 committed
276
          vm.hlsPopup.showLoading('数据加载中')
李晓兵's avatar
李晓兵 committed
277
          vm.$post(url, param).then(function (res) {
786817560's avatar
786817560 committed
278
            vm.hlsPopup.hideLoading()
李晓兵's avatar
李晓兵 committed
279 280 281 282 283 284 285 286 287 288 289 290
            if (res.result === 'S') {
              vm.detailInfo = res.info
              res.lists.forEach(item => {
                item['url'] = process.env.filePath + 'attachment_id=' + item.product_attachment_id + '&access_token=' + window.localStorage.access_token
              })
              vm.picLists = res.lists
            } else {
              hlsPopup.showLongCenter(res.message)
            }
          })
        },
        // 配置查询
786817560's avatar
786817560 committed
291
        confgMsg () {
李晓兵's avatar
李晓兵 committed
292 293 294 295 296
          let vm = this
          let url = $config.basePath + 'prd_product_conf'
          let param = {
            product_id: vm.$route.params.product_id,
          }
786817560's avatar
786817560 committed
297
          vm.hlsPopup.showLoading('数据加载中')
李晓兵's avatar
李晓兵 committed
298
          vm.$post(url, param).then(function (res) {
786817560's avatar
786817560 committed
299
            vm.hlsPopup.hideLoading()
李晓兵's avatar
李晓兵 committed
300 301 302 303 304 305 306 307
            if (res.result === 'S') {
              vm.confgInfo = res.info
            } else {
              hlsPopup.showLongCenter(res.message)
            }
          })
        },
        // 试算price:产品参考价,date:有效日期
786817560's avatar
786817560 committed
308
        goTrial (price, date) {
李晓兵's avatar
李晓兵 committed
309 310 311 312 313 314 315 316 317
          this.$router.push({
            name: 'FinancingTrial',
            params: {
              plan_price: price,
              price_date_to: date,
            },
          })
        },
      },
786817560's avatar
786817560 committed
318
}
786817560's avatar
786817560 committed
319
</script>
李晓兵's avatar
李晓兵 committed
320 321
<style lang='less'>
  #detailed {
786817560's avatar
786817560 committed
322
    .hls-swipe {
786817560's avatar
786817560 committed
323
      background: #fff;
786817560's avatar
786817560 committed
324 325 326 327
      img {
        width: 100%;
      }
    }
786817560's avatar
786817560 committed
328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375
  .tab-style{
    display:flex;
    justify-content: center;
    padding-top:12px;
    padding-bottom: 8px;
    align-items: center;
    background-color: #fff;
    box-shadow:0 2px 3px 0  rgba(220,220,221,0.50);

    div{
      position: relative;
      height: 32px;
      width: 172px;
      border-radius:16px;
      border-radius: 16px;
      font-family: PingFangSC-Semibold;
      font-size: 14px;
      letter-spacing: 0.43px;
      margin:  0 4px;
      line-height: 32px;
      display: flex;
      flex-direction: row;
      justify-content: center
    }
    .undone{
      background: rgba(220,220,221,0.26);
      color: #383F45;
    }
    .done{
      background: rgba(0,70,156,0.10);
      color: #00469C;
    }

    img{
      height: 16px;
      width: 16px;
      // display: block;
      // float: left;
       // margin: 6px 0 0 43px;
       margin-top: 8px;
       margin-right: 4px;
    }

    span{
      // position: absolute;
      left:70px;
    }
  }
786817560's avatar
786817560 committed
376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403
    .detail-pic {
      width: 100%;
    }
    .base-content {
      width: 100%;
     // height: 226px;
      background: #fff;
      padding: 10px 24px 0 24px;
      margin-bottom: 10px;
      position: relative;
      .top-code {
        display: flex;
        flex-direction: row;
        div {
          font-family: PingFangSC-Semibold;
          height: 24px;
          line-height: 24px;
          font-size: 13px;
          color: #FDB62F;
          background: rgba(253, 182, 47, 0.25);
          border-radius: 2px;
          text-align: center;
        }
        div:nth-of-type(1) {
          width: 101px;
        }
        div:nth-of-type(2) {
          margin-left: 16px;
786817560's avatar
786817560 committed
404 405
         // width: 73px;
         padding: 0 4px;
786817560's avatar
786817560 committed
406
        }
786817560's avatar
786817560 committed
407
      }
786817560's avatar
786817560 committed
408
      .pro-name {
786817560's avatar
786817560 committed
409
        font-family: PingFangSC-Semibold;
786817560's avatar
786817560 committed
410 411 412 413 414
        font-size: 18px;
        color: #232323;
        letter-spacing: 0;
        font-weight: 600;
        margin-top: 8px;
786817560's avatar
786817560 committed
415
      }
786817560's avatar
786817560 committed
416 417 418 419
      .pro-price {
        width: 100%;
        height: 50px;
        line-height: 50px;
李晓兵's avatar
李晓兵 committed
420 421
        font-family: PingFangSC-Regular;
        font-size: 14px;
786817560's avatar
786817560 committed
422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445
        color: #4B4A4B;
        position: relative;
        border-bottom: 1px solid #f3f3f7;
        p {
          position: absolute;
          height: 50px;
          line-height: 50px;
        }
        p:nth-of-type(1) {
          left: 0;
        }
        .prices {
          font-family: Verdana-Bold;
          font-size: 18px;
          color: #1D3FFF;
          font-weight: 600
        }
        .dates {
          font-family: PingFangSC-Regular;
          font-size: 12px;
          color: rgba(74,75,74,0.60);
          position: absolute;
          right: 0;
        }
李晓兵's avatar
李晓兵 committed
446
      }
786817560's avatar
786817560 committed
447
      .agent {
李晓兵's avatar
李晓兵 committed
448 449
        font-family: PingFangSC-Regular;
        font-size: 14px;
786817560's avatar
786817560 committed
450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466
        color: #4A4B4A;
        padding-bottom: 4px;
        .items {
        //  height: 20px;
          display: flex;
          flex-direction: row;
          margin-top: 7px;
          p {
           // height: 20px;
            line-height: 20px;
            margin-left: 8px;
          }
        }
        img {
          width: 20px;
          height: 20px;
        }
李晓兵's avatar
李晓兵 committed
467
      }
786817560's avatar
786817560 committed
468
    }
786817560's avatar
786817560 committed
469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492
    .pro-details {
      margin-top: 10px;
      margin-bottom: 10px;
      background: #fff;
      .equipment-list {
        height: 40px;
        line-height: 40px;
        background-color: #fff;
        color: #00469c;
        font-size: 15px;
        margin-left: 16px;
        position: relative;
      }
      .equipment-list::before {
        content: "";
        display: block;
        width: 4px;
        height: 20px;
        background-color: #00469c;
        position: absolute;
        left: -15px;
        top: 10px;
      }
}
786817560's avatar
786817560 committed
493 494 495
.procnf {
        margin-bottom: 70px
      }
李晓兵's avatar
李晓兵 committed
496 497 498 499
    .footer-button {
      .butt {
        width: 48%;
        margin-left: 3px;
786817560's avatar
786817560 committed
500

李晓兵's avatar
李晓兵 committed
501 502
        border-radius: 4px;
      }
786817560's avatar
786817560 committed
503 504 505
      .butt:nth-of-type(2) {
        border: 1px solid #FDB62F;
      }
李晓兵's avatar
李晓兵 committed
506 507 508 509 510 511 512 513 514

      img {
        height: 19px;
        width: 19px;
        //margin-top: 2px;
        margin-right: 3px;
      }

      .collect {
786817560's avatar
786817560 committed
515
        color: #FDB62F;
李晓兵's avatar
李晓兵 committed
516 517 518 519 520 521 522
      }
    }

    .bgcolor {
      background: #00469C;
      border: 1px solid #00469C;
      border-radius: 4px;
786817560's avatar
786817560 committed
523 524
      font-family: PingFangSC-Semibold;
      color: #FFFFFF;
786817560's avatar
786817560 committed
525
    }
李晓兵's avatar
李晓兵 committed
526 527

    .show-collect {
786817560's avatar
786817560 committed
528 529
      width: 260px;
      height: 109px;
李晓兵's avatar
李晓兵 committed
530 531 532 533 534 535 536 537 538 539
      opacity: 0.7;
      background: #383F45;
      border-radius: 4px;
      position: fixed;
      top: 0px;
      left: 0px;
      right: 0px;
      bottom: 0px;
      margin: auto;
      display: flex;
786817560's avatar
786817560 committed
540
      flex-direction: column;
李晓兵's avatar
李晓兵 committed
541
      align-items: center;
786817560's avatar
786817560 committed
542
      // justify-content: center;
李晓兵's avatar
李晓兵 committed
543 544 545 546 547

      p {
        font-family: PingFangSC-Semibold;
        font-size: 16px;
        color: #FFFFFF;
786817560's avatar
786817560 committed
548 549 550
        height: 22px;
        line-height: 22px;
        margin-top: 12px;
李晓兵's avatar
李晓兵 committed
551 552 553
      }

      img {
786817560's avatar
786817560 committed
554 555 556
        width: 35px;
        height: 35px;
        margin-top: 20px;
李晓兵's avatar
李晓兵 committed
557 558 559 560 561
      }
    }

    .proPic {
      width: 100%;
786817560's avatar
786817560 committed
562
      padding: 0 24px;
李晓兵's avatar
李晓兵 committed
563
      img {
786817560's avatar
786817560 committed
564
        width: 100%
李晓兵's avatar
李晓兵 committed
565 566 567
      }
    }
    .table-wrap{
786817560's avatar
786817560 committed
568
      padding: 0 24px;
李晓兵's avatar
李晓兵 committed
569 570 571 572 573 574 575 576 577 578 579
      table {
        background-color: #fff !important;
        td{
          border:1px solid #ccc;
          text-align: center;
          vertical-align: middle;
          span{
            color:#000 !important;
          }
        }
      }
786817560's avatar
786817560 committed
580
    }
786817560's avatar
786817560 committed
581
  }
786817560's avatar
786817560 committed
582
</style>