diff --git a/src/assets/iconfont/demo.css b/src/assets/iconfont/demo.css
deleted file mode 100644
index a67054a..0000000
--- a/src/assets/iconfont/demo.css
+++ /dev/null
@@ -1,539 +0,0 @@
-/* Logo 字体 */
-@font-face {
-  font-family: "iconfont logo";
-  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
-  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
-    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
-    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
-    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
-}
-
-.logo {
-  font-family: "iconfont logo";
-  font-size: 160px;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-/* tabs */
-.nav-tabs {
-  position: relative;
-}
-
-.nav-tabs .nav-more {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  height: 42px;
-  line-height: 42px;
-  color: #666;
-}
-
-#tabs {
-  border-bottom: 1px solid #eee;
-}
-
-#tabs li {
-  cursor: pointer;
-  width: 100px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  font-size: 16px;
-  border-bottom: 2px solid transparent;
-  position: relative;
-  z-index: 1;
-  margin-bottom: -1px;
-  color: #666;
-}
-
-
-#tabs .active {
-  border-bottom-color: #f00;
-  color: #222;
-}
-
-.tab-container .content {
-  display: none;
-}
-
-/* 页面布局 */
-.main {
-  padding: 30px 100px;
-  width: 960px;
-  margin: 0 auto;
-}
-
-.main .logo {
-  color: #333;
-  text-align: left;
-  margin-bottom: 30px;
-  line-height: 1;
-  height: 110px;
-  margin-top: -50px;
-  overflow: hidden;
-  *zoom: 1;
-}
-
-.main .logo a {
-  font-size: 160px;
-  color: #333;
-}
-
-.helps {
-  margin-top: 40px;
-}
-
-.helps pre {
-  padding: 20px;
-  margin: 10px 0;
-  border: solid 1px #e7e1cd;
-  background-color: #fffdef;
-  overflow: auto;
-}
-
-.icon_lists {
-  width: 100% !important;
-  overflow: hidden;
-  *zoom: 1;
-}
-
-.icon_lists li {
-  width: 100px;
-  margin-bottom: 10px;
-  margin-right: 20px;
-  text-align: center;
-  list-style: none !important;
-  cursor: default;
-}
-
-.icon_lists li .code-name {
-  line-height: 1.2;
-}
-
-.icon_lists .icon {
-  display: block;
-  height: 100px;
-  line-height: 100px;
-  font-size: 42px;
-  margin: 10px auto;
-  color: #333;
-  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
-  -moz-transition: font-size 0.25s linear, width 0.25s linear;
-  transition: font-size 0.25s linear, width 0.25s linear;
-}
-
-.icon_lists .icon:hover {
-  font-size: 100px;
-}
-
-.icon_lists .svg-icon {
-  /* 通过设置 font-size 来改变图标大小 */
-  width: 1em;
-  /* 图标和文字相邻时，垂直对齐 */
-  vertical-align: -0.15em;
-  /* 通过设置 color 来改变 SVG 的颜色/fill */
-  fill: currentColor;
-  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
-      normalize.css 中也包含这行 */
-  overflow: hidden;
-}
-
-.icon_lists li .name,
-.icon_lists li .code-name {
-  color: #666;
-}
-
-/* markdown 样式 */
-.markdown {
-  color: #666;
-  font-size: 14px;
-  line-height: 1.8;
-}
-
-.highlight {
-  line-height: 1.5;
-}
-
-.markdown img {
-  vertical-align: middle;
-  max-width: 100%;
-}
-
-.markdown h1 {
-  color: #404040;
-  font-weight: 500;
-  line-height: 40px;
-  margin-bottom: 24px;
-}
-
-.markdown h2,
-.markdown h3,
-.markdown h4,
-.markdown h5,
-.markdown h6 {
-  color: #404040;
-  margin: 1.6em 0 0.6em 0;
-  font-weight: 500;
-  clear: both;
-}
-
-.markdown h1 {
-  font-size: 28px;
-}
-
-.markdown h2 {
-  font-size: 22px;
-}
-
-.markdown h3 {
-  font-size: 16px;
-}
-
-.markdown h4 {
-  font-size: 14px;
-}
-
-.markdown h5 {
-  font-size: 12px;
-}
-
-.markdown h6 {
-  font-size: 12px;
-}
-
-.markdown hr {
-  height: 1px;
-  border: 0;
-  background: #e9e9e9;
-  margin: 16px 0;
-  clear: both;
-}
-
-.markdown p {
-  margin: 1em 0;
-}
-
-.markdown>p,
-.markdown>blockquote,
-.markdown>.highlight,
-.markdown>ol,
-.markdown>ul {
-  width: 80%;
-}
-
-.markdown ul>li {
-  list-style: circle;
-}
-
-.markdown>ul li,
-.markdown blockquote ul>li {
-  margin-left: 20px;
-  padding-left: 4px;
-}
-
-.markdown>ul li p,
-.markdown>ol li p {
-  margin: 0.6em 0;
-}
-
-.markdown ol>li {
-  list-style: decimal;
-}
-
-.markdown>ol li,
-.markdown blockquote ol>li {
-  margin-left: 20px;
-  padding-left: 4px;
-}
-
-.markdown code {
-  margin: 0 3px;
-  padding: 0 5px;
-  background: #eee;
-  border-radius: 3px;
-}
-
-.markdown strong,
-.markdown b {
-  font-weight: 600;
-}
-
-.markdown>table {
-  border-collapse: collapse;
-  border-spacing: 0px;
-  empty-cells: show;
-  border: 1px solid #e9e9e9;
-  width: 95%;
-  margin-bottom: 24px;
-}
-
-.markdown>table th {
-  white-space: nowrap;
-  color: #333;
-  font-weight: 600;
-}
-
-.markdown>table th,
-.markdown>table td {
-  border: 1px solid #e9e9e9;
-  padding: 8px 16px;
-  text-align: left;
-}
-
-.markdown>table th {
-  background: #F7F7F7;
-}
-
-.markdown blockquote {
-  font-size: 90%;
-  color: #999;
-  border-left: 4px solid #e9e9e9;
-  padding-left: 0.8em;
-  margin: 1em 0;
-}
-
-.markdown blockquote p {
-  margin: 0;
-}
-
-.markdown .anchor {
-  opacity: 0;
-  transition: opacity 0.3s ease;
-  margin-left: 8px;
-}
-
-.markdown .waiting {
-  color: #ccc;
-}
-
-.markdown h1:hover .anchor,
-.markdown h2:hover .anchor,
-.markdown h3:hover .anchor,
-.markdown h4:hover .anchor,
-.markdown h5:hover .anchor,
-.markdown h6:hover .anchor {
-  opacity: 1;
-  display: inline-block;
-}
-
-.markdown>br,
-.markdown>p>br {
-  clear: both;
-}
-
-
-.hljs {
-  display: block;
-  background: white;
-  padding: 0.5em;
-  color: #333333;
-  overflow-x: auto;
-}
-
-.hljs-comment,
-.hljs-meta {
-  color: #969896;
-}
-
-.hljs-string,
-.hljs-variable,
-.hljs-template-variable,
-.hljs-strong,
-.hljs-emphasis,
-.hljs-quote {
-  color: #df5000;
-}
-
-.hljs-keyword,
-.hljs-selector-tag,
-.hljs-type {
-  color: #a71d5d;
-}
-
-.hljs-literal,
-.hljs-symbol,
-.hljs-bullet,
-.hljs-attribute {
-  color: #0086b3;
-}
-
-.hljs-section,
-.hljs-name {
-  color: #63a35c;
-}
-
-.hljs-tag {
-  color: #333333;
-}
-
-.hljs-title,
-.hljs-attr,
-.hljs-selector-id,
-.hljs-selector-class,
-.hljs-selector-attr,
-.hljs-selector-pseudo {
-  color: #795da3;
-}
-
-.hljs-addition {
-  color: #55a532;
-  background-color: #eaffea;
-}
-
-.hljs-deletion {
-  color: #bd2c00;
-  background-color: #ffecec;
-}
-
-.hljs-link {
-  text-decoration: underline;
-}
-
-/* 代码高亮 */
-/* PrismJS 1.15.0
-https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
-/**
- * prism.js default theme for JavaScript, CSS and HTML
- * Based on dabblet (http://dabblet.com)
- * @author Lea Verou
- */
-code[class*="language-"],
-pre[class*="language-"] {
-  color: black;
-  background: none;
-  text-shadow: 0 1px white;
-  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
-  text-align: left;
-  white-space: pre;
-  word-spacing: normal;
-  word-break: normal;
-  word-wrap: normal;
-  line-height: 1.5;
-
-  -moz-tab-size: 4;
-  -o-tab-size: 4;
-  tab-size: 4;
-
-  -webkit-hyphens: none;
-  -moz-hyphens: none;
-  -ms-hyphens: none;
-  hyphens: none;
-}
-
-pre[class*="language-"]::-moz-selection,
-pre[class*="language-"] ::-moz-selection,
-code[class*="language-"]::-moz-selection,
-code[class*="language-"] ::-moz-selection {
-  text-shadow: none;
-  background: #b3d4fc;
-}
-
-pre[class*="language-"]::selection,
-pre[class*="language-"] ::selection,
-code[class*="language-"]::selection,
-code[class*="language-"] ::selection {
-  text-shadow: none;
-  background: #b3d4fc;
-}
-
-@media print {
-
-  code[class*="language-"],
-  pre[class*="language-"] {
-    text-shadow: none;
-  }
-}
-
-/* Code blocks */
-pre[class*="language-"] {
-  padding: 1em;
-  margin: .5em 0;
-  overflow: auto;
-}
-
-:not(pre)>code[class*="language-"],
-pre[class*="language-"] {
-  background: #f5f2f0;
-}
-
-/* Inline code */
-:not(pre)>code[class*="language-"] {
-  padding: .1em;
-  border-radius: .3em;
-  white-space: normal;
-}
-
-.token.comment,
-.token.prolog,
-.token.doctype,
-.token.cdata {
-  color: slategray;
-}
-
-.token.punctuation {
-  color: #999;
-}
-
-.namespace {
-  opacity: .7;
-}
-
-.token.property,
-.token.tag,
-.token.boolean,
-.token.number,
-.token.constant,
-.token.symbol,
-.token.deleted {
-  color: #905;
-}
-
-.token.selector,
-.token.attr-name,
-.token.string,
-.token.char,
-.token.builtin,
-.token.inserted {
-  color: #690;
-}
-
-.token.operator,
-.token.entity,
-.token.url,
-.language-css .token.string,
-.style .token.string {
-  color: #9a6e3a;
-  background: hsla(0, 0%, 100%, .5);
-}
-
-.token.atrule,
-.token.attr-value,
-.token.keyword {
-  color: #07a;
-}
-
-.token.function,
-.token.class-name {
-  color: #DD4A68;
-}
-
-.token.regex,
-.token.important,
-.token.variable {
-  color: #e90;
-}
-
-.token.important,
-.token.bold {
-  font-weight: bold;
-}
-
-.token.italic {
-  font-style: italic;
-}
-
-.token.entity {
-  cursor: help;
-}
diff --git a/src/assets/iconfont/demo_index.html b/src/assets/iconfont/demo_index.html
deleted file mode 100644
index c16b6a2..0000000
--- a/src/assets/iconfont/demo_index.html
+++ /dev/null
@@ -1,488 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8"/>
-  <title>iconfont Demo</title>
-  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
-  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
-  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
-  <link rel="stylesheet" href="demo.css">
-  <link rel="stylesheet" href="iconfont.css">
-  <script src="iconfont.js"></script>
-  <!-- jQuery -->
-  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
-  <!-- 代码高亮 -->
-  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
-  <style>
-    .main .logo {
-      margin-top: 0;
-      height: auto;
-    }
-
-    .main .logo a {
-      display: flex;
-      align-items: center;
-    }
-
-    .main .logo .sub-title {
-      margin-left: 0.5em;
-      font-size: 22px;
-      color: #fff;
-      background: linear-gradient(-45deg, #3967FF, #B500FE);
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
-    }
-  </style>
-</head>
-<body>
-  <div class="main">
-    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
-      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
-      
-    </a></h1>
-    <div class="nav-tabs">
-      <ul id="tabs" class="dib-box">
-        <li class="dib active"><span>Unicode</span></li>
-        <li class="dib"><span>Font class</span></li>
-        <li class="dib"><span>Symbol</span></li>
-      </ul>
-      
-      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3646564" target="_blank" class="nav-more">查看项目</a>
-      
-    </div>
-    <div class="tab-container">
-      <div class="content unicode" style="display: block;">
-          <ul class="icon_lists dib-box">
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe636;</span>
-                <div class="name">no.2</div>
-                <div class="code-name">&amp;#xe636;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe637;</span>
-                <div class="name">2</div>
-                <div class="code-name">&amp;#xe637;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe634;</span>
-                <div class="name">键盘</div>
-                <div class="code-name">&amp;#xe634;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe630;</span>
-                <div class="name">关闭</div>
-                <div class="code-name">&amp;#xe630;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe631;</span>
-                <div class="name">左</div>
-                <div class="code-name">&amp;#xe631;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe632;</span>
-                <div class="name">本架图书</div>
-                <div class="code-name">&amp;#xe632;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe633;</span>
-                <div class="name">热门</div>
-                <div class="code-name">&amp;#xe633;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe62f;</span>
-                <div class="name">右</div>
-                <div class="code-name">&amp;#xe62f;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe628;</span>
-                <div class="name">通知</div>
-                <div class="code-name">&amp;#xe628;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe629;</span>
-                <div class="name">no.3</div>
-                <div class="code-name">&amp;#xe629;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe62b;</span>
-                <div class="name">no.1</div>
-                <div class="code-name">&amp;#xe62b;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe62d;</span>
-                <div class="name">3</div>
-                <div class="code-name">&amp;#xe62d;</div>
-              </li>
-          
-            <li class="dib">
-              <span class="icon iconfont">&#xe62e;</span>
-                <div class="name">1</div>
-                <div class="code-name">&amp;#xe62e;</div>
-              </li>
-          
-          </ul>
-          <div class="article markdown">
-          <h2 id="unicode-">Unicode 引用</h2>
-          <hr>
-
-          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
-          <ul>
-            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
-            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
-          </ul>
-          <blockquote>
-            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
-          </blockquote>
-          <p>Unicode 使用步骤如下：</p>
-          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
-<pre><code class="language-css"
->@font-face {
-  font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1663379994606') format('woff2'),
-       url('iconfont.woff?t=1663379994606') format('woff'),
-       url('iconfont.ttf?t=1663379994606') format('truetype'),
-       url('iconfont.svg?t=1663379994606#iconfont') format('svg');
-}
-</code></pre>
-          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
-<pre><code class="language-css"
->.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 16px;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-</code></pre>
-          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
-<pre>
-<code class="language-html"
->&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
-</code></pre>
-          <blockquote>
-            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
-          </blockquote>
-          </div>
-      </div>
-      <div class="content font-class">
-        <ul class="icon_lists dib-box">
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-no21"></span>
-            <div class="name">
-              no.2
-            </div>
-            <div class="code-name">.icon-a-no21
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-21"></span>
-            <div class="name">
-              2
-            </div>
-            <div class="code-name">.icon-a-21
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-jianpan"></span>
-            <div class="name">
-              键盘
-            </div>
-            <div class="code-name">.icon-jianpan
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-guanbi"></span>
-            <div class="name">
-              关闭
-            </div>
-            <div class="code-name">.icon-guanbi
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-zuo"></span>
-            <div class="name">
-              左
-            </div>
-            <div class="code-name">.icon-zuo
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-benjiatushu"></span>
-            <div class="name">
-              本架图书
-            </div>
-            <div class="code-name">.icon-benjiatushu
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-remen"></span>
-            <div class="name">
-              热门
-            </div>
-            <div class="code-name">.icon-remen
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-you"></span>
-            <div class="name">
-              右
-            </div>
-            <div class="code-name">.icon-you
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-tongzhi"></span>
-            <div class="name">
-              通知
-            </div>
-            <div class="code-name">.icon-tongzhi
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-no3"></span>
-            <div class="name">
-              no.3
-            </div>
-            <div class="code-name">.icon-a-no3
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-no1"></span>
-            <div class="name">
-              no.1
-            </div>
-            <div class="code-name">.icon-a-no1
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-3"></span>
-            <div class="name">
-              3
-            </div>
-            <div class="code-name">.icon-a-3
-            </div>
-          </li>
-          
-          <li class="dib">
-            <span class="icon iconfont icon-a-1"></span>
-            <div class="name">
-              1
-            </div>
-            <div class="code-name">.icon-a-1
-            </div>
-          </li>
-          
-        </ul>
-        <div class="article markdown">
-        <h2 id="font-class-">font-class 引用</h2>
-        <hr>
-
-        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
-        <p>与 Unicode 使用方式相比，具有如下特点：</p>
-        <ul>
-          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
-          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
-        </ul>
-        <p>使用步骤如下：</p>
-        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
-<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
-</code></pre>
-        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
-<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
-</code></pre>
-        <blockquote>
-          <p>"
-            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
-        </blockquote>
-      </div>
-      </div>
-      <div class="content symbol">
-          <ul class="icon_lists dib-box">
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no21"></use>
-                </svg>
-                <div class="name">no.2</div>
-                <div class="code-name">#icon-a-no21</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-21"></use>
-                </svg>
-                <div class="name">2</div>
-                <div class="code-name">#icon-a-21</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-jianpan"></use>
-                </svg>
-                <div class="name">键盘</div>
-                <div class="code-name">#icon-jianpan</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-guanbi"></use>
-                </svg>
-                <div class="name">关闭</div>
-                <div class="code-name">#icon-guanbi</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-zuo"></use>
-                </svg>
-                <div class="name">左</div>
-                <div class="code-name">#icon-zuo</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-benjiatushu"></use>
-                </svg>
-                <div class="name">本架图书</div>
-                <div class="code-name">#icon-benjiatushu</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-remen"></use>
-                </svg>
-                <div class="name">热门</div>
-                <div class="code-name">#icon-remen</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-you"></use>
-                </svg>
-                <div class="name">右</div>
-                <div class="code-name">#icon-you</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-tongzhi"></use>
-                </svg>
-                <div class="name">通知</div>
-                <div class="code-name">#icon-tongzhi</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no3"></use>
-                </svg>
-                <div class="name">no.3</div>
-                <div class="code-name">#icon-a-no3</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no1"></use>
-                </svg>
-                <div class="name">no.1</div>
-                <div class="code-name">#icon-a-no1</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-3"></use>
-                </svg>
-                <div class="name">3</div>
-                <div class="code-name">#icon-a-3</div>
-            </li>
-          
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-1"></use>
-                </svg>
-                <div class="name">1</div>
-                <div class="code-name">#icon-a-1</div>
-            </li>
-          
-          </ul>
-          <div class="article markdown">
-          <h2 id="symbol-">Symbol 引用</h2>
-          <hr>
-
-          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
-            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
-          <ul>
-            <li>支持多色图标了，不再受单色限制。</li>
-            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
-            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
-            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
-          </ul>
-          <p>使用步骤如下：</p>
-          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
-<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
-</code></pre>
-          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
-<pre><code class="language-html">&lt;style&gt;
-.icon {
-  width: 1em;
-  height: 1em;
-  vertical-align: -0.15em;
-  fill: currentColor;
-  overflow: hidden;
-}
-&lt;/style&gt;
-</code></pre>
-          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
-<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
-  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
-&lt;/svg&gt;
-</code></pre>
-          </div>
-      </div>
-
-    </div>
-  </div>
-  <script>
-  $(document).ready(function () {
-      $('.tab-container .content:first').show()
-
-      $('#tabs li').click(function (e) {
-        var tabContent = $('.tab-container .content')
-        var index = $(this).index()
-
-        if ($(this).hasClass('active')) {
-          return
-        } else {
-          $('#tabs li').removeClass('active')
-          $(this).addClass('active')
-
-          tabContent.hide().eq(index).fadeIn()
-        }
-      })
-    })
-  </script>
-</body>
-</html>
diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index da42087..d958f1b 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -109,13 +109,16 @@
 .screen-main{
   display: flex;
   justify-content: space-between;
-  height: calc(100% - 91px);
+  height: calc(100% - 1.38rem);
   margin: 0.0625rem 0 0.5rem 0;
   padding: 0 0.325rem;
   overflow: hidden;
   .screen-left,
   .screen-right{
     width: 6.375rem;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
   }
   .screen-middle{
     flex: 1;
@@ -146,15 +149,15 @@
     height: 3.75rem;
   }
   .medium-module{
-    height: 4.125rem;
+    height: 4.25rem;
   }
   .big-module{
-    height: 6.8125rem;
-    // margin:0.1625rem 0;
+    // height: 6.8125rem;
   }
   
   //排行榜-推荐 - list
   .lending-ranking{
+    flex: 1;
     .module-content{
       padding: 0 0.25rem;
       overflow: hidden;
@@ -230,7 +233,7 @@
   // 视频
   .video-box{
     width: 100%;
-    height: 5.2125rem;
+    height: 5.15rem;
   }
 
   // 阅读之星
diff --git a/src/common/flexible.js b/src/common/flexible.js
index 92de84e..fdb9fa5 100644
--- a/src/common/flexible.js
+++ b/src/common/flexible.js
@@ -1,147 +1,147 @@
-(function(win, lib) {
-  var doc = win.document
-  var docEl = doc.documentElement
-  var metaEl = doc.querySelector('meta[name="viewport"]')
-  var flexibleEl = doc.querySelector('meta[name="flexible"]')
-  var dpr = 0
-  var scale = 0
-  var tid
-  var flexible = lib.flexible || (lib.flexible = {})
-
-  if (metaEl) {
-    console.warn('将根据已有的meta标签来设置缩放比例')
-    var match = metaEl
-      .getAttribute('content')
-      // eslint-disable-next-line no-useless-escape
-      .match(/initial\-scale=([\d\.]+)/)
-    if (match) {
-      scale = parseFloat(match[1])
-      dpr = parseInt(1 / scale)
-    }
-  } else if (flexibleEl) {
-    var content = flexibleEl.getAttribute('content')
-    if (content) {
-      // eslint-disable-next-line no-useless-escape
-      var initialDpr = content.match(/initial\-dpr=([\d\.]+)/)
-      // eslint-disable-next-line no-useless-escape
-      var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/)
-      if (initialDpr) {
-        dpr = parseFloat(initialDpr[1])
-        scale = parseFloat((1 / dpr).toFixed(2))
-      }
-      if (maximumDpr) {
-        dpr = parseFloat(maximumDpr[1])
-        scale = parseFloat((1 / dpr).toFixed(2))
-      }
-    }
-  }
-
-  if (!dpr && !scale) {
-    // eslint-disable-next-line no-unused-vars
-    var isAndroid = win.navigator.appVersion.match(/android/gi)
-    var isIPhone = win.navigator.appVersion.match(/iphone/gi)
-    var devicePixelRatio = win.devicePixelRatio
-    if (isIPhone) {
-      // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
-      if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
-        dpr = 3
-      } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
-        dpr = 2
-      } else {
-        dpr = 1
-      }
-    } else {
-      // 其他设备下，仍旧使用1倍的方案
-      dpr = 1
-    }
-    scale = 1 / dpr
-  }
-
-  docEl.setAttribute('data-dpr', dpr)
-  if (!metaEl) {
-    metaEl = doc.createElement('meta')
-    metaEl.setAttribute('name', 'viewport')
-    metaEl.setAttribute(
-      'content',
-      'initial-scale=' +
-        scale +
-        ', maximum-scale=' +
-        scale +
-        ', minimum-scale=' +
-        scale +
-        ', user-scalable=no'
-    )
-    if (docEl.firstElementChild) {
-      docEl.firstElementChild.appendChild(metaEl)
-    } else {
-      var wrap = doc.createElement('div')
-      wrap.appendChild(metaEl)
-      doc.write(wrap.innerHTML)
-    }
-  }
-
-  function refreshRem() {
-    var width = docEl.getBoundingClientRect().width
-    // 最小1366px，最大适配2560px
-    if (width / dpr < 1366) {
-      width = 1366 * dpr
-    } else if (width / dpr > 2560) {
-      width = 2560 * dpr
-    }
-    // 设置成24等份，设计稿时1920px的，这样1rem就是80px
-    var rem = width / 24
-    docEl.style.fontSize = rem + 'px'
-    flexible.rem = win.rem = rem
-  }
-
-  win.addEventListener(
-    'resize',
-    function() {
-      clearTimeout(tid)
-      tid = setTimeout(refreshRem, 300)
-    },
-    false
-  )
-  win.addEventListener(
-    'pageshow',
-    function(e) {
-      if (e.persisted) {
-        clearTimeout(tid)
-        tid = setTimeout(refreshRem, 300)
-      }
-    },
-    false
-  )
-
-  if (doc.readyState === 'complete') {
-    doc.body.style.fontSize = 12 * dpr + 'px'
-  } else {
-    doc.addEventListener(
-      'DOMContentLoaded',
-      // eslint-disable-next-line no-unused-vars
-      function(e) {
-        doc.body.style.fontSize = 12 * dpr + 'px'
-      },
-      false
-    )
-  }
-
-  refreshRem()
-
-  flexible.dpr = win.dpr = dpr
-  flexible.refreshRem = refreshRem
-  flexible.rem2px = function(d) {
-    var val = parseFloat(d) * this.rem
-    if (typeof d === 'string' && d.match(/rem$/)) {
-      val += 'px'
-    }
-    return val
-  }
-  flexible.px2rem = function(d) {
-    var val = parseFloat(d) / this.rem
-    if (typeof d === 'string' && d.match(/px$/)) {
-      val += 'rem'
-    }
-    return val
-  }
-})(window, window['lib'] || (window['lib'] = {}))
+(function(win, lib) {
+  var doc = win.document
+  var docEl = doc.documentElement
+  var metaEl = doc.querySelector('meta[name="viewport"]')
+  var flexibleEl = doc.querySelector('meta[name="flexible"]')
+  var dpr = 0
+  var scale = 0
+  var tid
+  var flexible = lib.flexible || (lib.flexible = {})
+
+  if (metaEl) {
+    console.warn('将根据已有的meta标签来设置缩放比例')
+    var match = metaEl
+      .getAttribute('content')
+      // eslint-disable-next-line no-useless-escape
+      .match(/initial\-scale=([\d\.]+)/)
+    if (match) {
+      scale = parseFloat(match[1])
+      dpr = parseInt(1 / scale)
+    }
+  } else if (flexibleEl) {
+    var content = flexibleEl.getAttribute('content')
+    if (content) {
+      // eslint-disable-next-line no-useless-escape
+      var initialDpr = content.match(/initial\-dpr=([\d\.]+)/)
+      // eslint-disable-next-line no-useless-escape
+      var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/)
+      if (initialDpr) {
+        dpr = parseFloat(initialDpr[1])
+        scale = parseFloat((1 / dpr).toFixed(2))
+      }
+      if (maximumDpr) {
+        dpr = parseFloat(maximumDpr[1])
+        scale = parseFloat((1 / dpr).toFixed(2))
+      }
+    }
+  }
+
+  if (!dpr && !scale) {
+    // eslint-disable-next-line no-unused-vars
+    var isAndroid = win.navigator.appVersion.match(/android/gi)
+    var isIPhone = win.navigator.appVersion.match(/iphone/gi)
+    var devicePixelRatio = win.devicePixelRatio
+    if (isIPhone) {
+      // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
+      if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
+        dpr = 3
+      } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
+        dpr = 2
+      } else {
+        dpr = 1
+      }
+    } else {
+      // 其他设备下，仍旧使用1倍的方案
+      dpr = 1
+    }
+    scale = 1 / dpr
+  }
+
+  docEl.setAttribute('data-dpr', dpr)
+  if (!metaEl) {
+    metaEl = doc.createElement('meta')
+    metaEl.setAttribute('name', 'viewport')
+    metaEl.setAttribute(
+      'content',
+      'initial-scale=' +
+        scale +
+        ', maximum-scale=' +
+        scale +
+        ', minimum-scale=' +
+        scale +
+        ', user-scalable=no'
+    )
+    if (docEl.firstElementChild) {
+      docEl.firstElementChild.appendChild(metaEl)
+    } else {
+      var wrap = doc.createElement('div')
+      wrap.appendChild(metaEl)
+      doc.write(wrap.innerHTML)
+    }
+  }
+
+  function refreshRem() {
+    var width = docEl.getBoundingClientRect().width
+    // 最小1366px，最大适配2560px
+    if (width / dpr < 1366) {
+      width = 1366 * dpr
+    } else if (width / dpr > 2560) {
+      width = 2560 * dpr
+    }
+    // 设置成24等份，设计稿时1920px的，这样1rem就是80px
+    var rem = width / 24
+    docEl.style.fontSize = rem + 'px'
+    flexible.rem = win.rem = rem
+  }
+
+  win.addEventListener(
+    'resize',
+    function() {
+      clearTimeout(tid)
+      tid = setTimeout(refreshRem, 300)
+    },
+    false
+  )
+  win.addEventListener(
+    'pageshow',
+    function(e) {
+      if (e.persisted) {
+        clearTimeout(tid)
+        tid = setTimeout(refreshRem, 300)
+      }
+    },
+    false
+  )
+
+  if (doc.readyState === 'complete') {
+    doc.body.style.fontSize = 12 * dpr + 'px'
+  } else {
+    doc.addEventListener(
+      'DOMContentLoaded',
+      // eslint-disable-next-line no-unused-vars
+      function(e) {
+        doc.body.style.fontSize = 12 * dpr + 'px'
+      },
+      false
+    )
+  }
+
+  refreshRem()
+
+  flexible.dpr = win.dpr = dpr
+  flexible.refreshRem = refreshRem
+  flexible.rem2px = function(d) {
+    var val = parseFloat(d) * this.rem
+    if (typeof d === 'string' && d.match(/rem$/)) {
+      val += 'px'
+    }
+    return val
+  }
+  flexible.px2rem = function(d) {
+    var val = parseFloat(d) / this.rem
+    if (typeof d === 'string' && d.match(/px$/)) {
+      val += 'rem'
+    }
+    return val
+  }
+})(window, window['lib'] || (window['lib'] = {}))
diff --git a/src/views/accessToLibrary/index.vue b/src/views/accessToLibrary/index.vue
index 59bf6ed..208aa94 100644
--- a/src/views/accessToLibrary/index.vue
+++ b/src/views/accessToLibrary/index.vue
@@ -64,6 +64,7 @@ export default {
   },
   methods: {
     getInitIntoNum() {
+      // http://192.168.99.118:8080/#/?doorCodes=D001&D002&D007&startTime=2023-01-01&endTime=2023-08-31
       // this.otherDoorOther = window.location.href.split('?')[1]?.split('=')[1]
       const currentURL = window.location.href
       console.log(currentURL)
@@ -96,12 +97,16 @@ export default {
       const startTime = this.$route.query.startTime
       const endTime = this.$route.query.endTime
 
+      console.log('otherDoorOther', this.otherDoorOther)
+
       if (this.otherDoorOther && this.otherDoorOther !== '' && this.otherDoorOther.indexOf('&')) {
         this.otherDoorOther = this.otherDoorOther.replace(/\&/g, '、')
       } else {
         this.otherDoorOther = null
       }
 
+      console.log('otherDoorOther2', this.otherDoorOther)
+
       let params
       if (!this.isSelfService) {
         params = {
diff --git a/src/views/index.vue b/src/views/index.vue
index b60ee37..8997b32 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,59 +1,135 @@
-<template>
-  <div id="screen-container">
-    <Header :header-title="headerTitle" />
-    <div class="screen-main">
-      <div class="screen-left">
-        <TotalLending />
-        <LengingRanking />
-      </div>
-      <div class="screen-middle">
-        <AccessToLibrary :is-self-service="false" />
-        <Video />
-        <ReadStar />
-      </div>
-      <div class="screen-right">
-        <Notice />
-        <NewBookRecommend />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import Header from '@/views/header/index.vue'
-import TotalLending from '@/views/totalLending/index.vue'
-import LengingRanking from '@/views/lengingRanking/index.vue'
-import AccessToLibrary from '@/views/accessToLibrary/index.vue'
-import Video from '@/views/video/index.vue'
-import Notice from '@/views/notice/index.vue'
-import NewBookRecommend from '@/views/newBookRecommend/index.vue'
-import ReadStar from '@/views/readStar/index.vue'
-export default {
-  name: 'Home',
-  components: {
-    Header,
-    TotalLending,
-    LengingRanking,
-    AccessToLibrary,
-    Video,
-    ReadStar,
-    Notice,
-    NewBookRecommend
-  },
-  data() {
-    return {
-      headerTitle: '东西湖区图书馆'
-    }
-  },
-  created() {
-  },
-  mounted() {
-  },
-  methods: {
-  }
-}
-</script>
-
-<style lang="scss">
-@import "~@/assets/styles/index.scss";
-</style>
+<template>
+  <div id="screen-container">
+    <Header :header-title="headerTitle" />
+    <div class="screen-main">
+      <div class="screen-left">
+        <TotalLending />
+        <LengingRanking
+          ref="rankingRef"
+          :container-height="rankingHeight"
+        />
+      </div>
+      <div class="screen-middle">
+        <AccessToLibrary :is-self-service="false" />
+        <Video />
+        <!-- ref="readStarRef"
+          :container-height="readStarHeight" -->
+        <ReadStar />
+      </div>
+      <div class="screen-right">
+        <Notice />
+        <NewBookRecommend
+          ref="newBookRef"
+          :container-height="newBookHeight"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Header from '@/views/header/index.vue'
+import TotalLending from '@/views/totalLending/index.vue'
+import LengingRanking from '@/views/lengingRanking/index.vue'
+import AccessToLibrary from '@/views/accessToLibrary/index.vue'
+import Video from '@/views/video/index.vue'
+import Notice from '@/views/notice/index.vue'
+import NewBookRecommend from '@/views/newBookRecommend/index.vue'
+import ReadStar from '@/views/readStar/index.vue'
+export default {
+  name: 'Home',
+  components: {
+    Header,
+    TotalLending,
+    LengingRanking,
+    AccessToLibrary,
+    Video,
+    ReadStar,
+    Notice,
+    NewBookRecommend
+  },
+  data() {
+    return {
+      headerTitle: '东西湖区图书馆',
+      newBookHeight: 0, // 存储新书推荐模块的高度
+      rankingHeight: 0,
+      readStarHeight: 0
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight()
+      this.calcReadStarHeight() // 新增：计算阅读之星高度
+    })
+    window.addEventListener('resize', () => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight()
+      this.calcReadStarHeight() // 新增：窗口变化时重新计算
+    })
+  },
+  beforeDestroy() {
+    // 修复：移除监听时要使用同一个函数引用（否则移除无效）
+    const resizeHandler = () => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight()
+      this.calcReadStarHeight()
+    }
+    window.removeEventListener('resize', resizeHandler)
+  },
+  methods: {
+    calcRankingHeight() {
+      if (this.$refs.rankingRef) {
+        const rankingEl = this.$refs.rankingRef.$el
+        if (rankingEl) {
+          const totalHeight = rankingEl.clientHeight
+          const titleEl = rankingEl.querySelector('.common-title')
+          const titleHeight = titleEl ? titleEl.clientHeight : 0.475 * 16
+          this.rankingHeight = totalHeight - titleHeight
+          if (this.$refs.rankingRef.updateHeight) {
+            this.$refs.rankingRef.updateHeight(this.rankingHeight)
+          }
+        }
+      }
+    },
+    calcNewBookHeight() {
+      if (this.$refs.newBookRef) {
+        const newBookEl = this.$refs.newBookRef.$el
+        if (newBookEl) {
+          const totalHeight = newBookEl.clientHeight
+          const titleEl = newBookEl.querySelector('.common-title')
+          const titleHeight = titleEl ? titleEl.clientHeight : 0.475 * 16
+          this.newBookHeight = totalHeight - titleHeight
+          if (this.$refs.newBookRef.updateHeight) {
+            this.$refs.newBookRef.updateHeight(this.newBookHeight)
+          }
+        }
+      }
+    },
+    // 新增：计算阅读之星高度
+    calcReadStarHeight() {
+      if (this.$refs.readStarRef) {
+        const readStarEl = this.$refs.readStarRef.$el
+        if (readStarEl) {
+          // 获取总高度 - 标题栏高度
+          const totalHeight = readStarEl.clientHeight
+          const titleEl = readStarEl.querySelector('.common-title')
+          const titleHeight = titleEl ? titleEl.clientHeight : 0.475 * 16
+          this.readStarHeight = totalHeight - titleHeight
+
+          // 通知子组件更新
+          if (this.$refs.readStarRef.updateHeight) {
+            this.$refs.readStarRef.updateHeight(this.readStarHeight)
+          }
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+@import "~@/assets/styles/index.scss";
+</style>
diff --git a/src/views/indexSelfService.vue b/src/views/indexSelfService.vue
index a081252..3c4737e 100644
--- a/src/views/indexSelfService.vue
+++ b/src/views/indexSelfService.vue
@@ -4,7 +4,10 @@
     <div class="screen-main">
       <div class="screen-left">
         <TodayBorrowed />
-        <LengingRanking />
+        <LengingRanking
+          ref="rankingRef"
+          :container-height="rankingHeight"
+        />
       </div>
       <div class="screen-middle">
         <AccessToLibrary :is-self-service="true" />
@@ -13,7 +16,10 @@
       </div>
       <div class="screen-right">
         <Notice />
-        <NewBookRecommend />
+        <NewBookRecommend
+          ref="newBookRef"
+          :container-height="newBookHeight"
+        />
       </div>
     </div>
   </div>
@@ -42,14 +48,70 @@ export default {
   },
   data() {
     return {
-      headerTitle: '问渠书房'
+      headerTitle: '问渠书房',
+      newBookHeight: 0, // 存储新书推荐模块的高度
+      rankingHeight: 0
     }
   },
   created() {
   },
   mounted() {
+    this.$nextTick(() => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight() // 新增：计算排行榜高度
+    })
+    window.addEventListener('resize', () => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight() // 新增：窗口变化时重新计算
+    })
+  },
+  beforeDestroy() {
+    window.removeEventListener('resize', () => {
+      this.calcNewBookHeight()
+      this.calcRankingHeight()
+    })
   },
   methods: {
+    // 借阅排行榜的高度计算
+    calcRankingHeight() {
+      if (this.$refs.rankingRef) {
+        const rankingEl = this.$refs.rankingRef.$el
+        if (rankingEl) {
+          // 获取总高度 - 标题栏高度
+          const totalHeight = rankingEl.clientHeight
+          const titleEl = rankingEl.querySelector('.common-title')
+          const titleHeight = titleEl ? titleEl.clientHeight : 0.475 * 16
+          this.rankingHeight = totalHeight - titleHeight
+
+          // 通知子组件更新
+          if (this.$refs.rankingRef.updateHeight) {
+            this.$refs.rankingRef.updateHeight(this.rankingHeight)
+          }
+        }
+      }
+    },
+    // 新书推荐模块的实际高度
+    calcNewBookHeight() {
+      if (this.$refs.newBookRef) {
+        const newBookEl = this.$refs.newBookRef.$el
+        if (newBookEl) {
+          const totalHeight = newBookEl.clientHeight
+          const titleEl = newBookEl.querySelector('.common-title')
+          const titleHeight = titleEl ? titleEl.clientHeight : 0.475 * 16 // 备用值，对应0.475rem
+
+          // 计算内容区域高度 = 总高度 - 标题高度
+          // 这里的计算要适配rem单位，也可以直接用像素计算
+          this.newBookHeight = totalHeight - titleHeight
+
+          console.log('新书推荐模块高度：', this.newBookHeight)
+
+          // 通知子组件更新（保险措施）
+          if (this.$refs.newBookRef.updateHeight) {
+            this.$refs.newBookRef.updateHeight(this.newBookHeight)
+          }
+        }
+      }
+    }
   }
 }
 </script>
diff --git a/src/views/lengingRanking/index-old.vue b/src/views/lengingRanking/index-old.vue
new file mode 100644
index 0000000..5329b3c
--- /dev/null
+++ b/src/views/lengingRanking/index-old.vue
@@ -0,0 +1,104 @@
+<template>
+  <!-- 借阅排行榜 -->
+  <div class="screen-item lending-ranking">
+    <div class="common-title">借阅排行榜</div>
+    <vue-seamless-scroll
+      ref="listData"
+      :data="rankingList"
+      :class-option="defaultOption"
+      class="big-module module-content"
+    >
+      <div
+        v-for="(item, index) in rankingList"
+        :key="index"
+        class="book-list-item"
+      >
+        <div class="book-img">
+          <img :src="item.cover" :onerror="defaultImg">
+        </div>
+        <div class="book-info">
+          <h4 class="title-item">{{ item.bookName }}</h4>
+          <p>{{ item.author }}</p>
+        </div>
+        <div class="ranking-num">
+          <svg v-if="index === 0" class="icon" aria-hidden="true">
+            <use xlink:href="#icon-a-no1" />
+          </svg>
+          <svg v-if="index === 1" class="icon" aria-hidden="true">
+            <use xlink:href="#icon-a-no21" />
+          </svg>
+          <svg v-if="index === 2" class="icon" aria-hidden="true">
+            <use xlink:href="#icon-a-no3" />
+          </svg>
+          <p>NO.{{ index + 1 }}</p>
+        </div>
+      </div>
+    </vue-seamless-scroll>
+  </div>
+</template>
+
+<script>
+import { FetchBorrowRank, FetchCoverByISBN } from '@/api/library'
+
+export default {
+  name: 'LengingRanking',
+  data() {
+    return {
+      defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"',
+      rankingList: []
+    }
+  },
+  computed: {
+    defaultOption() {
+      return {
+        step: 1.1, // 滚动的速度
+        hoverStop: false, // 是否开启鼠标悬停stop
+        singleHeight: 102, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        openWatch: true,
+        waitTime: 2000 // 单步运动停止的时间(默认值1000ms)
+      }
+    }
+  },
+  created() {
+    this.getBorrowRank()
+  },
+  mounted() {
+  },
+  methods: {
+    getBorrowRank() {
+      FetchBorrowRank().then((res) => {
+        if (res.errCode === 0) {
+          let data = []
+          data = res.data
+          data.forEach(item => {
+            this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item)
+          })
+        } else {
+          this.$message.error('接口错误')
+        }
+      })
+    },
+    getCoverByISBN(isbn, item) {
+      const params = {
+        isbn: isbn
+      }
+      FetchCoverByISBN(params).then((res) => {
+        console.log('RES', res)
+        if (res) {
+          // item.cover = window.URL.createObjectURL(res)
+          item.cover = res
+        } else {
+          item.cover = ''
+        }
+        console.log(item.cover)
+        this.rankingList.push(item)
+        this.$refs.listData.reset()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+@import '~@/assets/styles/index.scss';
+</style>
diff --git a/src/views/lengingRanking/index.vue b/src/views/lengingRanking/index.vue
index 5329b3c..6127dfc 100644
--- a/src/views/lengingRanking/index.vue
+++ b/src/views/lengingRanking/index.vue
@@ -7,6 +7,7 @@
       :data="rankingList"
       :class-option="defaultOption"
       class="big-module module-content"
+      :style="{ height: containerHeight + 'px' }"
     >
       <div
         v-for="(item, index) in rankingList"
@@ -42,6 +43,12 @@ import { FetchBorrowRank, FetchCoverByISBN } from '@/api/library'
 
 export default {
   name: 'LengingRanking',
+  props: {
+    containerHeight: {
+      type: Number,
+      default: 0
+    }
+  },
   data() {
     return {
       defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"',
@@ -55,7 +62,22 @@ export default {
         hoverStop: false, // 是否开启鼠标悬停stop
         singleHeight: 102, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
         openWatch: true,
-        waitTime: 2000 // 单步运动停止的时间(默认值1000ms)
+        waitTime: 2000, // 单步运动停止的时间(默认值1000ms)
+        scrollHeight: 0
+      }
+    }
+  },
+  watch: {
+    // 监听父组件高度变化
+    containerHeight(newVal) {
+      if (newVal > 0) {
+        this.scrollHeight = newVal
+        this.calcDynamicSize() // 重新计算动态尺寸
+        this.$nextTick(() => {
+          if (this.$refs.listData) {
+            this.$refs.listData.reset() // 重置滚动组件
+          }
+        })
       }
     }
   },
@@ -63,36 +85,82 @@ export default {
     this.getBorrowRank()
   },
   mounted() {
+    if (this.containerHeight > 0) {
+      this.scrollHeight = this.containerHeight
+      this.calcDynamicSize()
+    }
   },
   methods: {
+    updateHeight(height) {
+      this.scrollHeight = height
+      this.calcDynamicSize()
+      this.$nextTick(() => {
+        if (this.$refs.listData) {
+          this.$refs.listData.reset()
+        }
+      })
+    },
+    calcDynamicSize() {
+      // 容器高度转rem（假设1rem=100px）
+      const containerRem = this.scrollHeight / 100 || 6.8125
+
+      // 单行高度 = 容器高度的 15%（可调整比例）
+      this.itemHeight = Math.floor(this.scrollHeight * 0.15) || 102
+
+      // 封面尺寸：按容器高度比例计算
+      this.imgWidth = containerRem * 0.12 // 12%
+      this.imgHeight = this.imgWidth * 1.304 // 保持原有比例 1.075/0.825 ≈ 1.304
+      this.imgMargin = containerRem * 0.05 // 5%
+
+      // 文字尺寸：按容器高度比例计算
+      this.textFontSize = containerRem * 0.028 // 2.8%
+      this.titleFontSize = containerRem * 0.035 // 3.5%
+      this.authorFontSize = containerRem * 0.028 // 2.8%
+      this.numFontSize = containerRem * 0.028 // 2.8%
+
+      // 排名图标尺寸
+      this.iconSize = containerRem * 0.08 // 8%
+    },
     getBorrowRank() {
       FetchBorrowRank().then((res) => {
         if (res.errCode === 0) {
-          let data = []
-          data = res.data
-          data.forEach(item => {
-            this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item)
+          const data = res.data || []
+          // 清空原有数据，避免重复
+          this.rankingList = []
+          // 批量处理封面
+          const coverPromises = data.map(item => {
+            const isbn = item.isbn.replace(/\-/g, '')
+            return this.getCoverByISBN(isbn, item)
+          })
+          // 所有封面加载完成后更新列表
+          Promise.all(coverPromises).then(() => {
+            this.$nextTick(() => {
+              if (this.$refs.listData) {
+                this.$refs.listData.reset()
+              }
+            })
           })
         } else {
           this.$message.error('接口错误')
         }
+      }).catch(err => {
+        console.error('获取借阅排行失败', err)
+        this.$message.error('获取借阅排行失败')
       })
     },
+    // 重构：返回Promise，方便批量处理
     getCoverByISBN(isbn, item) {
-      const params = {
-        isbn: isbn
-      }
-      FetchCoverByISBN(params).then((res) => {
-        console.log('RES', res)
-        if (res) {
-          // item.cover = window.URL.createObjectURL(res)
-          item.cover = res
-        } else {
+      return new Promise((resolve) => {
+        const params = { isbn }
+        FetchCoverByISBN(params).then((res) => {
+          item.cover = res || ''
+          this.rankingList.push(item)
+          resolve()
+        }).catch(() => {
           item.cover = ''
-        }
-        console.log(item.cover)
-        this.rankingList.push(item)
-        this.$refs.listData.reset()
+          this.rankingList.push(item)
+          resolve()
+        })
       })
     }
   }
diff --git a/src/views/newBookRecommend/data.json b/src/views/newBookRecommend/data.json
index 2e496fe..02a7e2a 100644
--- a/src/views/newBookRecommend/data.json
+++ b/src/views/newBookRecommend/data.json
@@ -1,648 +1,375 @@
-[
-  {
-      "nbId": "2c9680978e7f2e4f018ea185d9ba0022",
-      "libcode": "1201",
-      "nbName": "海错图笔记",
-      "nbExplain": "这本书是一套多元解读清代海洋生物图谱《海错图》的科普书，以博物达人的视角，从生物学，博物学及生活美学等角度，讲述中国丰富的海洋及滨海生物，植物和风土人情。孩子读了这本书，可谓是一次酣畅痛快的海洋及滨海生物物种解密，更是一次精彩的古今博物达人思维碰撞。",
-      "createTime": "2024-04-03T01:14:47.610+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:14:47.610+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "张辰亮著",
-      "nbBooktype": "图书",
-      "sortmark": "Q178.53/12",
-      "isbn": "978-7-5217-2277-2",
-      "nbPublisher": " 中信出版集团股份有限公司",
-      "nbPublisherdate": "2020",
-      "nbRecno": "12"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c231b555f18ae",
-      "libcode": "1201",
-      "nbName": "费曼经典",
-      "nbExplain": "本书是著名物理学家理查德·费曼最负盛名的自述回忆录合集, 这些文章大致按时间顺序分为8个部分, 展现费曼的精彩一生: 从法洛克威小镇的好奇少年到麻省理工新生, 在普林斯顿大学那些年, 与爱妻阿琳的恋情, 与曼哈顿计划和原子弹, 任教康奈尔大学和加州理工学院, 到巴西感受拉美风情, 到华盛顿调查航天飞机事故……费曼以坦率的口吻讲述了他的所有冒险。作为费曼的好友, 编者拉尔夫·莱顿为本书增加了注释, 这些着意补充的细节为费曼的叙述增添了别样的色彩; 同时收录包括费曼的照片、绘画作品、手稿在内的的30多张图片。此外, 本书还特别收录著名物理学家、数学家弗里曼·戴森所作的前言, 并以知名演员、导演艾伦·艾尔达在加州理工学院毕业庆典上的演讲作为后记, 为这本精彩的自述辅以他人视角, 更能让读者看见一个完整的、活生生的费曼。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:13:22.543+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": " (美) 理查德·P. 费曼著 , (美) 拉尔夫·莱顿编",
-      "nbBooktype": "图书",
-      "sortmark": "K837.126.11/4",
-      "isbn": "978-7-5596-6127-2",
-      "nbPublisher": " 北京联合出版公司",
-      "nbPublisherdate": "2022",
-      "nbRecno": "69"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c23197f6f18ad",
-      "libcode": "1201",
-      "nbName": "杰克之书",
-      "nbExplain": "本书讲述了杰克·凯鲁亚克的故事，全书共分六章，内容包括：小镇、城市、路、重访城市、大瑟尔、阴郁的书式电影。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:13:14.273+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(美)巴里·吉福德(Barry, Gifford)，(美)劳伦斯·李(Lawrence, Lee)著",
-      "nbBooktype": "图书",
-      "sortmark": "K837.125/33",
-      "isbn": "978-7-305-25073-6",
-      "nbPublisher": "南京大学出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "70"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c231858d818ac",
-      "libcode": "1201",
-      "nbName": "一百年, 许多人, 许多事 ",
-      "nbExplain": "本书内容包括: 家族旧事、中西十年、从联大到中大 (上下) 四章。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:13:05.490+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "杨苡口述 , 余斌撰写",
-      "nbBooktype": "图书",
-      "sortmark": "K825.6/332",
-      "isbn": "978-7-5447-9274-5 ",
-      "nbPublisher": "译林出版社",
-      "nbPublisherdate": "2023",
-      "nbRecno": "71"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2316895518ab",
-      "libcode": "1201",
-      "nbName": "漫威先生",
-      "nbExplain": "本书从斯坦李在罗马尼亚的家族讲起，一直延伸到他在洛杉矶的临终时刻。本书既忠实地记录了斯坦·李戏剧性的成功，也记录了他人生中悲剧性的失败。本书作者亚伯拉罕·里斯曼进行了150多次采访，查阅了数千页私人文件，发掘出斯坦·李从未公开过的工作和生活信息。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:56.080+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(美)亚伯拉罕·里斯曼(Abraham Riesman)著",
-      "nbBooktype": "图书",
-      "sortmark": "K837.125.78=6/5",
-      "isbn": "978-7-5001-6919-2",
-      "nbPublisher": " 中译出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "72"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2315547818aa",
-      "libcode": "1201",
-      "nbName": "如何屠龙",
-      "nbExplain": "本书内容: 出生在小村庄的你突然被选中去屠龙, 这让你不知所措? 别担心, 这本“传说级”秘籍会手把手教你通关真实的中世纪! 你需要选择适合战斗的装备、学点儿防身的技巧, 再找到一位适合你的导师。你得学会在冒险途中解决自己的食宿问题, 但还得时刻提防狡猾的骗子和凶狠的强盗。你可以在酒馆里和看不惯的家伙打一架, 但记得别和迷人的酒馆女招待走得太近。你必须在漫长的寒冬中活下来, 但也要在火灾发生时伸出援手。你应该看得懂敌军来袭时烽火台上的信号, 也该清楚凯旋后如何招待来为你庆贺的热情宾客。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:48.097+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "史蒂文森",
-      "nbBooktype": "图书",
-      "sortmark": "K109/179",
-      "isbn": "978-7-5596-6868-4",
-      "nbPublisher": " 北京联合出版公司",
-      "nbPublisherdate": "2023",
-      "nbRecno": "73"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c23121a1b18a9",
-      "libcode": "1201",
-      "nbName": "我的艺术生活",
-      "nbExplain": "本书内容包括“艺术的童年时代”、“艺术的青少年时代”、“艺术的成年时期”三个部分，记述了作者从童年到成年所经历的生活和艺术的发展历程。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:39.867+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(苏联)斯坦尼斯拉夫斯基著 , 瞿白音译",
-      "nbBooktype": "图书",
-      "sortmark": "K835.12/40",
-      "isbn": "978-7-5327-9119-4",
-      "nbPublisher": "上海译文出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "74"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2310292f18a8",
-      "libcode": "1201",
-      "nbName": "稻盛和夫如是说",
-      "nbExplain": "本书收录了整整半个世纪内，即从20世纪70年代开始至21世纪10年代为止，对稻盛合夫先生的采访，以及他的独白记述。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:30.210+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(日)稻盛和夫口述 , 曹岫云，张凯译",
-      "nbBooktype": "图书",
-      "sortmark": "K833.13/28",
-      "isbn": "978-7-111-70571-0",
-      "nbPublisher": "机械工业出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "75"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c230de31218a7",
-      "libcode": "1201",
-      "nbName": "布匿战争",
-      "nbExplain": "公元前3世纪, 罗马和迦太基展开了对两国之间的战略要地--西西里岛的争夺, 布匿战争的序幕由此拉开。在接下来的百余年里, 双方把战场扩大到了非洲、西班牙、意大利, 展开了改变古代地中海地区政治格局的三场宏大战争。许多军事史的经典篇章在此期间诞生--从汉尼拔率领十万大军翻越阿尔卑斯山、通过坎尼一役把罗马推到毁灭的边缘, 再到西庇阿在扎马之战大挫汉尼拔……布匿战争最后以迦太基屹立了三百多年的帝国在公元前146年的覆灭告终。布匿战争是西方历史的转折点, 如果罗马战败, 那么罗马帝国在接下来的两千年里对欧洲乃至整个世界造成的政治、语言、法律等方面的影响可能会小得多, 甚至罗马帝国可能根本不会出现。《布匿战争》兼具可读性和学术严谨性, 生动地呈现了这场战争, 也讨论了它深远的影响。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:22.193+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(英) 阿德里安·戈兹沃西著 , 李小迟译",
-      "nbBooktype": "图书",
-      "sortmark": "K126/31",
-      "isbn": "978-7-5570-2623-3 ",
-      "nbPublisher": " 广东旅游出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "76"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c230b113118a6",
-      "libcode": "1201",
-      "nbName": "好手艺",
-      "nbExplain": "\t本书集合了多部清朝时期中国广州一带画师所绘的外销画册，结合大量传世文献收录、介绍了农耕、造纸、制茶及贸易、纺织、制漆、瓷器制造及贸易、玻璃制作等与生活息息相关，且富有中国特色的传统手工艺制作流程，展示了当时中国社会生活与匠人精神，从侧面探寻了这股奔涌的“中国潮”，在文化生活与哲学思想方面，是如何影响席卷西方世界的。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:14.153+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "侯印国著",
-      "nbBooktype": "图书",
-      "sortmark": "J52/4",
-      "isbn": "978-7-5168-3295-0 ",
-      "nbPublisher": " 台海出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "77"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2309c9fb18a5",
-      "libcode": "1201",
-      "nbName": "最后的礼物",
-      "nbExplain": "本书延续了移民主题, 但与前几部小说不同的是, 它聚焦于移民经历对移民自己及其后代的影响。主人公是63岁的非洲裔英国工程师阿巴斯, 43年前, 他从桑给巴尔来到英国, 认识了混血妻子马莉亚姆。多年来, 阿巴斯对自己到英国前的经历一直守口如瓶。小说开场时, 阿巴斯因糖尿病引发中风, 担心自己不久于人世, 把自己的秘密作为“最后的礼物”以碎片式的回忆方式告诉了家人。作为在英国长大的移民后代, 儿子贾马尔因自己的肤色难以被英国社会完全接受, 找不到归属感; 女儿汉娜 (Hanna) 把自己的名字改为安娜 (Anna), 在各方面努力把自己改造成一个英国人, 但其白人男友尼克的家人和亲友依然自恃种族优越, 对其冷嘲热讽, 羞辱责难。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:12:06.730+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(英) 阿卜杜勒拉扎克·古尔纳著 , 宋佥译",
-      "nbBooktype": "图书",
-      "sortmark": "I561.45/970",
-      "isbn": "978-7-5327-9088-3 ",
-      "nbPublisher": "上海译文出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "78"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2308c09218a4",
-      "libcode": "1201",
-      "nbName": "里山异兽谭",
-      "nbExplain": "本书是与《远野物语》齐名的日本民俗文学经典, 为日本民俗学家、画家早川孝太郎的经典作品。最早出版于一九二六年, 收录了日本三河、横山等地区的老猎人等所讲述山野中出没的野兽的故事, 主要以野猪, 鹿和狸猫的轶事为主, 既有猎人山民的口头故事, 比如猎人射杀了超过90贯重的大野猪的故事、母鹿被杀死后跟来的小鹿的故事、在村庄发生的可疑事件怀疑是狸猫的恶作剧……又有流传甚广的民间传说, 诸如净琉璃姬与鹿、狸猫所变的文釜茶壶等, 还有民俗掌故等组成的独特的传统世界, 以取自日常生活的鲜活表达加上作者精心的文字加工而形成的民俗学经典作品, 文体简洁, 内容醇厚, 长期以来受到众多作家和文学爱好者的喜爱, 周作人、 芥川龙之介、柳田国男等人都对其有高度评价。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:59.067+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": " (日) 早川孝太郎著 , 熊韵译",
-      "nbBooktype": "图书",
-      "sortmark": "I313.45/1207",
-      "isbn": "978-7-5327-9043-2",
-      "nbPublisher": " 上海译文出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "79"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2307b15218a3",
-      "libcode": "1201",
-      "nbName": "雏菊人生",
-      "nbExplain": "中篇小说 日本 现代",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:50.320+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(日)吉本芭娜娜著 , (日)奈良美智绘",
-      "nbBooktype": "图书",
-      "sortmark": "I313.45/1206",
-      "isbn": "978-7-5327-9157-6 ",
-      "nbPublisher": "上海译文出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "80"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c23060fc018a2",
-      "libcode": "1201",
-      "nbName": "像绅士淑女一样服务",
-      "nbExplain": "本书作者分享了丽思卡尔顿赖以生存的管理秘诀, 讲述了他在对待客户服务、员工激励和领导力构建三个方面的思考与智慧。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:41.960+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(美) 霍斯特·舒尔茨, 迪恩·梅里尔著 , 鲁仕齐译",
-      "nbBooktype": "图书",
-      "sortmark": "F274/145",
-      "isbn": "978-7-111-70377-8",
-      "nbPublisher": "机械工业出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "81"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c2304ed0118a1",
-      "libcode": "1201",
-      "nbName": "非自然死亡",
-      "nbExplain": "本书记录了作者理查德·谢泼德执业至今所经手的国际要案，从“9·11”事件、巴厘岛爆炸案、伦敦七七爆炸案，到亨格福德连环杀人案、戴安娜王妃车祸案等，讲述了案件背后不为人知的关键细节。书中还呈现了一些颇受争议的案件的始末，例如杀婴、种族主义谋杀、伪装成正当防卫的谋杀等。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:34.073+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(英)理查德·谢泼德(Richard Shepherd)著 , 李立丰译",
-      "nbBooktype": "图书",
-      "sortmark": "D919.1/3",
-      "isbn": "978-7-5447-8927-1",
-      "nbPublisher": " 译林出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "82"
-  },
-  {
-      "nbId": "2c9680978a8dea18018b743e352d1837",
-      "libcode": "1201",
-      "nbName": "博物馆奇妙夜",
-      "nbExplain": "今天是梅森的生日，梅森选择在他喜欢的地方——博物馆，举办生日party……",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:17.807+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(美)卡伦·勒弗拉克著",
-      "nbBooktype": "少儿图书",
-      "sortmark": "I712.85/717",
-      "isbn": " 978-7-5143-7459-9",
-      "nbPublisher": " 现代出版社",
-      "nbPublisherdate": "2020",
-      "nbRecno": "84"
-  },
-  {
-      "nbId": "2c9680978a8dea18018b743bb92b1836",
-      "libcode": "1201",
-      "nbName": "特殊的任务",
-      "nbExplain": "特种兵学校的地理课告一段落了，因为猛虎小队和飞禽小队的队员们要和两位教官一起去热带雨林中执行一项重要的保密任务。这项保密任务队员们打探了一路也没能从教官们的口中得知。但是在任务执行过程中他们却学到了很多新的地理知识，而且这些地理知识还帮了他们大忙。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:09.993+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "八路,张博涵著",
-      "nbBooktype": "少儿图书",
-      "sortmark": "I287.47/418",
-      "isbn": "978-7-5595-4587-9",
-      "nbPublisher": "河北少年儿童出版社",
-      "nbPublisherdate": "2021",
-      "nbRecno": "85"
-  },
-  {
-      "nbId": "2c9680978a8dea18018b7435497c1834",
-      "libcode": "1201",
-      "nbName": "偷偷藏不住",
-      "nbExplain": "七年前，也有这么一天。她穿着干净的裙子，站在穿着学士服的段嘉许旁边，因为再次见到他而感到开心，又因为即将的离别而觉得难过至极。她笨拙地藏着自己的心思，不敢让任何人发现，无论是她多亲密的人。她想象着，未来有一天一定要到他的身边去。那个时候的桑稚一定没有想过，七年后，她所想象的这么一天真的到来了。如她所愿。桑稚真的成了段嘉许身边的那个人。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:11:01.777+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "竹已著",
-      "nbBooktype": "图书",
-      "sortmark": "I247.57/6312:2",
-      "isbn": "978-7-5552-8529-8",
-      "nbPublisher": "青岛出版社",
-      "nbPublisherdate": "2020",
-      "nbRecno": "86"
-  },
-  {
-      "nbId": "2c9680978a8dea18018b743074351833",
-      "libcode": "1201",
-      "nbName": "妈妈的勇气：引导孩子找到自己",
-      "nbExplain": "本书是剑桥妈妈&职业女性精英大赛冠军刘红燕写给中国父母的0-18岁系统养育指南。作者手把手教你破解二宝、早教、择校、写作业、亲子沟通、金钱教育、艺术教育、性教育、留学等0-18岁孩子的养育难题, 学完就能解决。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:10:49.990+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "刘红燕著",
-      "nbBooktype": "图书",
-      "sortmark": "G782/243",
-      "isbn": "978-7-5713-1430-9",
-      "nbPublisher": "江苏凤凰科学技术出版社",
-      "nbPublisherdate": "2021",
-      "nbRecno": "87"
-  },
-  {
-      "nbId": "2c908097837879e801837890167c0001",
-      "libcode": "1201",
-      "nbName": "2020中国年度散文诗精选",
-      "nbExplain": "",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:10:07.787+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "龚学敏 、 周庆荣",
-      "nbBooktype": "图书",
-      "sortmark": "I",
-      "isbn": "9787546428024",
-      "nbPublisher": "成都时代出版社",
-      "nbPublisherdate": "2021",
-      "nbRecno": "91"
-  },
-  {
-      "nbId": "2c908097837879e801837891699a0002",
-      "libcode": "1201",
-      "nbName": "宇宙之谜",
-      "nbExplain": "",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:09:59.337+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(德)恩斯特·海克尔",
-      "nbBooktype": "图书",
-      "sortmark": "G",
-      "isbn": "9787301313992",
-      "nbPublisher": "北京大学出版社",
-      "nbPublisherdate": "2020",
-      "nbRecno": "92"
-  },
-  {
-      "nbId": "2c908097837879e8018378922bb60003",
-      "libcode": "1201",
-      "nbName": "让科学发声--首都科学讲堂2020年集萃",
-      "nbExplain": "",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:09:40.317+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "马林",
-      "nbBooktype": "图书",
-      "sortmark": "P",
-      "isbn": "9787113283797",
-      "nbPublisher": "中国铁道出版社 ",
-      "nbPublisherdate": "2021",
-      "nbRecno": "93"
-  },
-  {
-      "nbId": "2c908097837879e8018378931a270004",
-      "libcode": "1201",
-      "nbName": "习近平在福州[专著]",
-      "nbExplain": "",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:09:26.873+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "中央党校采访实录编辑室著",
-      "nbBooktype": "图书",
-      "sortmark": "94",
-      "isbn": "9787503568404",
-      "nbPublisher": "中共中央党校出版社 ",
-      "nbPublisherdate": "2020",
-      "nbRecno": "0"
-  },
-  {
-      "nbId": "2c9680978c433d11018d2afeaa9a2358",
-      "libcode": "1201",
-      "nbName": "读书与藏书",
-      "nbExplain": "\t本书收录作者探访27为文化名家书房，听书房主人畅叙个人阅读经历，阐说读书观与藏书观的访谈录。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:09:04.050+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "绿茶",
-      "nbBooktype": "图书",
-      "sortmark": "K825.41=76/5",
-      "isbn": "978-7-5596-6736-6",
-      "nbPublisher": "北京联合出版公司",
-      "nbPublisherdate": "2023",
-      "nbRecno": "95"
-  },
-  {
-      "nbId": "2c9680978c433d11018d2b02cc58235a",
-      "libcode": "1201",
-      "nbName": "白鹭在冰面上站着",
-      "nbExplain": "无论被叫作香格里拉，还是勐巴拉西，云南都是“人间天堂”的意思。在著名作家、鲁迅文学奖得主雷平阳眼里，云南是他的文学诞生地，是他生活的现场，更是他的桃花源和乌有乡。这本散文集即为他的“桃花源记”。澜沧江、怒江、金沙江、牛栏江，乌蒙山、哀牢山、基诺山、南糯山，山水相依；天空、丛林、废墟，寺庙、悬崖、墓地，人神鬼巫，共生共荣，死生无迹。云南的山川物候、历史文脉、民生世情转化为其阔大的写作景深，接通了雷平阳的无际视域。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:08:55.253+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "雷平阳著",
-      "nbBooktype": "图书",
-      "sortmark": "I267/5253",
-      "isbn": "978-7-5447-9732-0",
-      "nbPublisher": "译林出版社",
-      "nbPublisherdate": "2023",
-      "nbRecno": "96"
-  },
-  {
-      "nbId": "2c9680978c433d11018d2b0180d72359",
-      "libcode": "1201",
-      "nbName": "追赶你老去的速度",
-      "nbExplain": "本书是荷尔德林1785-1826年间，与亲人的通信，包括他和母亲、弟弟妹妹的通信。书信内容较为全面地反映了诗人与亲人交流的方式，生活的变故等。原文思想深邃，文学性强，译文准确、洗练。书信内容从一个侧面反映了诗人与亲人交流的真实状态，也反映了当时德国的社会风貌，是研究德国历史、文化，以及诗人创作成就不可多得的一手资料。书稿兼具学术性、艺术性和史料价值。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:08:45.640+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(德)荷尔德林著 , 王佐良译",
-      "nbBooktype": "图书",
-      "sortmark": "K835.165/11",
-      "isbn": "978-7-205-10415-3",
-      "nbPublisher": "辽宁人民出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "97"
-  },
-  {
-      "nbId": "2c9680978c433d11018d2afca7002357",
-      "libcode": "1201",
-      "nbName": "这个三国史很上头",
-      "nbExplain": "本书分军阀篇、曹魏篇、蜀汉篇、东吴篇、三分归晋篇五编，内容包括：“吕布：有多勇武，就有多不受待见”“公孙瓒：从白马将军到笼中困兽”“袁绍：小气量失大天下”等。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:08:36.740+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "张大可",
-      "nbBooktype": "图书",
-      "sortmark": "K236/7",
-      "isbn": "978-7-5411-6391-3 ",
-      "nbPublisher": "四川文艺出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "98"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c22fdc47b189f",
-      "libcode": "1201",
-      "nbName": "阿富汗文件",
-      "nbExplain": "本书是对“阿富汗战争”的深度调查，揭示了美国在阿富汗战争中的谎言、欺骗与真相。美国以反恐为名发动战争，这是被净化了的官方叙事。作者获取了大量美国政府未敢公开的内部文件，在书中揭示了美国如何陷入一场劳师动众的战争，并决心对公众隐瞒失败的真相。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:08:27.763+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(美)克雷格·惠特洛克(Craig Whitlock)著 , 陈小迁，张文斗译",
-      "nbBooktype": "图书",
-      "sortmark": "D815.4/8",
-      "isbn": "978-7-5217-3900-8 ",
-      "nbPublisher": "中信出版集团股份有限公司",
-      "nbPublisherdate": "2022",
-      "nbRecno": "99"
-  },
-  {
-      "nbId": "2c9680978a8dea18018c22fb1575189e",
-      "libcode": "1201",
-      "nbName": "效率脑科学",
-      "nbExplain": "本书根据最新的脑科学研究成果，耗费数年时间写作了这本工作脑科学著作，其中的方法经过了知名企业的多次验证，切实提高了人们的工作效率。",
-      "createTime": null,
-      "creater": null,
-      "updateTime": "2024-04-03T01:08:18.827+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": " (美)戴维·罗克(David Rock)著 , 马梦捷译",
-      "nbBooktype": "图书",
-      "sortmark": "C934/46",
-      "isbn": "978-7-115-57971-3 ",
-      "nbPublisher": "人民邮电出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "99"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17f94140021",
-      "libcode": "1201",
-      "nbName": "爱丽莎的眼睛",
-      "nbExplain": "法国圣埃克苏佩文学奖获得者蒂莫泰.德.丰拜勒的代表作，这是一部历险小说，也是一部幻想曲，更是一篇保护生态环境的宣言。它简单又神秘，平实又激动人心，故事扣人心弦。它嘲笑无知和权势，赞扬智慧与勇敢，崇尚人间真情，它将给我们带来精神上的洗礼，是一部难得可贵的心灵宝典。",
-      "createTime": "2024-04-03T01:07:56.563+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:07:56.563+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(法) 蒂莫泰·德·丰拜勒著",
-      "nbBooktype": "图书",
-      "sortmark": "I565.84/50",
-      "isbn": "978-7-5307-4994-4",
-      "nbPublisher": "新蕾出版社",
-      "nbPublisherdate": "2011",
-      "nbRecno": "12"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17ec74c0020",
-      "libcode": "1201",
-      "nbName": "一句顶一万句",
-      "nbExplain": "茅盾文学奖获奖作品",
-      "createTime": "2024-04-03T01:07:04.140+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:07:04.140+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "刘震云",
-      "nbBooktype": "图书",
-      "sortmark": "I247.57/6485",
-      "isbn": "978-7-5360-9726-1",
-      "nbPublisher": "花城出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "13"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17e1cf5001f",
-      "libcode": "1201",
-      "nbName": "鱼肚白点亮的记忆",
-      "nbExplain": "本书以时间为序, 串起作者徐淑云的人生岁月, 记下作者在追忆中的思索, 思索中的感悟, 感悟中的思想升华。本书让读者在治愈中思考, 在思考中感动, 给读者以美的享受。",
-      "createTime": "2024-04-03T01:06:20.533+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:06:20.533+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "徐淑云",
-      "nbBooktype": "图书",
-      "sortmark": "I267/5257",
-      "isbn": "978-7-203-12327-9",
-      "nbPublisher": "山西人民出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "13"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17acb3d001b",
-      "libcode": "1201",
-      "nbName": "哈姆雷特",
-      "nbExplain": "生存还是死亡，哈姆雷特的经典疑问。这本书是莎士比亚的经典，讲的是丹麦王子哈姆雷特历经艰险为父报仇的故事。读了这本书，孩子可以感受到大文豪优美的文笔并且可以体会人世间的酸甜苦辣。",
-      "createTime": "2024-04-03T01:02:43.003+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:02:43.003+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(英)威廉·莎士比亚著 , (英)查尔斯·兰姆，(英)玛丽·兰姆改写",
-      "nbBooktype": "图书",
-      "sortmark": "I561.33/76:1",
-      "isbn": "978-7-5470-6068-1",
-      "nbPublisher": "万卷出版有限责任公司",
-      "nbPublisherdate": "2022",
-      "nbRecno": "16"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea179eafe001a",
-      "libcode": "1201",
-      "nbName": "一分钟",
-      "nbExplain": "本书收录了著名儿童文学作家鲁兵的童话，通过主人公的经历，让孩子明白时间规划的重要性，培养孩子良好习惯的养成。",
-      "createTime": "2024-04-03T01:01:45.597+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:01:45.597+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": " 鲁兵著",
-      "nbBooktype": "绘本",
-      "sortmark": "I287/194:2",
-      "isbn": "978-7-5702-3231-4",
-      "nbPublisher": "长江文艺出版社",
-      "nbPublisherdate": "2023",
-      "nbRecno": "17"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17916cf0019",
-      "libcode": "1201",
-      "nbName": "数不清！大自然的生物多样性",
-      "nbExplain": "一本让孩子看见大自然奥秘的美丽图画书籍。",
-      "createTime": "2024-04-03T01:00:51.277+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T01:00:51.277+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "[英]尼古拉·戴维斯文",
-      "nbBooktype": "绘本",
-      "sortmark": "I561.85/527",
-      "isbn": "978-7-5332-9625-4",
-      "nbPublisher": " 明天出版社",
-      "nbPublisherdate": "2018",
-      "nbRecno": "17"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17840360018",
-      "libcode": "1201",
-      "nbName": "猜猜我有多爱你",
-      "nbExplain": "两只兔子短短的对话，浓缩生命中最复杂、最伟大的情感，引导孩子通过不同方式表达爱， 整个绘本充满爱和童趣。",
-      "createTime": "2024-04-03T00:59:56.340+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T00:59:56.340+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "(爱尔兰)山姆·麦克布雷尼著 , (英)安妮塔·婕朗图",
-      "nbBooktype": "绘本",
-      "sortmark": "I562.85/20",
-      "isbn": "978-7-5332-7426-9",
-      "nbPublisher": "明天出版社",
-      "nbPublisherdate": "2022",
-      "nbRecno": "18"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17732290017",
-      "libcode": "1201",
-      "nbName": "春雨落长河",
-      "nbExplain": "故事情节精彩跌宕, 描绘世事交变中奇诡的人生棋局; 凸显出鲜明细腻的人物性格, 尽显大时代背景下的人性之美与悲情; 具有着强烈的现实主义浪漫, 深厚的民国文化底蕴, 是一部构思精密、气势宏大的年代小说。",
-      "createTime": "2024-04-03T00:58:47.207+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T00:58:47.207+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "江天雪意",
-      "nbBooktype": "图书",
-      "sortmark": "I247.5/5673",
-      "isbn": "978-7-226-05792-6",
-      "nbPublisher": "甘肃人民出版社",
-      "nbPublisherdate": "2023",
-      "nbRecno": "19"
-  },
-  {
-      "nbId": "2c9680978e7f2e4f018ea17657e20016",
-      "libcode": "1201",
-      "nbName": "沟通力成就领导力",
-      "nbExplain": "托马斯·戈登博士美国著名心理学家，本书把博士享誉全球的人际关系模型 (戈登沟通模式) 传授给领导者。",
-      "createTime": "2024-04-03T00:57:51.330+0000",
-      "creater": "297edff88354751d018359cd2e120000",
-      "updateTime": "2024-04-03T00:57:51.330+0000",
-      "updater": "297edff88354751d018359cd2e120000",
-      "nbAuthor": "托马斯·戈登",
-      "nbBooktype": "图书",
-      "sortmark": "C933.2/40",
-      "isbn": "978-7-5763-1840-1",
-      "nbPublisher": "北京理工大学出版社",
-      "nbPublisherdate": "2023",
-      "nbRecno": "20"
+{
+  "errCode": 0,
+  "errMsg": "ok",
+  "data": {
+    "newbookList": [
+      {
+        "nbId": "2c96809799e5c33c019b073b5daf04f4",
+        "libcode": "1201",
+        "nbName": "1第二人生：找到重新定义人生的智慧",
+        "nbExplain": "本书是写给每一个需要进行人生转型的读者的原创作品，旨在通过“人生教练”这一独特的教练方式帮助读者重新认识自己，成功实现转型，更科学地去达成人生的蜕变和突破。书中不仅提供了一系列人生教练的专业工具、方法和练习，帮助读者进行人生转型的探索和实践；还探讨了人的力量从何而来，如何获得。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:27:33.313+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "秦加一",
+        "nbBooktype": "图书",
+        "sortmark": "B821-49/1793",
+        "isbn": "978-7-5596-7891-1",
+        "nbPublisher": "北京联合出版公司",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b073e896d04f6",
+        "libcode": "1201",
+        "nbName": "中国艺术常识",
+        "nbExplain": "本书辑录了李叔同先生对中西绘画、书法、篆刻历代经典名作的赏析讲评。同时，读者也可通过本书，学到先生亲授的绘画与书法技法，倾听先生论述文学与音乐的艺术。一代文化宗师李叔同先生，是第一位将西洋绘画、音乐、话剧、广告图案设计、现代木刻和西洋术史引进中国的文艺先驱者，也是最早采用“人体写生教学法”，首倡改良中国画的艺术教育家，同时也是我国著名的书画家、书法家、金石篆刻家，其书法、篆刻作品享誉中国，鲁迅、郭沫若等现代文化名人以得到先生的一幅字画为无上荣耀。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:26:54.420+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "李叔同",
+        "nbBooktype": "图书",
+        "sortmark": "J12/13",
+        "isbn": "978-7-5020-9795-0",
+        "nbPublisher": "应急管理出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b073fa8b404f7",
+        "libcode": "1201",
+        "nbName": "财富跃迁：实战手册",
+        "nbExplain": "本书分“认知篇”“方法篇”“周期篇”“实战篇”“误区篇”“未来篇”以及“番外篇”六大部分，是作者作为一个投资人多年的实战干货，在本书中作者深入浅出分析实战案例，教会普通人如何在守住金钱的基础上，快速掌握财富底层规律，让财富实现倍数跃迁。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:26:08.467+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "靳岩",
+        "nbBooktype": "图书",
+        "sortmark": "F830.59/232",
+        "isbn": "978-7-5236-0600-1",
+        "nbPublisher": "中国科学技术出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0752c2b70508",
+        "libcode": "1201",
+        "nbName": "丛林故事",
+        "nbExplain": "《丛林故事》是英国第一位诺贝尔文学奖得主吉卜林的脍炙人口的世界文学名著，共16个短篇，分为“丛林故事”和“续集”两部分。第一部分的9篇讲述主人公狼孩毛葛利在动物世界中的成长经历，最后又回归文明世界的故事；第二部分的7篇相互独立，场景不再局限于热带丛林，故事发生地遍及极地冰原、海洋世界、南亚山麓、军营等。作品通过“兽语禽言”，以动物世界折射人类社会，其雄浑的思想、奇巧的想象，以及诗文并茂的文本形式，令这本书不仅可读，仿佛还可听、可吟、可视，百年来其魅力经久不衰，早已超越儿童文学的范畴。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:21:33.923+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "(英)鲁德亚德·吉卜林(Rudyard Kipling)著",
+        "nbBooktype": "图书",
+        "sortmark": "I561.84/456",
+        "isbn": "978-7-5327-9277-1",
+        "nbPublisher": "上海译文出版社有限公司",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b075255670507",
+        "libcode": "1201",
+        "nbName": "闪闪的红星",
+        "nbExplain": "《闪闪的红星》讲述了潘冬子在革命前辈的指引和帮助下，由一个普通的农家少年逐渐成长为坚定的革命者的故事，情节感人至深、语言生动活泼，自问世以来，深受读者的喜爱，广为流传。小主人公潘冬子豪爽、善良、智勇双全，是我们小学生学习的楷模；潘冬子热爱祖国和大无畏的革命精神影响了一代又一代中国儿童。这本书有助于少年儿童继承光荣的革命传统，树立正确的价值观，培养勇敢、坚强、善良的优秀品质，是一部不可多得的红色经典名著。\r\n",
+        "createTime": "2025-12-10T08:13:14.983+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:13:14.983+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "李心田著",
+        "nbBooktype": "图书",
+        "sortmark": "I287.45/2970",
+        "isbn": "978-7-5702-2851-5",
+        "nbPublisher": "长江文艺出版社",
+        "nbPublisherdate": "2022",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0751d1b50506",
+        "libcode": "1201",
+        "nbName": "揭秘长江黄河",
+        "nbExplain": "长江和黄河是中国的母亲河，中华民族的悠久历史离不开这两条河流的哺育。本书向孩子介绍了黄河和长江的概貌、历史文化、地域风俗等，包括地理知识、历史故事、神话传说、名胜古迹、动植物百科等，用全景式的插图再现黄河和长江各个流域的自然风貌，让孩子直观感受中国的地大物博和厚重历史。此外，书中还用超大折页和80多个趣味翻翻页，让孩子在互动阅读中了解江河文明，增强文化自信。\r\n",
+        "createTime": "2025-12-10T08:12:41.270+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:12:41.270+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "杨明，张晓红文",
+        "nbBooktype": "图书",
+        "sortmark": "K928.42-49/7",
+        "isbn": "978-7-5417-7604-5",
+        "nbPublisher": "未来出版社",
+        "nbPublisherdate": "2023",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0750f3290504",
+        "libcode": "1201",
+        "nbName": "从统治天空的翼龙到称霸海洋的巨怪",
+        "nbExplain": "1亿年前，地球上除了恐龙以外，还充满了大量神奇而有趣的动物。统治天空的是翼龙类。其中不乏肉食性的庞然大物，比如哈特兹哥翼龙，当然也有靠捕食昆虫为生的小家伙，比如天生的空中杂技演员蛙嘴龙。海洋和河流中生活着各种各样的水生爬行动物。包括海豚一样的鱼龙类，拥有巨大颌部的沧龙类，以及长脖子的蛇颈龙类。其中一些体形超乎寻常的庞大，除了海怪，似乎再也找不到能够形容的合适词汇。现在，一起进入爬行动物的中生代，踏上从天空到海洋的奇幻之旅吧！\r\n",
+        "createTime": "2025-12-10T08:11:44.297+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:11:44.297+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "（瑞典)约翰·伊格克朗茨(Johan Egerkrans)绘著 ",
+        "nbBooktype": "图书",
+        "sortmark": "Q915.864-49/89",
+        "isbn": "978-7-02-018036-3",
+        "nbPublisher": "人民文学出版社",
+        "nbPublisherdate": "2023",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b074ef9520502",
+        "libcode": "1201",
+        "nbName": "孩子常问的500个为什么．奇妙的科学",
+        "nbExplain": "《孩子常问的500个为什么：奇妙的科学》：消防车为什么要穿“红衣服”？高速公路上为什么很少有路灯？橡皮为什么可以擦掉铅笔字？让我们一起去奇妙的科学世界里寻找答案吧！五花八门的交通工具、便捷实用的电器、各式各样的生活用品……它们身上蕴藏着有趣的科学奥秘，让我们一起来了解身边的科学常识，尽情感受科学的魅力吧！\r\n",
+        "createTime": "2025-12-10T08:09:34.803+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:09:34.803+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "吕昀珊，曲美霞主编",
+        "nbBooktype": "图书",
+        "sortmark": "Z228.1/733:6",
+        "isbn": "978-7-5736-1739-2",
+        "nbPublisher": "青岛出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b074c2f140501",
+        "libcode": "1201",
+        "nbName": "幽灵飞船",
+        "nbExplain": "本系列以小学1-3年级学生为读者对象，由知名少儿科幻作家马传思担任主编，精选了国内外经典的科幻小说，内容囊括未来科技、宇宙探索、星际文明等主题，旨在激发孩子的想象力和好奇心，初步培养科幻思维，激发他们对科学的热爱和对人类未来的思考，同时提升其阅读水平和科学素养。本册聚焦人工智能、机器人、虚拟现实等当前正在快速发展并深刻影响人类社会的新兴科技，精选吴岩、宝树、赵华等科幻作家的作品，如《来自外星人的报告》《出埃及记》《钻石透镜》《从天而降的雪花球》《幽灵飞船》《第一次接触》等。本书结构形式简洁自然，既能让读者享受自主阅读的乐趣，又能帮助其对作品主题、创意、背景等进行拓展理解。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:08:36.597+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "马传思主编",
+        "nbBooktype": "图书",
+        "sortmark": "I287.45/3092:4",
+        "isbn": "978-7-5337-8997-8",
+        "nbPublisher": "安徽科学技术出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b074a79540500",
+        "libcode": "1201",
+        "nbName": "麦小米的100个烦恼．特别的心事",
+        "nbExplain": "“麦小米的100个烦恼”系列是专门写给小学生的校园成长故事。凯叔和麦大米根据一万多份小学生调查问卷，将小学生的烦恼用三个女孩的日记呈现出来，一篇一烦恼，一篇一成长。内容涉及儿童在前青春期（7-11岁）的情绪、学习、人际关系，比如亲子关系、同伴关系等方面，所烦恼的问题。小学生读者阅读此书，能够找到强烈的情感共鸣，纾解他们在学习和生活中的压力，培养积极乐观的思维方式，陪伴他们与烦恼和解，快乐成长。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:05:35.893+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "凯叔，麦大米著",
+        "nbBooktype": "图书",
+        "sortmark": "I287.5/1296:11",
+        "isbn": "978-7-5148-8625-2",
+        "nbPublisher": "中国少年儿童新闻出版总社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0748f73104ff",
+        "libcode": "1201",
+        "nbName": "漫画二十四史：少年版",
+        "nbExplain": "《漫画二十四史》从我国各朝史书汇成的“二十四史”中选取精华篇目，用少年儿童喜爱的方式进行编写。在遵循原著的基础上，作者对语言进行了通俗化、趣味化处理，每篇文章前面都加入了独到的领读感想，带领小读者更快地进入故事之中；篇末设置了“知识链接”和“成语小课堂”栏目，帮助小读者掌握好历史文化小知识。文中的漫画插图为全书增添了更多趣味，写实又精美的插画还原了历史现场，幽默的人物对话活跃了气氛，更加吸引小读者进入沉浸式的阅读体验中。\r\n",
+        "createTime": null,
+        "creater": null,
+        "updateTime": "2025-12-10T08:04:07.553+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "李妍编著",
+        "nbBooktype": "图书",
+        "sortmark": "K204.1/22:4",
+        "isbn": "978-7-5139-4167-9",
+        "nbPublisher": "民主与建设出版社有限责任公司",
+        "nbPublisherdate": "2023",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0747d96004fe",
+        "libcode": "1201",
+        "nbName": "沿着黄河学非遗",
+        "nbExplain": "保护好、传承好、弘扬好非遗，要从孩子们抓起，让他们懂得非遗是什么、各省的国家级非遗项目是怎样的，从而让非遗保护意识深入人心，让孩子们从非遗中汲取文化自信，成为有知识、有底蕴、有志向的中国少年。本系列丛书即是基于这些方面策划的。本书选择黄河流经部分地市的代表性非遗项目，以图文并茂的方式呈现，是为青少年量身打造的原创非物质文化遗产读物。\r\n",
+        "createTime": "2025-12-10T08:01:47.873+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:01:47.873+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "郑军，徐丽慧文",
+        "nbBooktype": "图书",
+        "sortmark": "G127.2/3",
+        "isbn": "978-7-5474-4916-5",
+        "nbPublisher": "山东画报出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b07472c3304fd",
+        "libcode": "1201",
+        "nbName": "世界真奇妙：100+个你闻所未闻的妙趣事实．第二辑",
+        "nbExplain": "你知道这些知识吗？你知道吗？有时候月球上的温度比沸水的温度还高，蜗牛可以沿着刀锋爬行而不割伤自己，一些树栖蛇能在空中滑翔24米……全书内容丰富、包罗万象，涉及天文、地理、动物、植物、自然、人体、生活、历史、前沿科技等方方面面。上万幅实图、上万张手绘，脑洞大开的图片带孩子享受视觉的盛宴，一窥科学的真容。时尚前沿的设计版式，让孩子从小培养艺术审美。\r\n",
+        "createTime": "2025-12-10T08:01:03.537+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T08:01:03.537+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "美国国家地理学会著",
+        "nbBooktype": "图书",
+        "sortmark": "Z271.2/12:1",
+        "isbn": "978-7-5583-3621-8",
+        "nbPublisher": "新世纪出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0744957004fc",
+        "libcode": "1201",
+        "nbName": "这本书可能救你的命：幽默有趣的人体维修指南：everyday health hacks to worry less and live better",
+        "nbExplain": "本书从肠道、心脏、肺、触觉、视觉、听觉、免疫系统等方方面面入手，总结了人体的一些奇怪而奇妙的功能，并提供了实用的建议来帮助你如何获得更健康的身体。\r\n",
+        "createTime": "2025-12-10T07:58:13.870+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:58:13.870+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "(英)卡兰·拉詹(Karan Rajan)著 , 胡小锐译",
+        "nbBooktype": "图书",
+        "sortmark": "R161/239",
+        "isbn": "978-7-5217-6957-9",
+        "nbPublisher": "中信出版集团股份有限公司",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0742943604fb",
+        "libcode": "1201",
+        "nbName": "稳固的幸福感：阿德勒谈自我超越与人生课题",
+        "nbExplain": "本书从“目的论”出发，依次拆解了自卑与补偿、生活风格、社会兴趣、创造性自我、课题分离等阿德勒心理学中的核心观点。作者从自身的经验与理解出发，探讨了我们应该如何放弃全能幻想，学会做一个普通人；作为人格核心的四种生活风格是如何形成和影响我们的；如何建立滋养型而非消耗型的人际关系等。\r\n",
+        "createTime": "2025-12-10T07:56:02.487+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:56:02.487+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "胡慎之",
+        "nbBooktype": "图书",
+        "sortmark": "C912.6-0/24",
+        "isbn": "978-7-5596-7508-8",
+        "nbPublisher": "北京联合出版公司",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0741c9fe04fa",
+        "libcode": "1201",
+        "nbName": "养生有时节",
+        "nbExplain": "本书主要介绍运用中医理念进行养生保健的一些思想理论和操作方法, 包括了不同季节下的养生思路、不同节气中的养生方法、针对五脏的养生、在日常饮食起居中的养生建议等内容, 针对特定时令、特定身体状态、特定人群分别提出不同的养生方法, 让广大读者都能从书中获得适合自身的养生保健知识, 也对中医传统医理起到了普及与推广作用。\r\n",
+        "createTime": "2025-12-10T07:55:10.717+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:55:10.717+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "董洪涛",
+        "nbBooktype": "图书",
+        "sortmark": "R212/191",
+        "isbn": "978-7-5551-2386-6",
+        "nbPublisher": "广西科学技术出版社",
+        "nbPublisherdate": "2025",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b0741474204f9",
+        "libcode": "1201",
+        "nbName": "22玩转视频号",
+        "nbExplain": "近几年，随着互联网技术的不断发展，短视频新媒体成为主流传播方式之一，其快速、生动、简洁的特点吸引着越来越多的用户。其所具有的商业化潜力和价值也得到越来越多的显现。《玩转视频号》一书，是作者基于个人微信视频号“@晴天讲段子”的账号经验和自身多年从事互联网相关工作的经验相结合而输出的，以短视频营销方法为主要内容的实用手册，适合懂互联网知识、有营销基础的读者学习，对互联网知识感兴趣、想要学习短视频营销的读者也可通过此书获得入门钥匙。\r\n",
+        "createTime": "2025-12-10T07:54:37.250+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:54:37.250+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "金满铮",
+        "nbBooktype": "图书",
+        "sortmark": "F713.365.2/315",
+        "isbn": "978-7-5521-2482-8",
+        "nbPublisher": "内蒙古文化出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b074047f604f8",
+        "libcode": "1201",
+        "nbName": "山有扶苏：美得窒息的诗经：汉英对照",
+        "nbExplain": "2种语言的韵律融合，惊艳3000年的中国人赤诚性情与动人诗书；畅销书作家闫红新作，讲述诗经中的浪漫生活，细腻清澈，浪漫多情，描绘诗经挚美“思无邪”，在诗经的字里行间，知春秋之历史，感天地草木之灵，见流彩华章之美。本书分“云谁之思”“清扬婉兮”“幽幽南山”“绵绵瓜瓞”“维天之命”“于胥乐兮”六个部分，赏析诗经的美。\r\n",
+        "createTime": "2025-12-10T07:53:31.893+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:53:31.893+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "许渊冲译 , 闫红解析",
+        "nbBooktype": "图书",
+        "sortmark": "H319.4:I/540",
+        "isbn": "978-7-5702-3295-6",
+        "nbPublisher": "长江文艺出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b073c8e2804f5",
+        "libcode": "1201",
+        "nbName": "经济学与生活",
+        "nbExplain": "提起经济学，很多人会想到一连串枯燥乏味的数字，以及国家经济、产业结构、宏观调控等一系列专业术语，认为它和现实生活相距甚远。其实，这是对经济学的极大误解。实际上，经济学真实地存在于社会的各个领域，存在于日常生活中的每一天，与每一个人都息息相关。这本经济学的入门书，结合生活中常见的问题和现象，阐述经典的经济学原理，让读者切身感受到经济学与生活之间的密切联系，帮助读者在看待问题、思考决策时，多一个视角，多一重思考，学会在复杂世界做一个明白人。\r\n",
+        "createTime": "2025-12-10T07:49:27.720+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:49:27.720+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "贾润英",
+        "nbBooktype": "图书",
+        "sortmark": "F0-49/197",
+        "isbn": "978-7-5229-1345-2",
+        "nbPublisher": "中国纺织出版社有限公司",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      },
+      {
+        "nbId": "2c96809799e5c33c019b073ad6bd04f3",
+        "libcode": "1201",
+        "nbName": "111团圆记",
+        "nbExplain": "本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n",
+        "createTime": "2025-12-10T07:47:35.230+0000",
+        "creater": "297edff88354751d018359cd2e120000",
+        "updateTime": "2025-12-10T07:47:35.230+0000",
+        "updater": "297edff88354751d018359cd2e120000",
+        "nbAuthor": "杨云苏",
+        "nbBooktype": "图书",
+        "sortmark": "I247.57/6741",
+        "isbn": "978-7-5339-7651-4",
+        "nbPublisher": "浙江文艺出版社",
+        "nbPublisherdate": "2024",
+        "nbRecno": "",
+        "nbImgPath": ""
+      }
+    ],
+    "page": {
+      "totalRows": 20,
+      "pageSize": 100,
+      "currentPage": 1,
+      "totalPages": 1,
+      "startRow": 0
+    }
   }
-]
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/views/newBookRecommend/index.vue b/src/views/newBookRecommend/index.vue
index 9b277be..db0fcb4 100644
--- a/src/views/newBookRecommend/index.vue
+++ b/src/views/newBookRecommend/index.vue
@@ -2,19 +2,26 @@
   <!-- 新书推荐 -->
   <div class="screen-item lending-ranking">
     <div class="common-title">图书推荐</div>
-    <div ref="newbook" class="big-module module-content">
+    <div ref="newbook" class="big-module module-content" :style="{'height': swiperHeight+'px'}">
       <!-- 按6个一组拆分后渲染，每组是一屏（3列2行） -->
       <swiper v-if="groupedList.length > 0" ref="swiperThumbs" class="swiper gallery-thumbs directive" :options="swiperOptionThumbs">
         <swiper-slide v-for="(group, groupIndex) in groupedList" :key="groupIndex" class="screen-group">
           <!-- 每组内部：3列2行布局 -->
           <div class="book-grid">
             <div v-for="(item) in group" :key="item.nbId" class="newbook-list-item">
-              <div class="book-img">
+              <div
+                class="book-img"
+                :style="{
+                  width: bookSizeRatio.imgWidth,
+                  height: bookSizeRatio.imgHeight,
+                  marginBottom: bookSizeRatio.marginBottom
+                }"
+              >
                 <img :src="item.cover" :onerror="defaultImg" alt="图书封面">
               </div>
               <div class="book-info">
-                <h4 class="title-item">{{ item.nbName }}</h4>
-                <p class="author-item">{{ item.nbAuthor }}</p>
+                <h4 class="title-item" :style="{ fontSize: bookSizeRatio.titleFontSize }">{{ item.nbName }}</h4>
+                <p class="author-item" :style="{ fontSize: bookSizeRatio.authorFontSize }">{{ item.nbAuthor }}</p>
               </div>
             </div>
             <!-- 补全空卡片：保证每组都是6个，布局整齐 -->
@@ -38,14 +45,22 @@
 import { FetchNewBookRecommend, FetchCoverByISBN } from '@/api/library'
 import { swiper, swiperSlide } from 'vue-awesome-swiper'
 import 'swiper/dist/css/swiper.css'
+// import result from './data.json'
 
 export default {
   name: 'NewBookRecommend',
   components: { swiper, swiperSlide },
+  props: {
+    containerHeight: {
+      type: Number,
+      default: 0
+    }
+  },
   data() {
     return {
       defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"',
-      rankingList: []
+      rankingList: [],
+      swiperHeight: 0 // 最终用于swiper的高度
     }
   },
   computed: {
@@ -54,43 +69,102 @@ export default {
       const list = [...this.rankingList]
       const groups = []
       // 每6个拆成一组
-      for (let i = 0; i < list.length; i += 6) {
-        const group = list.slice(i, i + 6)
-        groups.push(group)
+      while (list.length) {
+        groups.push(list.splice(0, 6))
       }
       return groups
     },
+    bookSizeRatio() {
+      // 容器高度（像素）转rem（假设1rem=80px，根据你的项目基准调整）
+      const containerHeightRem = this.swiperHeight / 80 || 6.8125
+      // 封面宽度 = 容器高度的 20%（可根据需要调整比例）
+      const imgWidthRem = containerHeightRem * 0.22
+      // 封面高度 = 宽度 × 1.34（图书封面标准比例 3:4 左右）
+      const imgHeightRem = imgWidthRem * 1.34
+      // 文字区域字体大小 = 容器高度的 3.5%
+      const titleFontSize = containerHeightRem * 0.04
+      const authorFontSize = containerHeightRem * 0.034
+
+      return {
+        imgWidth: `${imgWidthRem}rem`,
+        imgHeight: `${imgHeightRem}rem`,
+        titleFontSize: `${titleFontSize}rem`,
+        authorFontSize: `${authorFontSize}rem`,
+        marginBottom: `${containerHeightRem * 0.035}rem` // 封面和文字的间距
+      }
+    },
     // Swiper配置：竖向滚动，每次滑1组（1屏）
     swiperOptionThumbs() {
       return {
         direction: 'vertical',
         slidesPerView: 1,
         slidesPerGroup: 1,
-        spaceBetween: 0, // 必须设为0，避免间距叠加
-        height: 540, // 与容器高度严格一致
+        spaceBetween: 0,
+        height: this.swiperHeight || 540, // 使用动态高度，备用值540
         loop: false,
         autoplay: true,
         observer: true,
         observeParents: true,
-        autoHeight: false, // 强制关闭自动高度
-        roundLengths: true, // 四舍五入像素，避免小数偏移
-        preventClicks: false, // 防止点击干扰滚动计算
-        // 关键：关闭触摸滑动的惯性，避免手动滑动导致的偏移
+        autoHeight: false,
+        roundLengths: true,
+        preventClicks: false,
         freeMode: false,
         freeModeMomentum: false,
-        // 强制滚动到整屏，不允许停在半屏
         slidesOffsetBefore: 0,
-        slidesOffsetAfter: 0
+        slidesOffsetAfter: 0,
+        // 修复空白屏
+        onReachEnd: () => {
+          if (this.swiper) {
+            this.swiper.autoplay.stop()
+          }
+        },
+        onSlideChangeStart: (swiper) => {
+          const totalSlides = swiper.slides.length
+          if (swiper.activeIndex >= totalSlides - 1) {
+            swiper.slideTo(totalSlides - 1, 0, false)
+          }
+        }
       }
     },
     swiper() {
       return this.$refs.swiperThumbs?.swiper
     }
   },
+  watch: {
+    // 监听父组件传递的高度变化
+    containerHeight(newVal) {
+      if (newVal > 0) {
+        this.swiperHeight = newVal
+        // 更新swiper
+        this.$nextTick(() => {
+          if (this.swiper) {
+            this.swiper.update()
+          }
+        })
+      }
+    }
+  },
+  beforeDestroy() {
+    // 移除监听，防止内存泄漏
+    window.removeEventListener('resize', this.getContainerHeight)
+  },
   mounted() {
     this.getNewBookRecommend()
+
+    // 初始化高度
+    if (this.containerHeight > 0) {
+      this.swiperHeight = this.containerHeight
+    }
   },
   methods: {
+    updateHeight(height) {
+      this.swiperHeight = height
+      this.$nextTick(() => {
+        if (this.swiper) {
+          this.swiper.update()
+        }
+      })
+    },
     async getNewBookRecommend() {
       try {
         const params = {
@@ -100,507 +174,7 @@ export default {
         }
         console.log('params', params)
         const res = await FetchNewBookRecommend(params)
-        // const res = {
-        //   'errCode': 0,
-        //   'errMsg': 'ok',
-        //   'data': {
-        //     'newbookList': [
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073b5daf04f4',
-        //         'libcode': '1201',
-        //         'nbName': '1第二人生：找到重新定义人生的智慧',
-        //         'nbExplain': '本书是写给每一个需要进行人生转型的读者的原创作品，旨在通过“人生教练”这一独特的教练方式帮助读者重新认识自己，成功实现转型，更科学地去达成人生的蜕变和突破。书中不仅提供了一系列人生教练的专业工具、方法和练习，帮助读者进行人生转型的探索和实践；还探讨了人的力量从何而来，如何获得。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:27:33.313+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '秦加一',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'B821-49/1793',
-        //         'isbn': '978-7-5596-7891-1',
-        //         'nbPublisher': '北京联合出版公司',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073e896d04f6',
-        //         'libcode': '1201',
-        //         'nbName': '中国艺术常识',
-        //         'nbExplain': '本书辑录了李叔同先生对中西绘画、书法、篆刻历代经典名作的赏析讲评。同时，读者也可通过本书，学到先生亲授的绘画与书法技法，倾听先生论述文学与音乐的艺术。一代文化宗师李叔同先生，是第一位将西洋绘画、音乐、话剧、广告图案设计、现代木刻和西洋术史引进中国的文艺先驱者，也是最早采用“人体写生教学法”，首倡改良中国画的艺术教育家，同时也是我国著名的书画家、书法家、金石篆刻家，其书法、篆刻作品享誉中国，鲁迅、郭沫若等现代文化名人以得到先生的一幅字画为无上荣耀。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:26:54.420+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '李叔同',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'J12/13',
-        //         'isbn': '978-7-5020-9795-0',
-        //         'nbPublisher': '应急管理出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073fa8b404f7',
-        //         'libcode': '1201',
-        //         'nbName': '财富跃迁：实战手册',
-        //         'nbExplain': '本书分“认知篇”“方法篇”“周期篇”“实战篇”“误区篇”“未来篇”以及“番外篇”六大部分，是作者作为一个投资人多年的实战干货，在本书中作者深入浅出分析实战案例，教会普通人如何在守住金钱的基础上，快速掌握财富底层规律，让财富实现倍数跃迁。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:26:08.467+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '靳岩',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'F830.59/232',
-        //         'isbn': '978-7-5236-0600-1',
-        //         'nbPublisher': '中国科学技术出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0752c2b70508',
-        //         'libcode': '1201',
-        //         'nbName': '丛林故事',
-        //         'nbExplain': '《丛林故事》是英国第一位诺贝尔文学奖得主吉卜林的脍炙人口的世界文学名著，共16个短篇，分为“丛林故事”和“续集”两部分。第一部分的9篇讲述主人公狼孩毛葛利在动物世界中的成长经历，最后又回归文明世界的故事；第二部分的7篇相互独立，场景不再局限于热带丛林，故事发生地遍及极地冰原、海洋世界、南亚山麓、军营等。作品通过“兽语禽言”，以动物世界折射人类社会，其雄浑的思想、奇巧的想象，以及诗文并茂的文本形式，令这本书不仅可读，仿佛还可听、可吟、可视，百年来其魅力经久不衰，早已超越儿童文学的范畴。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:21:33.923+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '(英)鲁德亚德·吉卜林(Rudyard Kipling)著',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I561.84/456',
-        //         'isbn': '978-7-5327-9277-1',
-        //         'nbPublisher': '上海译文出版社有限公司',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b075255670507',
-        //         'libcode': '1201',
-        //         'nbName': '闪闪的红星',
-        //         'nbExplain': '《闪闪的红星》讲述了潘冬子在革命前辈的指引和帮助下，由一个普通的农家少年逐渐成长为坚定的革命者的故事，情节感人至深、语言生动活泼，自问世以来，深受读者的喜爱，广为流传。小主人公潘冬子豪爽、善良、智勇双全，是我们小学生学习的楷模；潘冬子热爱祖国和大无畏的革命精神影响了一代又一代中国儿童。这本书有助于少年儿童继承光荣的革命传统，树立正确的价值观，培养勇敢、坚强、善良的优秀品质，是一部不可多得的红色经典名著。\r\n',
-        //         'createTime': '2025-12-10T08:13:14.983+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:13:14.983+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '李心田著',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I287.45/2970',
-        //         'isbn': '978-7-5702-2851-5',
-        //         'nbPublisher': '长江文艺出版社',
-        //         'nbPublisherdate': '2022',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0751d1b50506',
-        //         'libcode': '1201',
-        //         'nbName': '揭秘长江黄河',
-        //         'nbExplain': '长江和黄河是中国的母亲河，中华民族的悠久历史离不开这两条河流的哺育。本书向孩子介绍了黄河和长江的概貌、历史文化、地域风俗等，包括地理知识、历史故事、神话传说、名胜古迹、动植物百科等，用全景式的插图再现黄河和长江各个流域的自然风貌，让孩子直观感受中国的地大物博和厚重历史。此外，书中还用超大折页和80多个趣味翻翻页，让孩子在互动阅读中了解江河文明，增强文化自信。\r\n',
-        //         'createTime': '2025-12-10T08:12:41.270+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:12:41.270+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨明，张晓红文',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'K928.42-49/7',
-        //         'isbn': ' 978-7-5417-7604-5',
-        //         'nbPublisher': '未来出版社',
-        //         'nbPublisherdate': '2023',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0750f3290504',
-        //         'libcode': '1201',
-        //         'nbName': '从统治天空的翼龙到称霸海洋的巨怪',
-        //         'nbExplain': '1亿年前，地球上除了恐龙以外，还充满了大量神奇而有趣的动物。统治天空的是翼龙类。其中不乏肉食性的庞然大物，比如哈特兹哥翼龙，当然也有靠捕食昆虫为生的小家伙，比如天生的空中杂技演员蛙嘴龙。海洋和河流中生活着各种各样的水生爬行动物。包括海豚一样的鱼龙类，拥有巨大颌部的沧龙类，以及长脖子的蛇颈龙类。其中一些体形超乎寻常的庞大，除了海怪，似乎再也找不到能够形容的合适词汇。现在，一起进入爬行动物的中生代，踏上从天空到海洋的奇幻之旅吧！\r\n',
-        //         'createTime': '2025-12-10T08:11:44.297+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:11:44.297+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '（瑞典)约翰·伊格克朗茨(Johan Egerkrans)绘著 ',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'Q915.864-49/89',
-        //         'isbn': '978-7-02-018036-3',
-        //         'nbPublisher': '人民文学出版社',
-        //         'nbPublisherdate': '2023',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b074ef9520502',
-        //         'libcode': '1201',
-        //         'nbName': '孩子常问的500个为什么．奇妙的科学',
-        //         'nbExplain': '《孩子常问的500个为什么：奇妙的科学》：消防车为什么要穿“红衣服”？高速公路上为什么很少有路灯？橡皮为什么可以擦掉铅笔字？让我们一起去奇妙的科学世界里寻找答案吧！五花八门的交通工具、便捷实用的电器、各式各样的生活用品……它们身上蕴藏着有趣的科学奥秘，让我们一起来了解身边的科学常识，尽情感受科学的魅力吧！\r\n',
-        //         'createTime': '2025-12-10T08:09:34.803+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:09:34.803+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '吕昀珊，曲美霞主编',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'Z228.1/733:6',
-        //         'isbn': '978-7-5736-1739-2',
-        //         'nbPublisher': '青岛出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b074c2f140501',
-        //         'libcode': '1201',
-        //         'nbName': '幽灵飞船',
-        //         'nbExplain': '本系列以小学1-3年级学生为读者对象，由知名少儿科幻作家马传思担任主编，精选了国内外经典的科幻小说，内容囊括未来科技、宇宙探索、星际文明等主题，旨在激发孩子的想象力和好奇心，初步培养科幻思维，激发他们对科学的热爱和对人类未来的思考，同时提升其阅读水平和科学素养。本册聚焦人工智能、机器人、虚拟现实等当前正在快速发展并深刻影响人类社会的新兴科技，精选吴岩、宝树、赵华等科幻作家的作品，如《来自外星人的报告》《出埃及记》《钻石透镜》《从天而降的雪花球》《幽灵飞船》《第一次接触》等。本书结构形式简洁自然，既能让读者享受自主阅读的乐趣，又能帮助其对作品主题、创意、背景等进行拓展理解。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:08:36.597+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '马传思主编',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I287.45/3092:4',
-        //         'isbn': '978-7-5337-8997-8',
-        //         'nbPublisher': '安徽科学技术出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b074a79540500',
-        //         'libcode': '1201',
-        //         'nbName': '麦小米的100个烦恼．特别的心事',
-        //         'nbExplain': '“麦小米的100个烦恼”系列是专门写给小学生的校园成长故事。凯叔和麦大米根据一万多份小学生调查问卷，将小学生的烦恼用三个女孩的日记呈现出来，一篇一烦恼，一篇一成长。内容涉及儿童在前青春期（7-11岁）的情绪、学习、人际关系，比如亲子关系、同伴关系等方面，所烦恼的问题。小学生读者阅读此书，能够找到强烈的情感共鸣，纾解他们在学习和生活中的压力，培养积极乐观的思维方式，陪伴他们与烦恼和解，快乐成长。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:05:35.893+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '凯叔，麦大米著',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I287.5/1296:11',
-        //         'isbn': '978-7-5148-8625-2',
-        //         'nbPublisher': '中国少年儿童新闻出版总社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0748f73104ff',
-        //         'libcode': '1201',
-        //         'nbName': '漫画二十四史：少年版',
-        //         'nbExplain': '《漫画二十四史》从我国各朝史书汇成的“二十四史”中选取精华篇目，用少年儿童喜爱的方式进行编写。在遵循原著的基础上，作者对语言进行了通俗化、趣味化处理，每篇文章前面都加入了独到的领读感想，带领小读者更快地进入故事之中；篇末设置了“知识链接”和“成语小课堂”栏目，帮助小读者掌握好历史文化小知识。文中的漫画插图为全书增添了更多趣味，写实又精美的插画还原了历史现场，幽默的人物对话活跃了气氛，更加吸引小读者进入沉浸式的阅读体验中。\r\n',
-        //         'createTime': null,
-        //         'creater': null,
-        //         'updateTime': '2025-12-10T08:04:07.553+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '李妍编著',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'K204.1/22:4',
-        //         'isbn': '978-7-5139-4167-9',
-        //         'nbPublisher': '民主与建设出版社有限责任公司',
-        //         'nbPublisherdate': '2023',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0747d96004fe',
-        //         'libcode': '1201',
-        //         'nbName': '沿着黄河学非遗',
-        //         'nbExplain': '保护好、传承好、弘扬好非遗，要从孩子们抓起，让他们懂得非遗是什么、各省的国家级非遗项目是怎样的，从而让非遗保护意识深入人心，让孩子们从非遗中汲取文化自信，成为有知识、有底蕴、有志向的中国少年。本系列丛书即是基于这些方面策划的。本书选择黄河流经部分地市的代表性非遗项目，以图文并茂的方式呈现，是为青少年量身打造的原创非物质文化遗产读物。\r\n',
-        //         'createTime': '2025-12-10T08:01:47.873+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:01:47.873+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '郑军，徐丽慧文',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'G127.2/3',
-        //         'isbn': '978-7-5474-4916-5',
-        //         'nbPublisher': '山东画报出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b07472c3304fd',
-        //         'libcode': '1201',
-        //         'nbName': '世界真奇妙：100+个你闻所未闻的妙趣事实．第二辑',
-        //         'nbExplain': '你知道这些知识吗？你知道吗？有时候月球上的温度比沸水的温度还高，蜗牛可以沿着刀锋爬行而不割伤自己，一些树栖蛇能在空中滑翔24米……全书内容丰富、包罗万象，涉及天文、地理、动物、植物、自然、人体、生活、历史、前沿科技等方方面面。上万幅实图、上万张手绘，脑洞大开的图片带孩子享受视觉的盛宴，一窥科学的真容。时尚前沿的设计版式，让孩子从小培养艺术审美。\r\n',
-        //         'createTime': '2025-12-10T08:01:03.537+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T08:01:03.537+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '美国国家地理学会著',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'Z271.2/12:1',
-        //         'isbn': '978-7-5583-3621-8',
-        //         'nbPublisher': '新世纪出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0744957004fc',
-        //         'libcode': '1201',
-        //         'nbName': '这本书可能救你的命：幽默有趣的人体维修指南：everyday health hacks to worry less and live better',
-        //         'nbExplain': '本书从肠道、心脏、肺、触觉、视觉、听觉、免疫系统等方方面面入手，总结了人体的一些奇怪而奇妙的功能，并提供了实用的建议来帮助你如何获得更健康的身体。\r\n',
-        //         'createTime': '2025-12-10T07:58:13.870+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:58:13.870+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '(英)卡兰·拉詹(Karan Rajan)著 , 胡小锐译',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'R161/239',
-        //         'isbn': '978-7-5217-6957-9 ',
-        //         'nbPublisher': '中信出版集团股份有限公司',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0742943604fb',
-        //         'libcode': '1201',
-        //         'nbName': '稳固的幸福感：阿德勒谈自我超越与人生课题',
-        //         'nbExplain': '本书从“目的论”出发，依次拆解了自卑与补偿、生活风格、社会兴趣、创造性自我、课题分离等阿德勒心理学中的核心观点。作者从自身的经验与理解出发，探讨了我们应该如何放弃全能幻想，学会做一个普通人；作为人格核心的四种生活风格是如何形成和影响我们的；如何建立滋养型而非消耗型的人际关系等。\r\n',
-        //         'createTime': '2025-12-10T07:56:02.487+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:56:02.487+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '胡慎之',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'C912.6-0/24',
-        //         'isbn': '978-7-5596-7508-8?',
-        //         'nbPublisher': '北京联合出版公司',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0741c9fe04fa',
-        //         'libcode': '1201',
-        //         'nbName': '养生有时节',
-        //         'nbExplain': '本书主要介绍运用中医理念进行养生保健的一些思想理论和操作方法, 包括了不同季节下的养生思路、不同节气中的养生方法、针对五脏的养生、在日常饮食起居中的养生建议等内容, 针对特定时令、特定身体状态、特定人群分别提出不同的养生方法, 让广大读者都能从书中获得适合自身的养生保健知识, 也对中医传统医理起到了普及与推广作用。\r\n',
-        //         'createTime': '2025-12-10T07:55:10.717+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:55:10.717+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '董洪涛',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'R212/191',
-        //         'isbn': '978-7-5551-2386-6',
-        //         'nbPublisher': '广西科学技术出版社',
-        //         'nbPublisherdate': '2025',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b0741474204f9',
-        //         'libcode': '1201',
-        //         'nbName': '22玩转视频号',
-        //         'nbExplain': '近几年，随着互联网技术的不断发展，短视频新媒体成为主流传播方式之一，其快速、生动、简洁的特点吸引着越来越多的用户。其所具有的商业化潜力和价值也得到越来越多的显现。《玩转视频号》一书，是作者基于个人微信视频号“@晴天讲段子”的账号经验和自身多年从事互联网相关工作的经验相结合而输出的，以短视频营销方法为主要内容的实用手册，适合懂互联网知识、有营销基础的读者学习，对互联网知识感兴趣、想要学习短视频营销的读者也可通过此书获得入门钥匙。\r\n',
-        //         'createTime': '2025-12-10T07:54:37.250+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:54:37.250+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '金满铮',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'F713.365.2/315',
-        //         'isbn': '978-7-5521-2482-8',
-        //         'nbPublisher': '内蒙古文化出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b074047f604f8',
-        //         'libcode': '1201',
-        //         'nbName': '山有扶苏：美得窒息的诗经：汉英对照',
-        //         'nbExplain': '2种语言的韵律融合，惊艳3000年的中国人赤诚性情与动人诗书；畅销书作家闫红新作，讲述诗经中的浪漫生活，细腻清澈，浪漫多情，描绘诗经挚美“思无邪”，在诗经的字里行间，知春秋之历史，感天地草木之灵，见流彩华章之美。本书分“云谁之思”“清扬婉兮”“幽幽南山”“绵绵瓜瓞”“维天之命”“于胥乐兮”六个部分，赏析诗经的美。\r\n',
-        //         'createTime': '2025-12-10T07:53:31.893+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:53:31.893+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '许渊冲译 , 闫红解析',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'H319.4:I/540',
-        //         'isbn': '978-7-5702-3295-6',
-        //         'nbPublisher': '长江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073c8e2804f5',
-        //         'libcode': '1201',
-        //         'nbName': '经济学与生活',
-        //         'nbExplain': '提起经济学，很多人会想到一连串枯燥乏味的数字，以及国家经济、产业结构、宏观调控等一系列专业术语，认为它和现实生活相距甚远。其实，这是对经济学的极大误解。实际上，经济学真实地存在于社会的各个领域，存在于日常生活中的每一天，与每一个人都息息相关。这本经济学的入门书，结合生活中常见的问题和现象，阐述经典的经济学原理，让读者切身感受到经济学与生活之间的密切联系，帮助读者在看待问题、思考决策时，多一个视角，多一重思考，学会在复杂世界做一个明白人。\r\n',
-        //         'createTime': '2025-12-10T07:49:27.720+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:49:27.720+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '贾润英',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'F0-49/197',
-        //         'isbn': '978-7-5229-1345-2',
-        //         'nbPublisher': '中国纺织出版社有限公司',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       },
-        //       {
-        //         'nbId': '2c96809799e5c33c019b073ad6bd04f3',
-        //         'libcode': '1201',
-        //         'nbName': '111团圆记',
-        //         'nbExplain': '本书以细腻入微的笔法，用富有画面感的文字，栩栩如生地呈现了中国式复杂的家庭关系。既有血浓于水的深情，也有虚伪、不堪、软弱等那些不可言说的灰暗时刻。虽然原生家庭的创伤不可平复，但每个人都在试图用自己的方式与家族和解。或许读后会有强烈共鸣的部分，亲戚们的一颦一笑，一举一动似曾相识。这也是一本中国式家庭关系的特写，让我们感受到真正维系家庭纽带的并非血缘关系，而是生活中彼此之间的尊重和理解。\r\n',
-        //         'createTime': '2025-12-10T07:47:35.230+0000',
-        //         'creater': '297edff88354751d018359cd2e120000',
-        //         'updateTime': '2025-12-10T07:47:35.230+0000',
-        //         'updater': '297edff88354751d018359cd2e120000',
-        //         'nbAuthor': '杨云苏',
-        //         'nbBooktype': '图书',
-        //         'sortmark': 'I247.57/6741',
-        //         'isbn': '978-7-5339-7651-4',
-        //         'nbPublisher': '浙江文艺出版社',
-        //         'nbPublisherdate': '2024',
-        //         'nbRecno': '',
-        //         'nbImgPath': ''
-        //       }
-        //     ],
-        //     'page': {
-        //       'totalRows': 20,
-        //       'pageSize': 100,
-        //       'currentPage': 1,
-        //       'totalPages': 1,
-        //       'startRow': 0
-        //     }
-        //   }
-        // }
+        // const res = result
 
         if (res.errCode === 0) {
           const bookList = res.data.newbookList
@@ -639,7 +213,6 @@ export default {
 
 <style lang="scss" scoped>
 @import "~@/assets/styles/index.scss";
-
 // 容器样式
 .big-module {
   box-sizing: border-box; // 关键：统一盒模型计算方式
@@ -647,7 +220,6 @@ export default {
   position: relative;
   padding: 0; // 清空默认padding，避免基础间距不一致
   margin: 0;  // 清空默认margin
-  height: 520px;
 }
 
 // Swiper容器
@@ -702,14 +274,15 @@ export default {
   flex-direction: column;
   align-items: center;
   justify-content: center;
+   padding: 0.1rem;
   &.empty-card {
     visibility: hidden;
   }
 
   .book-img {
-    width: 1.325rem;
-    height: 1.775rem;
-    margin: 0 auto 0.25rem;
+    // width: 1.325rem;
+    // height: 1.775rem;
+    margin: 0 auto var(--img-margin-bottom, 0.25rem);
     padding: 0;
     background: url('~@/assets/images/default-img.png') no-repeat center center;
     background-size: contain;
@@ -721,13 +294,14 @@ export default {
   }
 
   .book-info {
-    width: 1.82rem;
+    width: 90%;
+    max-width: 1.82rem;
     padding: 0;
     margin: 0 auto;
 
     .title-item {
       font-size: 0.25rem;
-      line-height: .3rem;
+      line-height: 1.2;
       font-weight: normal;
       display: -webkit-box;
       -webkit-box-orient: vertical;
@@ -743,7 +317,7 @@ export default {
       -webkit-line-clamp: 1;
       overflow: hidden;
       text-overflow: ellipsis;
-      line-height: 14px;
+      line-height: 1.2;
     }
   }
 }
diff --git a/src/views/readStar/index-height.vue b/src/views/readStar/index-height.vue
new file mode 100644
index 0000000..d0f0d5d
--- /dev/null
+++ b/src/views/readStar/index-height.vue
@@ -0,0 +1,202 @@
+<template>
+  <!-- 新书推荐 -->
+  <div class="screen-item read-star">
+    <div class="common-title">阅读之星</div>
+    <div ref="starList" class="medium-module module-content" :style="{ height: containerHeight + 'px' }">
+      <div v-for="(item,index) in readstarList" :key="index" :class="['readstart-item', {'star1-bg':index === 0}, {'star2-bg':index === 1}, {'star3-bg':index === 2}]">
+        <svg v-if="index === 0" class="icon icon-star-1" aria-hidden="true">
+          <use xlink:href="#icon-a-1" />
+        </svg>
+        <svg v-else-if="index === 1" class="icon icon-star-2" aria-hidden="true">
+          <use xlink:href="#icon-a-21" />
+        </svg>
+        <svg v-else-if="index === 2" class="icon icon-star-3" aria-hidden="true">
+          <use xlink:href="#icon-a-3" />
+        </svg>
+        <span v-else class="star-num">{{ index+1 }}</span>
+        <p class="star-info title-item"> 读者{{ item.RDNAME }}近30天借阅图书{{ item.TOTALNUM }}册</p>
+        <p class="star-date">{{ mondayDate }}</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { FetchBorrowStar, FetchReadRanking } from '@/api/library'
+// import { parseTime } from '@/utils/index.js'
+export default {
+  name: 'ReadStar',
+  props: {
+    containerHeight: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {
+      readstarList: [],
+      mondayDate: null
+    }
+  },
+  watch: {
+    // 监听父组件高度变化
+    containerHeight(newVal) {
+      if (newVal > 0) {
+        this.calcDynamicSize(newVal)
+      }
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.getReadRanking()
+    if (this.containerHeight > 0) {
+      this.calcDynamicSize(this.containerHeight)
+    }
+  },
+  methods: {
+    updateHeight(height) {
+      this.calcDynamicSize(height)
+    },
+    // 核心：根据容器高度计算动态尺寸
+    calcDynamicSize(containerHeight) {
+      // 容器高度转rem（假设1rem=100px，根据项目基准调整）
+      const containerRem = containerHeight / 100 || 6.8125
+
+      // 单行高度 = 容器高度 / 列表项数量（假设默认3项）
+      this.itemHeight = containerRem / 3 || 0.5
+
+      // 基础字体大小 = 容器高度的 2.8%
+      this.baseFontSize = containerRem * 0.028 || 0.2
+      this.infoFontSize = containerRem * 0.03 || 0.2
+
+      // 图标尺寸 = 容器高度的 5%
+      this.iconSize = containerRem * 0.05 || 0.35
+      this.iconMargin = containerRem * 0.007 || 0.05
+
+      // 排名数字尺寸 = 容器高度的 3.5%
+      this.numSize = containerRem * 0.035 || 0.25
+      this.numFontSize = containerRem * 0.028 || 0.2
+      this.numMargin = containerRem * 0.035 || 0.25
+
+      // 内边距 = 容器高度的 1.8%
+      this.paddingSize = containerRem * 0.018 || 0.125
+    }, formatDateTime(date, type) {
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+
+      let timePart = '00:00:00'
+      if (type === 'end') {
+        timePart = '23:59:59'
+      }
+
+      return `${year}-${month}-${day} ${timePart}`
+    },
+    getReadRanking() {
+      // const currentDate = new Date() // 获取当前日期
+      // currentDate.setDate(currentDate.getDate() - 30) // 将当前日期减去30天
+      // const year = currentDate.getFullYear() // 获取年份
+      // const month = currentDate.getMonth() + 1 // 获取月份（注意月份从0开始，需要加1）
+      // const day = currentDate.getDate() // 获取日期
+      // const formattedDate = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`
+
+      // const params = {
+      //   'libcode': this.libcode,
+      //   'starttime': formattedDate,
+      //   'endtime': this.getFormattedDate(new Date()),
+      //   'rownum': 6,
+      //   'nordtype': 'JXTSG_E'
+      // }
+
+      // 获取当前日期
+      const currentDate = new Date()
+      currentDate.setDate(currentDate.getDate() - 30) // 将当前日期减去30天
+
+      // 获取开始日期（格式：YYYY-MM-DD 00:00:00）
+      const startDate = encodeURIComponent(this.formatDateTime(currentDate, 'start'))
+
+      // 获取结束日期（格式：YYYY-MM-DD 23:59:59）
+      const endDate = encodeURIComponent(this.formatDateTime(new Date(), 'end'))
+
+      const params = {
+        'libcode': this.libcode,
+        'starttime': startDate,
+        'endtime': endDate,
+        'rownum': 6,
+        'nordtype': 'JXTSG_E'
+      }
+
+      FetchReadRanking(params).then(res => {
+        const result = JSON.parse(res.data)
+
+        if (result.success && result.resultlist.length > 0) {
+          this.readstarList = result.resultlist.sort((a, b) => b.TOTALNUM - a.TOTALNUM).slice(0, 10)
+          // this.rankingDataComputed()
+
+          // this.rankInterval = setInterval(() => {
+          //   this.currentHover = (this.currentHover + 1) % this.rankingData.length
+          // }, 1000)
+          console.log('this.readstarList', this.readstarList)
+          this.getMondayDate()
+        } else {
+          throw new Error('Failed' + this.libcode)
+        }
+      }).catch(error => {
+        console.error('Error', error)
+        return null
+      })
+    },
+    // 获取list
+    getBorrowStar() {
+      FetchBorrowStar().then(res => {
+        if (res.errCode === 0) {
+          console.log(res)
+          this.readstarList = res.data
+          this.getMondayDate()
+        } else {
+          this.$message.error('接口错误')
+        }
+      })
+    },
+    // 获取本周一
+    // getMondayTime() {
+    //   const today = new Date()
+    //   const year = today.getFullYear()
+    //   const month = today.getMonth() // 月份从0开始
+    //   const day = today.getDate()
+    //   const newDate = new Date(year, month, day)
+
+    //   const nowTime = newDate.getTime()
+    //   const weekDay = newDate.getDay() // getDay() 返回的是0（周日）到6（周六）
+    //   const oneDayTime = 24 * 60 * 60 * 1000
+
+    //   // 计算从今天到本周一的天数差
+    //   const daysToMonday = weekDay === 0 ? -6 : 1 - weekDay
+    //   // 计算本周一的时间戳
+    //   const mondayTime = nowTime - daysToMonday * oneDayTime
+    //   // 格式化日期
+    //   this.mondayDate = this.parseTime(mondayTime, '{y}-{m}-{d}')
+    //   console.log('this.mondayDate', this.mondayDate)
+    // },
+    getMondayDate() {
+      const today = new Date()
+      const day = today.getDay()
+
+      // 计算当前日期与本周周一之间的天数差
+      // 如果今天是周日，则差值为6；如果是周六，则差值为5，依此类推
+      const diff = day === 0 ? -6 : 1 - day
+
+      // 减去计算出的天数差，得到本周周一的日期
+      today.setDate(today.getDate() + diff)
+
+      // 返回本周周一的日期，格式化为年-月-日
+      this.mondayDate = today.toISOString().split('T')[0]
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+@import "~@/assets/styles/index.scss";
+</style>
diff --git a/src/views/video/index.vue b/src/views/video/index.vue
index 4c76ae7..d95ab31 100644
--- a/src/views/video/index.vue
+++ b/src/views/video/index.vue
@@ -38,11 +38,12 @@ export default {
       FetchShowFileList(params).then(res => {
         if (res.errCode === 0) {
           // this.src = res.data[0].filePath.replace('D://', 'http://172.16.0.23:8888/')
-          this.srcList = res.data.map(x => x.filePath.replace('D://', 'http://172.22.0.23:8888/'))
+          // this.srcList = res.data.map(x => x.filePath.replace('D://', 'http://172.22.0.23:8888/'))
           // this.srcList = res.data.map(x => x.filePath.replace('D://uploadFile', 'http://localhost:8080/static/'))
           // console.log(22222, this.srcList)
           // this.src = 'D://uploadFile/11503339-b829-4357-8379-d2b49106431f.mp4'.replace('D://', 'http://127.0.0.1:8888/')
           // this.src = 'http://127.0.0.1:8888/uploadFile/9f904de6-0f5e-498e-8e5d-b7e14ea15496.mp4'
+          this.srcList = ['http://127.0.0.1:8888/uploadFile/9f904de6-0f5e-498e-8e5d-b7e14ea15496.mp4']
         } else {
           this.$message.error('接口错误')
         }