You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
75 lines
2.0 KiB
75 lines
2.0 KiB
<template>
|
|
<div id="bookshelf">
|
|
<!-- <div class="top-bg" /> -->
|
|
<div class="bookshelf-header" style="height:120px">
|
|
<h2>本架图书</h2>
|
|
<div class="rack-direct">
|
|
<span class="rack-direct-active">左</span>
|
|
<span>右</span>
|
|
</div>
|
|
</div>
|
|
<div class="rack-box">
|
|
<div v-for="(item) in listData" :key="item" class="rack-item">
|
|
<ul class="rack-list">
|
|
<li class="list-item">
|
|
<div class="box-txt">
|
|
<span class="book-name">书书书</span>
|
|
<span class="book-writer">作者</span>
|
|
</div>
|
|
</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<!-- 15 -->
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
<li class="list-item">书</li>
|
|
</ul>
|
|
<div class="rack-floor">
|
|
<span class="icon iconfont icon-l"></span>
|
|
<p><span style="margin-right:25px">第一层</span><span>(共15本)</span></p>
|
|
<span class="icon iconfont icon-r"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import data1 from './data1.json'
|
|
export default {
|
|
name: 'CurrentRackBook',
|
|
components: {
|
|
},
|
|
data() {
|
|
return {
|
|
listData: [
|
|
|
|
]
|
|
}
|
|
},
|
|
created() {
|
|
this.listData = data1.listData
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import "~@/assets/styles/index.scss";
|
|
|
|
</style>
|