diff --git a/src/api/digitalScreen/index.js b/src/api/digitalScreen/index.js
index 5e51b5a..47b9fc0 100644
--- a/src/api/digitalScreen/index.js
+++ b/src/api/digitalScreen/index.js
@@ -17,4 +17,45 @@ export function FetchEditScreenSetting(parameter) {
   })
 }
 
-export default { FetchInitScreenSetting, FetchEditScreenSetting }
+// 智慧大屏图书推荐
+export function FetchInitScreenBookRecommend(params) {
+  return request({
+    url: 'api/screenSetting/initScreenBookRecommend' + '?' + qs.stringify(params, { indices: false }),
+    method: 'get'
+  })
+}
+
+// 编辑智慧大屏图书推荐
+export function FetchEditScreenBookRecommend(parameter) {
+  return request({
+    url: 'api/screenSetting/editScreenBookRecommend',
+    method: 'post',
+    data: parameter
+  })
+}
+
+// 智慧大屏分馆列表
+export function FetchInitScreenBranch(params) {
+  return request({
+    url: 'api/screenSetting/initScreenBranch' + '?' + qs.stringify(params, { indices: false }),
+    method: 'get'
+  })
+}
+
+// 编辑智慧大屏分馆
+export function FetchEditScreenBranch(parameter) {
+  return request({
+    url: 'api/screenSetting/editScreenBranch',
+    method: 'post',
+    data: parameter
+  })
+}
+
+export default {
+  FetchInitScreenSetting,
+  FetchEditScreenSetting,
+  FetchInitScreenBookRecommend,
+  FetchEditScreenBookRecommend,
+  FetchInitScreenBranch,
+  FetchEditScreenBranch
+}
diff --git a/src/assets/images/screen/screen5.png b/src/assets/images/screen/screen5.png
index 58fb03f..ea375cb 100644
Binary files a/src/assets/images/screen/screen5.png and b/src/assets/images/screen/screen5.png differ
diff --git a/src/assets/styles/digitalScreen.scss b/src/assets/styles/digitalScreen.scss
index a5b3049..c1e8972 100644
--- a/src/assets/styles/digitalScreen.scss
+++ b/src/assets/styles/digitalScreen.scss
@@ -99,7 +99,7 @@
     }
   }
   .library-form{
-    padding-left: 70px;
+    padding-left: 100px;
     margin-top: 10px;
     .el-input{
       width: 240px !important;
@@ -195,7 +195,7 @@
   // }
   .book-swiper-wrapper {
     position: relative;
-    width: 100%;
+    // width: 100%;
     // padding: 0 20px;
     max-width: 1140px;
     overflow: visible !important; // 避免意外截断
@@ -208,14 +208,14 @@
     width: 110px;
     height: 160px;
     flex-shrink: 0; // 禁止压缩，保持固定尺寸
-    border: 1px solid #fff;
+    border: 2px solid #fff;
     border-radius: 4px;
     transition: all 0.2s;
     margin: 0 5px;
-    &:hover {
-      border-color: #0348F3; //  hover时高亮边框
-      box-shadow: 0 2px 8px rgba(3, 72, 243, 0.1);
-    }
+    // &:hover {
+    //   border-color: #0348F3; //  hover时高亮边框
+    //   box-shadow: 0 2px 8px rgba(3, 72, 243, 0.1);
+    // }
     img{
       display: block;
       width: 100%;
@@ -242,8 +242,9 @@
         color: #0348F3;
       }
       .icon-weixuan {
-        color: #A6ADB6;
+        color: #fff;
       }
+
     }
 
     .book-delete {
@@ -263,6 +264,17 @@
       }
       border-color: #0348F3;
     }
+
+    &:hover {
+      border-color: #c9d4f0;
+      box-shadow: 0 2px 8px rgba(3, 72, 243, 0.1);
+    }
+
+    &.book-list-item--selected {
+      background:rgba(0,0,0,0.5);
+      border-color: #ED4A41;
+      box-shadow: 0 2px 12px rgba(3, 72, 243, 0.2);
+    }
   }
   .book-upload-btn{
     width: 160px;
@@ -305,6 +317,7 @@
     position: absolute;
     left: 0;
     top: 0;
+    width: 120px;
     height: 120px;
     opacity: 0;
   }
@@ -326,4 +339,9 @@
   & i{
     font-size: 30px;
   }
+}
+
+// 选中时图片轻微缩放增强反馈
+.book-list-item--selected .book-img{
+  transform: scale(0.95);
 }
\ No newline at end of file
diff --git a/src/views/components/upload.vue b/src/views/components/upload.vue
index 9fb5205..ffa2ce1 100644
--- a/src/views/components/upload.vue
+++ b/src/views/components/upload.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-form-item class="book-cover-upload" :label="labelName" prop="cover">
+    <el-form-item v-if="uploadType !== 'other-digital'" class="book-cover-upload" :label="labelName" prop="cover">
       <el-input v-model="fileNames" placeholder="请上传" :readonly="true" />
       <!-- <p :class="['input-style', form.cover === null ? 'error-box' :'']">{{ form.cover }}</p> -->
       <!-- <span v-if="form.cover === null" class="error-tip">请上传图书封面</span> -->
@@ -9,6 +9,11 @@
         <el-button size="small" type="primary"><i class="iconfont icon-shangchuan" />上传</el-button>
       </div>
     </el-form-item>
+
+    <div v-else class="upload-img-input">
+      <input ref="fileInput" type="file" @change="changeFile($event)">
+      <div class="upload-libImg"><i class="iconfont icon-shangchuan2" /><span>点击上传</span></div>
+    </div>
   </div>
 </template>
 
@@ -70,7 +75,7 @@ export default {
         const res = await this.getImgPx(fileBase64)
         this.imageUrl = fileBase64
         this.px = res.width + 'px*' + res.height + 'px'
-        if (this.uploadType === 'book') {
+        if (this.uploadType === 'book' || this.uploadType !== 'other-digital') {
           // 上传附件
           upload(this.baseApi + '/api/fileRelevant/uploadBookImg', this.file).then(res => {
             console.log(res)
@@ -146,6 +151,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import "~@/assets/styles/digitalScreen.scss";
 ::v-deep .book-cover-upload {
   display: flex;
   justify-content: flex-start;
diff --git a/src/views/digitalScreen/index.vue b/src/views/digitalScreen/index.vue
index 419bc70..b6f009d 100644
--- a/src/views/digitalScreen/index.vue
+++ b/src/views/digitalScreen/index.vue
@@ -50,231 +50,210 @@
     </div>
     <transition name="tab-slide" mode="out-in">
       <div :key="activeTab" class="content-area">
-        <div v-if="currentScreenItem">
-          <!-- {{ currentScreenItem.name }}（ID: {{ currentScreenItem.id }}）内容 - 这里是第{{ activeTab + 1 }}个大屏的详细配置 -->
-          <div>
-            <div class="screen-content-title">
-              <h4>{{ currentScreenItem.name }}</h4>
-              <el-tag v-if="currentScreenItem.enabled" type="success">已启用</el-tag>
-              <el-tag v-else type="danger">已停用</el-tag>
-              <p>第<span>{{ activeTab + 1 }}</span>屏 播放时长<span>{{ currentScreenItem.time }}</span>/秒</p>
-            </div>
-            <div class="screen-remarks">
-              <span>简介</span>
-              <p v-if="currentScreenItem.id === 1">{{ currentScreenItem.name }}为系统默认第1屏，主要显示数据包括（按从上到下，从左到右的顺序）：到馆统计、藏书总量、累积办证、粉丝数量、累积借出、热门搜索、图书推荐、微信公众号二维码</p>
-              <p v-if="currentScreenItem.id === 2">{{ currentScreenItem.name }}为系统默认第2屏，主要显示数据包括（按从上到下，从左到右的顺序）：总分馆介绍、区域地图及总分馆定位、读者统计、借阅Top10</p>
-              <p v-if="currentScreenItem.id === 3">{{ currentScreenItem.name }}为系统默认第3屏，主要显示数据包括（按从上到下，从左到右的顺序）：本年累积借阅数量、今日借阅数量、今日借阅趋势、近7日借阅统计</p>
-              <p v-if="currentScreenItem.id === 4">{{ currentScreenItem.name }}为系统默认第4屏，主要显示数据包括（按从上到下，从左到右的顺序）：宣传视频、重要通知、图书借阅排行榜、微信公众号二维码。</p>
-              <p v-if="currentScreenItem.id === 5">{{ currentScreenItem.name }}为系统默认第5屏，整屏显示宣传图片（支持多图片切换）。</p>
-            </div>
-            <div class="area-config">
-              <div v-if="currentScreenItem.id === 1" class="config-item">
-                <div class="config-item-main">
-                  <span class="data-title">到馆统计</span>
-                  <el-radio-group v-model="arrival_library_setting" aria-hidden="false" @change="handleArrivalSettingChange">
-                    <el-radio label="1">本地数据</el-radio>
-                    <el-radio label="2">基数计算</el-radio>
-                    <el-radio label="3">第三方接口</el-radio>
-                  </el-radio-group>
-                </div>
-                <div v-if="arrival_library_setting === '2'" class="library-form">
-                  <!-- 原到馆统计表单 -->
-                  <el-form ref="librarySettingForm" :model="librarySettingForm" :rules="rules" size="small" label-width="100px">
-                    <el-form-item label="本年到馆" prop="visit_base">
-                      <span v-if="!editStatus.librarySettingForm.visit_base" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'visit_base')">
-                        {{ librarySettingForm.visit_base }}
-                      </span>
-                      <el-input v-else ref="librarySettingFormvisit_base" v-model="librarySettingForm.visit_base" type="number" @blur="handleBlur('librarySettingForm', 'visit_base')" @keyup.enter="handleBlur('librarySettingForm', 'visit_base')" />
-                      <el-checkbox v-model="librarySettingForm.visit_base_checked" label="直接显示" name="visit_base_checked" @change="handleCheckboxChange('visit_base', $event)" />
-                    </el-form-item>
-                    <el-form-item label="去年到馆" prop="last_year_visit_base">
-                      <span v-if="!editStatus.librarySettingForm.last_year_visit_base" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'last_year_visit_base')">
-                        {{ librarySettingForm.last_year_visit_base }}
-                      </span>
-                      <el-input v-else ref="librarySettingFormlast_year_visit_base" v-model="librarySettingForm.last_year_visit_base" type="number" @blur="handleBlur('librarySettingForm', 'last_year_visit_base')" @keyup.enter="handleBlur('librarySettingForm', 'last_year_visit_base')" />
-                    </el-form-item>
-                    <el-form-item label="今日到馆" prop="today_visit">
-                      <span v-if="!editStatus.librarySettingForm.today_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'today_visit')">
-                        {{ librarySettingForm.today_visit }}                      </span>
-                      <el-input v-else ref="librarySettingFormtoday_visit" v-model="librarySettingForm.today_visit" type="number" @blur="handleBlur('librarySettingForm', 'today_visit')" @keyup.enter="handleBlur('librarySettingForm', 'today_visit')" />
-                      <el-checkbox v-model="librarySettingForm.today_visit_checked" label="直接显示" name="today_visit_checked" @change="handleCheckboxChange('today_visit', $event)" />
-                    </el-form-item>
-                    <el-form-item label="昨日到馆" prop="yesterday_visit">
-                      <span v-if="!editStatus.librarySettingForm.yesterday_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'yesterday_visit')"> {{ librarySettingForm.yesterday_visit }} </span>
-                      <el-input v-else ref="librarySettingFormyesterday_visit" v-model="librarySettingForm.yesterday_visit" type="number" @blur="handleBlur('librarySettingForm', 'yesterday_visit')" @keyup.enter="handleBlur('librarySettingForm', 'yesterday_visit')" />
-                      <el-checkbox v-model="librarySettingForm.yesterday_visit_checked" label="直接显示" name="yesterday_visit_checked" @change="handleCheckboxChange('yesterday_visit', $event)" />
-                    </el-form-item>
-                    <el-form-item label="本月到馆" prop="this_month_visit">
-                      <span v-if="!editStatus.librarySettingForm.this_month_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'this_month_visit')">
-                        {{ librarySettingForm.this_month_visit }}
-                      </span>
-                      <el-input v-else ref="librarySettingFormthis_month_visit" v-model="librarySettingForm.this_month_visit" type="number" @blur="handleBlur('librarySettingForm', 'this_month_visit')" @keyup.enter="handleBlur('librarySettingForm', 'this_month_visit')" />
-                      <el-checkbox v-model="librarySettingForm.this_month_visit_checked" label="直接显示" name="this_month_visit_checked" @change="handleCheckboxChange('this_month_visit', $event)" />
-                    </el-form-item>
-                    <el-form-item label="上月到馆" prop="last_month_visit">
-                      <span v-if="!editStatus.librarySettingForm.last_month_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'last_month_visit')">
-                        {{ librarySettingForm.last_month_visit }}
-                      </span>
-                      <el-input v-else ref="librarySettingFormlast_month_visit" v-model="librarySettingForm.last_month_visit" type="number" @blur="handleBlur('librarySettingForm', 'last_month_visit')" @keyup.enter="handleBlur('librarySettingForm', 'last_month_visit')" />
-                      <el-checkbox v-model="librarySettingForm.last_month_visit_checked" label="直接显示" name="last_month_visit" @change="handleCheckboxChange('last_month_visit', $event)" />
-                    </el-form-item>
-                  </el-form>
-                  <div class="config-remarks">双击输入框可进行编辑，注意：<br>
-                    如未勾选“直接显示”，系统根据“本年到馆”和“去年到馆”所填数量自动生成：今日到馆、昨日到馆、本月到馆、上月到馆<br>
-                    若勾选了“直接显示”，系统会直接显示用户所填数量值（注意：未填写数量，则显示为“0”）
-                  </div>
-                </div>
+        <!-- {{ currentScreenItem.name }}（ID: {{ currentScreenItem.id }}）内容 - 这里是第{{ activeTab + 1 }}个大屏的详细配置 -->
+        <div>
+          <div class="screen-content-title">
+            <h4>{{ currentScreenItem.name }}</h4>
+            <el-tag v-if="currentScreenItem.enabled" type="success">已启用</el-tag>
+            <el-tag v-else type="danger">已停用</el-tag>
+            <p>第<span>{{ activeTab + 1 }}</span>屏 播放时长<span>{{ currentScreenItem.time }}</span>/秒</p>
+          </div>
+          <div class="screen-remarks">
+            <span>简介</span>
+            <p v-if="currentScreenItem.id === 1">{{ currentScreenItem.name }}为系统默认第1屏，主要显示数据包括（按从上到下，从左到右的顺序）：到馆统计、藏书总量、累积办证、粉丝数量、累积借出、热门搜索、图书推荐、微信公众号二维码</p>
+            <p v-if="currentScreenItem.id === 2">{{ currentScreenItem.name }}为系统默认第2屏，主要显示数据包括（按从上到下，从左到右的顺序）：总分馆介绍、区域地图及总分馆定位、读者统计、借阅Top10</p>
+            <p v-if="currentScreenItem.id === 3">{{ currentScreenItem.name }}为系统默认第3屏，主要显示数据包括（按从上到下，从左到右的顺序）：本年累积借阅数量、今日借阅数量、今日借阅趋势、近7日借阅统计</p>
+            <p v-if="currentScreenItem.id === 4">{{ currentScreenItem.name }}为系统默认第4屏，主要显示数据包括（按从上到下，从左到右的顺序）：宣传视频、重要通知、图书借阅排行榜、微信公众号二维码。</p>
+            <p v-if="currentScreenItem.id === 5">{{ currentScreenItem.name }}为系统默认第5屏，整屏显示宣传图片（支持多图片切换）。</p>
+          </div>
+          <div class="area-config">
+            <div v-if="currentScreenItem.id === 1" class="config-item">
+              <div class="config-item-main">
+                <span class="data-title">到馆统计</span>
+                <el-radio-group v-model="arrival_library_setting" aria-hidden="false" @change="handleArrivalSettingChange">
+                  <el-radio label="1">本地数据</el-radio>
+                  <el-radio label="2">基数计算</el-radio>
+                  <el-radio label="3">第三方接口</el-radio>
+                </el-radio-group>
               </div>
-              <div v-if="currentScreenItem.id !== 5" class="config-item">
-                <div class="config-item-main">
-                  <span class="data-title">图创接口</span>
-                  <!-- 原图创接口表单 -->
-                  <el-form ref="openForm" :model="openForm" size="small" label-width="100px">
-                    <el-form-item label="OpenLib地址" prop="open_lib_http">
-                      <span
-                        v-if="!editStatus.openForm.open_lib_http"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('openForm', 'open_lib_http')"
-                      >
-                        {{ openForm.open_lib_http || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="openFormopen_lib_http"
-                        v-model="openForm.open_lib_http"
-                        @blur="handleBlur('openForm', 'open_lib_http')"
-                        @keyup.enter="handleBlur('openForm', 'open_lib_http')"
-                      />
-                    </el-form-item>
-                    <el-form-item label="AppId" prop="open_lib_appId">
-                      <span
-                        v-if="!editStatus.openForm.open_lib_appId"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('openForm', 'open_lib_appId')"
-                      >
-                        {{ openForm.open_lib_appId || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="openFormopen_lib_appId"
-                        v-model="openForm.open_lib_appId"
-                        @blur="handleBlur('openForm', 'open_lib_appId')"
-                        @keyup.enter="handleBlur('openForm', 'open_lib_appId')"
-                      />
-                    </el-form-item>
-                    <el-form-item label="Secret" prop="open_lib_secret">
-                      <span
-                        v-if="!editStatus.openForm.open_lib_secret"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('openForm', 'open_lib_secret')"
-                      >
-                        {{ openForm.open_lib_secret || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="openFormopen_lib_secret"
-                        v-model="openForm.open_lib_secret"
-                        @blur="handleBlur('openForm', 'open_lib_secret')"
-                        @keyup.enter="handleBlur('openForm', 'open_lib_secret')"
-                      />
-                    </el-form-item>
-                  </el-form>
+              <div v-if="arrival_library_setting === '2'" class="library-form">
+                <!-- 原到馆统计表单 -->
+                <el-form ref="librarySettingForm" :model="librarySettingForm" :rules="rules" size="small" label-width="100px">
+                  <el-form-item label="本年到馆" prop="visit_base">
+                    <span v-if="!editStatus.librarySettingForm.visit_base" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'visit_base')">
+                      {{ librarySettingForm.visit_base }}
+                    </span>
+                    <el-input v-else ref="librarySettingFormvisit_base" v-model="librarySettingForm.visit_base" type="number" @blur="handleBlur('librarySettingForm', 'visit_base')" @keyup.enter="handleBlur('librarySettingForm', 'visit_base')" />
+                    <el-checkbox v-model="librarySettingForm.visit_base_checked" label="直接显示" name="visit_base_checked" @change="handleCheckboxChange('visit_base', $event)" />
+                  </el-form-item>
+                  <el-form-item label="去年到馆" prop="last_year_visit_base">
+                    <span v-if="!editStatus.librarySettingForm.last_year_visit_base" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'last_year_visit_base')">
+                      {{ librarySettingForm.last_year_visit_base }}
+                    </span>
+                    <el-input v-else ref="librarySettingFormlast_year_visit_base" v-model="librarySettingForm.last_year_visit_base" type="number" @blur="handleBlur('librarySettingForm', 'last_year_visit_base')" @keyup.enter="handleBlur('librarySettingForm', 'last_year_visit_base')" />
+                  </el-form-item>
+                  <el-form-item label="今日到馆" prop="today_visit">
+                    <span v-if="!editStatus.librarySettingForm.today_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'today_visit')">
+                      {{ librarySettingForm.today_visit }}                      </span>
+                    <el-input v-else ref="librarySettingFormtoday_visit" v-model="librarySettingForm.today_visit" type="number" @blur="handleBlur('librarySettingForm', 'today_visit')" @keyup.enter="handleBlur('librarySettingForm', 'today_visit')" />
+                    <el-checkbox v-model="librarySettingForm.today_visit_checked" label="直接显示" name="today_visit_checked" @change="handleCheckboxChange('today_visit', $event)" />
+                  </el-form-item>
+                  <el-form-item label="昨日到馆" prop="yesterday_visit">
+                    <span v-if="!editStatus.librarySettingForm.yesterday_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'yesterday_visit')"> {{ librarySettingForm.yesterday_visit }} </span>
+                    <el-input v-else ref="librarySettingFormyesterday_visit" v-model="librarySettingForm.yesterday_visit" type="number" @blur="handleBlur('librarySettingForm', 'yesterday_visit')" @keyup.enter="handleBlur('librarySettingForm', 'yesterday_visit')" />
+                    <el-checkbox v-model="librarySettingForm.yesterday_visit_checked" label="直接显示" name="yesterday_visit_checked" @change="handleCheckboxChange('yesterday_visit', $event)" />
+                  </el-form-item>
+                  <el-form-item label="本月到馆" prop="this_month_visit">
+                    <span v-if="!editStatus.librarySettingForm.this_month_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'this_month_visit')">
+                      {{ librarySettingForm.this_month_visit }}
+                    </span>
+                    <el-input v-else ref="librarySettingFormthis_month_visit" v-model="librarySettingForm.this_month_visit" type="number" @blur="handleBlur('librarySettingForm', 'this_month_visit')" @keyup.enter="handleBlur('librarySettingForm', 'this_month_visit')" />
+                    <el-checkbox v-model="librarySettingForm.this_month_visit_checked" label="直接显示" name="this_month_visit_checked" @change="handleCheckboxChange('this_month_visit', $event)" />
+                  </el-form-item>
+                  <el-form-item label="上月到馆" prop="last_month_visit">
+                    <span v-if="!editStatus.librarySettingForm.last_month_visit" class="edit-readonly" @dblclick="handleDblClick('librarySettingForm', 'last_month_visit')">
+                      {{ librarySettingForm.last_month_visit }}
+                    </span>
+                    <el-input v-else ref="librarySettingFormlast_month_visit" v-model="librarySettingForm.last_month_visit" type="number" @blur="handleBlur('librarySettingForm', 'last_month_visit')" @keyup.enter="handleBlur('librarySettingForm', 'last_month_visit')" />
+                    <el-checkbox v-model="librarySettingForm.last_month_visit_checked" label="直接显示" name="last_month_visit" @change="handleCheckboxChange('last_month_visit', $event)" />
+                  </el-form-item>
+                </el-form>
+                <div class="config-remarks">双击输入框可进行编辑，注意：<br>
+                  如未勾选“直接显示”，系统根据“本年到馆”和“去年到馆”所填数量自动生成：今日到馆、昨日到馆、本月到馆、上月到馆<br>
+                  若勾选了“直接显示”，系统会直接显示用户所填数量值（注意：未填写数量，则显示为“0”）
                 </div>
-                <div class="config-remarks">双击输入框可进行编辑。数据将用于“总览屏”、“区域屏”、“统计屏”、“媒体屏”，在任意分屏编辑均可生效！ </div>
               </div>
-              <div v-if="currentScreenItem.id === 1" class="config-item">
-                <div class="config-item-main">
-                  <span class="data-title">热门搜索</span>
-                  <!-- 原热门搜索表单 -->
-                  <el-form ref="hotForm" :model="hotForm" size="small" label-width="100px">
-                    <el-form-item label="数据来源地址" prop="hot_search_http">
-                      <span
-                        v-if="!editStatus.hotForm.hot_search_http"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('hotForm', 'hot_search_http')"
-                      >
-                        {{ hotForm.hot_search_http || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="hotFormhot_search_http"
-                        v-model="hotForm.hot_search_http"
-                        @blur="handleBlur('hotForm', 'hot_search_http')"
-                        @keyup.enter="handleBlur('hotForm', 'hot_search_http')"
-                      />
-                    </el-form-item>
-                  </el-form>
-                </div>
-                <div class="config-remarks">双击输入框可进行编辑。数据将用于“总览屏”。 </div>
+            </div>
+            <div v-if="currentScreenItem.id !== 5" class="config-item">
+              <div class="config-item-main">
+                <span class="data-title">图创接口</span>
+                <!-- 原图创接口表单 -->
+                <el-form ref="openForm" :model="openForm" size="small" label-width="100px">
+                  <el-form-item label="OpenLib地址" prop="open_lib_http">
+                    <span
+                      v-if="!editStatus.openForm.open_lib_http"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('openForm', 'open_lib_http')"
+                    >
+                      {{ openForm.open_lib_http }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="openFormopen_lib_http"
+                      v-model="openForm.open_lib_http"
+                      @blur="handleBlur('openForm', 'open_lib_http')"
+                      @keyup.enter="handleBlur('openForm', 'open_lib_http')"
+                    />
+                  </el-form-item>
+                  <el-form-item label="AppId" prop="open_lib_appId">
+                    <span
+                      v-if="!editStatus.openForm.open_lib_appId"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('openForm', 'open_lib_appId')"
+                    >
+                      {{ openForm.open_lib_appId }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="openFormopen_lib_appId"
+                      v-model="openForm.open_lib_appId"
+                      @blur="handleBlur('openForm', 'open_lib_appId')"
+                      @keyup.enter="handleBlur('openForm', 'open_lib_appId')"
+                    />
+                  </el-form-item>
+                  <el-form-item label="Secret" prop="open_lib_secret">
+                    <span
+                      v-if="!editStatus.openForm.open_lib_secret"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('openForm', 'open_lib_secret')"
+                    >
+                      {{ openForm.open_lib_secret }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="openFormopen_lib_secret"
+                      v-model="openForm.open_lib_secret"
+                      @blur="handleBlur('openForm', 'open_lib_secret')"
+                      @keyup.enter="handleBlur('openForm', 'open_lib_secret')"
+                    />
+                  </el-form-item>
+                </el-form>
               </div>
-              <div v-if="currentScreenItem.id === 1" class="config-item">
-                <div class="config-item-main">
-                  <span class="data-title">微信绑定</span>
-                  <!-- 原微信绑定表单 -->
-                  <el-form ref="vxForm" :model="vxForm" size="small" label-width="100px">
-                    <el-form-item label="AppID" prop="vx_appID">
-                      <span
-                        v-if="!editStatus.vxForm.vx_appID"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('vxForm', 'vx_appID')"
-                      >
-                        {{ vxForm.vx_appID || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="vxFormvx_appID"
-                        v-model="vxForm.vx_appID"
-                        @blur="handleBlur('vxForm', 'vx_appID')"
-                        @keyup.enter="handleBlur('vxForm', 'vx_appID')"
-                      />
-                    </el-form-item>
-                    <el-form-item label="AppSecret" prop="vx_AppSecret">
-                      <span
-                        v-if="!editStatus.vxForm.vx_AppSecret"
-                        class="edit-readonly"
-                        @dblclick="handleDblClick('vxForm', 'vx_AppSecret')"
-                      >
-                        {{ vxForm.vx_AppSecret || '' }}
-                      </span>
-                      <el-input
-                        v-else
-                        ref="vxFormvx_AppSecret"
-                        v-model="vxForm.vx_AppSecret"
-                        @blur="handleBlur('vxForm', 'vx_AppSecret')"
-                        @keyup.enter="handleBlur('vxForm', 'vx_AppSecret')"
-                      />
-                    </el-form-item>
-                  </el-form>
-                </div>
-                <div class="config-remarks">双击输入框可进行编辑。图书馆公众号AppID、AppSecrect 仅用于“总览屏”显示公众号粉丝数量。</div>
+              <div class="config-remarks">双击输入框可进行编辑。数据将用于“总览屏”、“区域屏”、“统计屏”、“媒体屏”，在任意分屏编辑均可生效！ </div>
+            </div>
+            <div v-if="currentScreenItem.id === 1" class="config-item">
+              <div class="config-item-main">
+                <span class="data-title">热门搜索</span>
+                <!-- 原热门搜索表单 -->
+                <el-form ref="hotForm" :model="hotForm" size="small" label-width="100px">
+                  <el-form-item label="数据来源地址" prop="hot_search_http">
+                    <span
+                      v-if="!editStatus.hotForm.hot_search_http"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('hotForm', 'hot_search_http')"
+                    >
+                      {{ hotForm.hot_search_http }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="hotFormhot_search_http"
+                      v-model="hotForm.hot_search_http"
+                      @blur="handleBlur('hotForm', 'hot_search_http')"
+                      @keyup.enter="handleBlur('hotForm', 'hot_search_http')"
+                    />
+                  </el-form-item>
+                </el-form>
               </div>
-              <div v-if="currentScreenItem.id === 1 || currentScreenItem.id === 4" class="config-item">
-                <div class="config-item-main">
-                  <span class="data-title">二维码</span>
-                  <div class="upload-item" style="margin-bottom: 20px;">
-                    <p>公众号二维码</p>
-                    <div style="display: flex; justify-content: flex-start;">
-                      <img style="display: block; height: 120px; margin-right: 15px;" src="@/assets/images/cover-bg.png" alt="">
-                      <div class="upload-img-input">
-                        <!--  @change="changeAiFile" -->
-                        <input ref="fileInput" type="file" multiple>
-                        <div class="upload-libImg"><i class="iconfont icon-shangchuan2" /><span>点击上传</span></div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-                <div class="config-remarks">双击可上传图片。二维码用于“总览屏”、“媒体屏”，在任意分屏编辑均可生效！</div>
+              <div class="config-remarks">双击输入框可进行编辑。数据将用于“总览屏”。 </div>
+            </div>
+            <div v-if="currentScreenItem.id === 1" class="config-item">
+              <div class="config-item-main">
+                <span class="data-title">微信绑定</span>
+                <!-- 原微信绑定表单 -->
+                <el-form ref="vxForm" :model="vxForm" size="small" label-width="100px">
+                  <el-form-item label="AppID" prop="vx_appID">
+                    <span
+                      v-if="!editStatus.vxForm.vx_appID"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('vxForm', 'vx_appID')"
+                    >
+                      {{ vxForm.vx_appID }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="vxFormvx_appID"
+                      v-model="vxForm.vx_appID"
+                      @blur="handleBlur('vxForm', 'vx_appID')"
+                      @keyup.enter="handleBlur('vxForm', 'vx_appID')"
+                    />
+                  </el-form-item>
+                  <el-form-item label="AppSecret" prop="vx_AppSecret">
+                    <span
+                      v-if="!editStatus.vxForm.vx_AppSecret"
+                      class="edit-readonly"
+                      @dblclick="handleDblClick('vxForm', 'vx_AppSecret')"
+                    >
+                      {{ vxForm.vx_AppSecret }}
+                    </span>
+                    <el-input
+                      v-else
+                      ref="vxFormvx_AppSecret"
+                      v-model="vxForm.vx_AppSecret"
+                      @blur="handleBlur('vxForm', 'vx_AppSecret')"
+                      @keyup.enter="handleBlur('vxForm', 'vx_AppSecret')"
+                    />
+                  </el-form-item>
+                </el-form>
               </div>
-              <bookRecommend v-if="currentScreenItem.id === 1" ref="bookRecommendRef" />
-              <areaSetting v-if="currentScreenItem.id === 2" ref="areaSettingRef" />
-              <mediaSetting v-if="currentScreenItem.id === 4" ref="mediaSettingRef" />
-              <advSetting v-if="currentScreenItem.id === 5" ref="advSettingRef" />
+              <div class="config-remarks">双击输入框可进行编辑。图书馆公众号AppID、AppSecrect 仅用于“总览屏”显示公众号粉丝数量。</div>
             </div>
+            <wecharQrCode v-if="currentScreenItem.id === 1 || currentScreenItem.id === 4" ref="wecharQrCodeRef" :qr-code-url="wecharQrCodeUrl" @triggerInit="initScreenSetting" @ready="onWechatQrCodeReady" />
+            <bookRecommend v-if="currentScreenItem.id === 1" ref="bookRecommendRef" @ready="initScreenBookRecommend" />
+            <areaSetting v-if="currentScreenItem.id === 2" ref="areaSettingRef" :map-data="mapData" @triggerInit="initScreenSetting" @ready="initScreenBranch" />
+            <mediaSetting v-if="currentScreenItem.id === 4" ref="mediaSettingRef" />
+            <advSetting v-if="currentScreenItem.id === 5" ref="advSettingRef" :welcome-play="welcomePlay" @triggerInit="initScreenSetting" />
           </div>
         </div>
-        <div v-else>
-          请选择一个大屏进行配置
-        </div>
       </div>
     </transition>
   </div>
@@ -284,6 +263,7 @@
 import { FetchInitScreenSetting, FetchEditScreenSetting } from '@/api/digitalScreen/index'
 import Sortable from 'sortablejs'
 import previewSetting from './module/previewSetting'
+import wecharQrCode from './module/wecharQrCode'
 import bookRecommend from './module/bookRecommend'
 import areaSetting from './module/areaSetting'
 import mediaSetting from './module/mediaSetting'
@@ -293,6 +273,7 @@ export default {
   name: 'DigitalScreen',
   components: {
     previewSetting,
+    wecharQrCode,
     bookRecommend,
     areaSetting,
     mediaSetting,
@@ -306,11 +287,11 @@ export default {
       originalTitle: '',
       activeTab: 0,
       screenItems: [
-        { id: 1, time: '5', name: '总览屏', enabled: true, editing: false, originalTime: '5' },
-        { id: 2, time: '5', name: '区域屏', enabled: true, editing: false, originalTime: '5' },
-        { id: 3, time: '5', name: '统计屏', enabled: true, editing: false, originalTime: '5' },
-        { id: 4, time: '5', name: '媒体屏', enabled: true, editing: false, originalTime: '5' },
-        { id: 5, time: '5', name: '欢迎屏', enabled: true, editing: false, originalTime: '5' }
+        { id: 1, time: '5', name: '总览屏', enabled: true, editing: false, originalTime: '5', code: 'show1' },
+        { id: 2, time: '5', name: '区域屏', enabled: true, editing: false, originalTime: '5', code: 'show2' },
+        { id: 3, time: '5', name: '统计屏', enabled: true, editing: false, originalTime: '5', code: 'show3' },
+        { id: 4, time: '5', name: '媒体屏', enabled: true, editing: false, originalTime: '5', code: 'show4' },
+        { id: 5, time: '5', name: '欢迎屏', enabled: true, editing: false, originalTime: '5', code: 'show5' }
       ],
       editingLock: false,
       prevActiveTab: 0,
@@ -339,7 +320,9 @@ export default {
         vx_appID: null,
         vx_AppSecret: null
       },
-      vxImageUrl: '',
+      wecharQrCodeUrl: null,
+      mapData: null,
+      welcomePlay: null,
       editStatus: {
         openForm: {
           open_lib_http: false,
@@ -361,7 +344,6 @@ export default {
           yesterday_visit: null,
           this_month_visit: null,
           last_month_visit: null,
-          // 新增：复选框绑定的属性（必须提前声明）
           visit_base_checked: false, // 对应“本年到馆”的“直接显示”
           today_visit_checked: false, // 对应“今日到馆”的“直接显示”
           yesterday_visit_checked: false, // 对应“昨日到馆”的“直接显示”
@@ -370,6 +352,7 @@ export default {
         }
       },
       originalValues: {
+        title: '',
         openForm: {},
         hotForm: {},
         vxForm: {},
@@ -404,10 +387,10 @@ export default {
   },
   created() {
     this.initTitle()
-    this.initScreenSetting()
   },
   mounted() {
     this.$nextTick(() => {
+      this.initScreenSetting()
       this.draggableScreen()
       if (this.$refs.bookRecommendRef) {
         this.$refs.bookRecommendRef.updateBookSwiper()
@@ -415,152 +398,126 @@ export default {
     })
   },
   methods: {
-    // checked(val) {
-    //   // 1. 先同步更新数据
-    //   this.librarySettingForm.visit_base_checked = val
-    //   console.log('数据已更新：', this.librarySettingForm.visit_base_checked)
-
-    //   // 2. 强制触发DOM更新
-    //   this.$nextTick(() => {
-    //     // 这里可以写需要依赖最新DOM的逻辑（可选）
-    //     console.log('DOM已同步更新')
-    //   })
-    // },
+    initScreenBranch() {
+      this.$refs.areaSettingRef.initScreenBranch()
+    },
+    initScreenBookRecommend() {
+      this.$refs.bookRecommendRef.initScreenBookRecommend()
+    },
+    onWechatQrCodeReady() {
+      this.$refs.wecharQrCodeRef.reloadImage()
+    },
     // 初始化智慧大屏基本数据
     initScreenSetting() {
       FetchInitScreenSetting().then(res => {
-        console.log('初始化', res)
-        // 遍历接口返回的所有数据
+        const showScreenItem = Object.values(res).find(item => item.code === 'show_screen')
+        if (showScreenItem) {
+          // 处理显示状态（context）
+          if (showScreenItem.context) {
+            const enabledIds = showScreenItem.context.split(',').map(Number)
+            this.screenItems.forEach(item => {
+              item.enabled = enabledIds.includes(item.id)
+            })
+          }
+
+          // 处理显示顺序（remarks）
+          if (showScreenItem.remarks) {
+            const orderIds = showScreenItem.remarks.split(',').map(Number)
+            // 按照remarks指定的顺序重新排列screenItems
+            this.screenItems.sort((a, b) => {
+              return orderIds.indexOf(a.id) - orderIds.indexOf(b.id)
+            })
+          }
+        }
+
         Object.values(res).forEach(item => {
           const { code, context } = item
-          // 根据code匹配对应表单字段并赋值
-          switch (code) {
-            // 到馆统计相关
-            case 'arrival_library_setting':
-              this.arrival_library_setting = context
-              break
-            case 'visit_base':
-              this.librarySettingForm.visit_base = context
-              break
-            case 'last_year_visit_base':
-              this.librarySettingForm.last_year_visit_base = context
-              break
-            case 'today_visit':
-              this.librarySettingForm.today_visit = context
-              break
-            case 'yesterday_visit':
-              this.librarySettingForm.yesterday_visit = context
-              break
-            case 'this_month_visit':
-              this.librarySettingForm.this_month_visit = context
-              break
-            case 'last_month_visit':
-              this.librarySettingForm.last_month_visit = context
-              break
-
-              // 图创接口相关
-            case 'open_lib_http':
-              this.openForm.open_lib_http = context
-              break
-            case 'open_lib_appId':
-              this.openForm.open_lib_appId = context
-              break
-            case 'open_lib_secret':
-              this.openForm.open_lib_secret = context
-              break
-
-              // 热门搜索相关
-            case 'hot_search_http':
-              this.hotForm.hot_search_http = context
-              break
-
-              // 微信绑定相关
-            case 'vx_appID':
-              this.vxForm.vx_appID = context
-              break
-            case 'vx_AppSecret':
-              this.vxForm.vx_AppSecret = context
-              break
-
-              // 公众号二维码（如有需要可处理）
-            case 'wechar_qr_code':
-              this.vxImageUrl = context // 假设用于展示二维码图片
-              break
-
-              // 大屏显示时长相关（show1-show5对应5个大屏的时长）
-            case 'show1':
-              if (this.screenItems[0]) this.screenItems[0].time = context
-              break
-            case 'show2':
-              if (this.screenItems[1]) this.screenItems[1].time = context
-              break
-            case 'show3':
-              if (this.screenItems[2]) this.screenItems[2].time = context
-              break
-            case 'show4':
-              if (this.screenItems[3]) this.screenItems[3].time = context
-              break
-            case 'show5':
-              if (this.screenItems[4]) this.screenItems[4].time = context
-              break
-
-              // 大屏启用状态（show_screen格式为"1,2,3,4"，表示启用的大屏ID）
-            case 'show_screen':
-              if (context) {
-                const enabledIds = context.split(',').map(Number)
-                this.screenItems.forEach(item => {
-                  item.enabled = enabledIds.includes(item.id)
-                })
-              }
-              break
+          // 处理标题
+          if (code === 'screen_title') {
+            this.screen_title = context
+            this.originalTitle = this.screen_title
+            this.originalValues.title = this.screen_title
+            return
+          }
+
+          // 处理到馆统计相关
+          if (code === 'arrival_library_setting') {
+            this.arrival_library_setting = context
+            return
+          }
+
+          // 处理各个屏幕的显示时间（show1-show5）
+          if (code.startsWith('show') && !isNaN(parseInt(code.replace('show', '')))) {
+            const screenId = parseInt(code.replace('show', ''))
+            const screenItem = this.screenItems.find(item => item.id === screenId)
+            if (screenItem) {
+              screenItem.time = context || '5' // 默认5秒
+              screenItem.originalTime = screenItem.time // 同步originalTime
+            }
+            return
+          }
+
+          // 处理到馆统计表单字段
+          if (['visit_base', 'last_year_visit_base', 'today_visit', 'yesterday_visit', 'this_month_visit', 'last_month_visit'].includes(code)) {
+            this.$set(this.librarySettingForm, code, context)
+            return
+          }
+
+          // 处理图创接口相关
+          if (code === 'open_lib_http') {
+            this.openForm.open_lib_http = context
+          } else if (code === 'open_lib_appId') {
+            this.openForm.open_lib_appId = context
+          } else if (code === 'open_lib_secret') {
+            this.openForm.open_lib_secret = context
+          }
+
+          // 处理热门搜索相关
+          if (code === 'hot_search_http') {
+            this.hotForm.hot_search_http = context
+          }
+
+          // 处理微信绑定相关
+          if (code === 'vx_appID') {
+            this.vxForm.vx_appID = context
+          } else if (code === 'vx_AppSecret') {
+            this.vxForm.vx_AppSecret = context
+          }
+
+          // 处理公众号二维码
+          if (code === 'wechar_qr_code') {
+            this.wecharQrCodeUrl = context
+          }
+
+          if (code === 'map_data') {
+            this.mapData = context
+          }
+
+          if (code === 'welcome_play') {
+            this.welcomePlay = context
           }
         })
-        // 在initScreenSetting方法中，替换原处理逻辑
 
-        // 例如在初始化数据时（initScreenSetting中），替换直接赋值为this.$set
         Object.values(res).forEach(item => {
           const { code, context, remarks } = item
           if (['visit_base', 'today_visit', 'yesterday_visit', 'this_month_visit', 'last_month_visit'].includes(code)) {
-            // 用$set更新基础属性
             this.$set(this.librarySettingForm, code, context)
-            // 用$set更新复选框属性（关键）
             this.$set(this.librarySettingForm, `${code}_checked`, remarks === '1')
           }
         })
       }).catch(() => {
       })
     },
-
-    handleTabClick(index) {
-      // 如果是双击事件，则不执行Tab切换
-      if (this.isDoubleClick) {
-        this.isDoubleClick = false
-        return
-      }
-      this.prevActiveTab = this.activeTab // 记录当前激活的标签
-      this.activeTab = index
-
-      this.$nextTick(() => {
-        if (this.currentScreenItem && this.currentScreenItem.id === 5) {
-          if (this.$refs.advSettingRef) {
-            this.$refs.advSettingRef.updateSwiper()
-          }
-        } else if (this.currentScreenItem && this.currentScreenItem.id === 1) {
-          if (this.$refs.bookRecommendRef) {
-            this.$refs.bookRecommendRef.updateBookSwiper()
-          }
-        }
-      })
-    },
-
+    // 大屏标题
     initTitle() {
-      this.screen_title = '默认大屏标题'
+      this.screen_title = '' // 默认空字符串
       this.originalTitle = this.screen_title
+      this.originalValues.title = this.screen_title
     },
-
     handleTitleDblClick() {
       this.isEditable = true
       this.originalTitle = this.screen_title
+      this.originalValues.title = this.screen_title
       this.$nextTick(() => {
         const titleInput = this.$refs.titleInput
         if (titleInput) {
@@ -570,49 +527,184 @@ export default {
     },
     handleTitleBlur() {
       this.isEditable = false
-      if (this.screen_title !== this.originalTitle) {
-        this.updateTitle()
-      }
-    },
-
-    updateTitle() {
       if (this.screen_title.length > 17) {
         this.$message.warning('标题不能超过17个字，请修改！')
         this.screen_title = this.originalTitle
         return
       }
 
-      console.log('更新标题接口调用，新标题：', this.screen_title)
-      this.originalTitle = this.screen_title
-      this.$message.success('标题更新成功！')
+      if (this.screen_title !== this.originalTitle) {
+        this.saveEdit('title', 'screen_title')
+      }
+    },
+    handleTabClick(index) {
+      // 如果是双击事件，则不执行Tab切换
+      if (this.isDoubleClick) {
+        this.isDoubleClick = false
+        return
+      }
+      this.prevActiveTab = this.activeTab
+      this.activeTab = index
+
+      this.$nextTick(() => {
+        if (this.currentScreenItem && this.currentScreenItem.id === 1) {
+          if (this.$refs.bookRecommendRef) {
+            this.$refs.bookRecommendRef.updateBookSwiper()
+          }
+        } else if (this.currentScreenItem && this.currentScreenItem.id === 5) {
+          if (this.$refs.advSettingRef) {
+            this.$refs.advSettingRef.updateSwiper()
+          }
+        }
+      })
     },
-    // 大屏是否启用
+    // handleTabClick(index) {
+    //   if (this.isDoubleClick) {
+    //     this.isDoubleClick = false
+    //     return
+    //   }
+
+    //   const prevTab = this.activeTab
+    //   this.activeTab = index
+
+    //   if (prevTab === index) {
+    //     return
+    //   }
+
+    //   this.$nextTick(() => {
+    //     const currentId = this.currentScreenItem?.id
+    //     if (!currentId) return
+    //     switch (currentId) {
+    //       case 1:
+    //         this.handleScreen1()
+    //         break
+    //       case 4:
+    //         this.handleScreen4()
+    //         break
+    //       case 5:
+    //         this.handleScreen5()
+    //         break
+    //     }
+    //   })
+    // },
+
+    // // 处理ID=1的屏幕（总览屏）
+    // handleScreen1() {
+    //   if (this.$refs.bookRecommendRef) {
+    //     this.$refs.bookRecommendRef.updateBookSwiper()
+    //   } else {
+    //     console.warn('bookRecommend组件未渲染（ID=1屏幕）')
+    //   }
+    //   this.refreshWechatQrCode()
+    // },
+    // // 处理ID=1的屏幕
+    // handleScreen4() {
+    //   this.refreshWechatQrCode()
+    // },
+
+    // // 处理ID=5的屏幕（欢迎屏）
+    // handleScreen5() {
+    //   if (this.$refs.advSettingRef) {
+    //     this.$refs.advSettingRef.updateSwiper()
+    //   } else {
+    //     console.warn('advSetting组件未渲染（ID=5屏幕）')
+    //   }
+    // },
+
+    // refreshWechatQrCode() {
+    //   if (this.$refs.wecharQrCodeRef) {
+    //     this.$refs.wecharQrCodeRef.reloadImage()
+    //   } else {
+    //     console.log('wecharQrCode组件尚未渲染或无需渲染')
+    //   }
+    // },
+    // 大屏是否启用 - 修改后也需要提交show_screen
     toggleScreenStatus(index) {
+      const currentEnabledCount = this.enabledCount
+
+      if (this.screenItems[index].enabled && currentEnabledCount <= 1) {
+        this.$message.warning('至少需要启用一个大屏')
+        return
+      }
+
+      // 正常切换状态
       this.screenItems[index].enabled = !this.screenItems[index].enabled
       const statusText = this.screenItems[index].enabled ? '启用' : '停用'
-      this.$message.info(`大屏${index + 1}已${statusText}`)
+      this.$message.info(`大屏${index + 1}-即${this.screenItems[index].name}已${statusText}`)
+
+      this.submitScreenOrderAndStatus()
     },
     // 大屏拖拽排序
     draggableScreen() {
-      const tbody = document.querySelector('.config-screen')
+      const container = document.querySelector('.config-screen')
       const that = this
-      Sortable.create(tbody, {
+      let originalOrder = [...this.screenItems.map(item => item.id)]
+      Sortable.create(container, {
         draggable: '.config-screen-item',
+        animation: 150,
+        onStart() {
+          originalOrder = [...that.screenItems.map(item => item.id)]
+        },
         onEnd({ newIndex, oldIndex }) {
           if (newIndex === oldIndex) return
+
           const activeItemId = that.screenItems[that.activeTab].id
           // 执行元素移动操作
           const movedItem = that.screenItems.splice(oldIndex, 1)[0]
           that.screenItems.splice(newIndex, 0, movedItem)
+
           // 查找原激活项在新数组中的索引
           const newActiveIndex = that.screenItems.findIndex(item => item.id === activeItemId)
-          // 更新激活的Tab索引
           if (newActiveIndex !== -1) {
             that.activeTab = newActiveIndex
           }
+
+          // 检查顺序是否真的发生了变化
+          const newOrder = [...that.screenItems.map(item => item.id)]
+          if (!that.arraysEqual(originalOrder, newOrder)) {
+            // 顺序变化，提交show_screen数据
+            that.submitScreenOrderAndStatus()
+          }
         }
       })
     },
+    // 辅助方法：判断两个数组是否相等
+    arraysEqual(arr1, arr2) {
+      if (arr1.length !== arr2.length) return false
+      for (let i = 0; i < arr1.length; i++) {
+        if (arr1[i] !== arr2[i]) return false
+      }
+      return true
+    },
+    // 提交屏幕顺序和状态到show_screen
+    submitScreenOrderAndStatus() {
+      // 1. 收集显示的屏幕ID（enabled为true的）
+      const enabledIds = this.screenItems
+        .filter(item => item.enabled)
+        .map(item => item.id)
+        .join(',')
+
+      // 2. 收集所有屏幕的顺序（无论是否启用）
+      const orderIds = this.screenItems
+        .map(item => item.id)
+        .join(',')
+
+      // 3. 调用saveEdit提交，使用specialFields表单类型
+      const formName = 'specialFields'
+      const field = 'show_screen'
+
+      // 记录原始值用于可能的回滚
+      if (!this.originalValues[formName]) {
+        this.originalValues[formName] = {}
+      }
+      this.originalValues[formName][field] = {
+        context: enabledIds,
+        remarks: orderIds
+      }
+
+      // 调用saveEdit提交
+      this.saveEdit(formName, field)
+    },
     // 大屏展示时间操作
     handleTimeClick(event) {
     // 阻止事件冒泡
@@ -657,40 +749,47 @@ export default {
         }
       })
     },
-
     handleTimeBlur(item) {
+      // 验证时长有效性
       if (item.time === '' || isNaN(item.time) || parseInt(item.time) <= 0) {
         this.$message.warning('播放时长必须为大于0的数字')
         item.time = item.originalTime
       } else {
+        // 转换为整数字符串（避免出现小数）
+        item.time = parseInt(item.time).toString()
+        // 只有当值发生变化时才提交
         if (item.time !== item.originalTime) {
-          item.time = parseInt(item.time).toString()
-          this.updateScreenTime(item)
+          this.submitScreenTime(item)
         }
       }
       item.editing = false
     },
-    updateScreenTime(item) {
-      console.log(`更新大屏${item.id}播放时长为${item.time}秒`)
-      this.$message.success(`大屏${item.id}播放时长已更新`)
+    // 提交屏幕时长到对应show1-show5
+    submitScreenTime(item) {
+      // 使用specialFields表单类型
+      const formName = 'specialFields'
+      const field = item.code
+
+      // 记录原始值用于可能的回滚
+      if (!this.originalValues[formName]) {
+        this.originalValues[formName] = {}
+      }
+      this.originalValues[formName][field] = item.originalTime
+
+      // 调用saveEdit提交
+      this.saveEdit(formName, field)
     },
-    // 双击进入编辑模式
+    // 其他表单编辑框
     handleDblClick(formName, field) {
-    // 记录原始值（用于恢复）
       this.originalValues[formName][field] = this[formName][field]
-      // 开启编辑状态
       this.editStatus[formName][field] = true
-      // 聚焦输入框
       this.$nextTick(() => {
         const input = this.$refs[`${formName}${field}`]
         if (input) input.focus()
       })
     },
-    // 失焦/回车保存编辑
     handleBlur(formName, field) {
-    // 关闭编辑状态
       this.editStatus[formName][field] = false
-      // 对比新值与原始值，有变化则执行保存逻辑
       if (this[formName][field] !== this.originalValues[formName][field]) {
         this.saveEdit(formName, field)
       }
@@ -700,87 +799,137 @@ export default {
       const virtualFormName = 'specialFields'
       const field = 'arrival_library_setting'
 
-      // 初始化原始值（如果尚未初始化）
-      if (this.originalValues[virtualFormName] === undefined) {
+      // 初始化原始值（仅首次）
+      if (!this.originalValues[virtualFormName]) {
         this.originalValues[virtualFormName] = {}
       }
       if (this.originalValues[virtualFormName][field] === undefined) {
         this.originalValues[virtualFormName][field] = this.arrival_library_setting
       }
 
-      // 调用现有的 saveEdit 方法处理保存逻辑
       this.saveEdit(virtualFormName, field)
     },
-
-    // 保持原有的 saveEdit 方法不变
+    handleCheckboxChange(field, checked) {
+      this.$set(this.librarySettingForm, `${field}_checked`, checked)
+      this.saveEdit('librarySettingForm', field)
+    },
     saveEdit(formName, field) {
-      const value = this[formName === 'specialFields' ? field : `${formName}.${field}`]
-      console.log(`保存${formName}.${field}：`, value)
+      let code = field
+      let context
+      let remarks = ''
 
-      // 对于单选框组，0/1/2/3等值都是有效的，不需要验证非空
-      if (formName !== 'specialFields' && !value) {
-        this.$message.warning(`${this.getFieldLabel(formName, field)}不能为空`)
-        this[formName][field] = this.originalValues[formName][field]
-        return
+      // 处理标题特殊情况
+      if (formName === 'title') {
+        code = 'screen_title'
+        context = this.screen_title
+      } else if (formName === 'specialFields' && field === 'show_screen') {
+        // 处理show_screen特殊情况
+        context = this.originalValues[formName][field].context
+        remarks = this.originalValues[formName][field].remarks
+      } else if (formName === 'specialFields' && field.startsWith('show')) {
+        // 处理show1-show5时长提交
+        // 从screenItems中找到对应的屏幕获取time
+        const screenItem = this.screenItems.find(item => item.code === field)
+        context = screenItem ? screenItem.time : '5' // 默认5秒
+      } else if (formName === 'specialFields') {
+        // 处理其他特殊字段（如arrival_library_setting）
+        context = this[field]
+      } else {
+        // 处理普通表单字段
+        context = this[formName][field]
+        if (formName === 'librarySettingForm') {
+          remarks = this[formName][`${field}_checked`] ? '1' : '0'
+        }
       }
 
-      // 定义“空值”（排除0，允许0作为有效值）
-      const isEmpty = value === '' || value === null || value === undefined
-
-      // 非空验证（图书馆字段允许0，但不允许空）
-      if (formName === 'librarySettingForm' && isEmpty) {
+      // 2. 校验必填项和特殊规则
+      // 对于show_screen，至少需要启用一个屏幕
+      if (formName === 'specialFields' && field === 'show_screen') {
+        if (!context) {
+          this.$message.warning('至少需要启用一个大屏')
+          return
+        }
+      } else if (formName === 'specialFields' && field.startsWith('show')) {
+        // 对于show1-show5，校验时长有效性
+        if (!context || isNaN(context) || parseInt(context) <= 0) {
+          this.$message.warning('播放时长必须为大于0的数字')
+          this.rollbackValue(formName, field)
+          return
+        }
+      } else if (!context && context !== 0) {
+        // 其他字段的非空校验
         this.$message.warning(`${this.getFieldLabel(formName, field)}不能为空`)
-        this[formName][field] = this.originalValues[formName][field]
+        this.rollbackValue(formName, field)
         return
       }
 
-      // 图书馆表单的处理（关键）
-      const checkBoxField = `${field}_checked` // 关联的复选框字段
-      const isChecked = this[formName][checkBoxField] // 复选框状态
-
-      // 构造提交参数（核心：处理remarks）
-      const param = {
-        code: field,
-        context: value,
-        remarks: isChecked ? '1' : '0' // 同步复选框状态
-      }
+      // 3. 构建提交参数
+      const submitParam = { code, context, remarks }
 
-      if (formName === 'librarySettingForm') {
-        const checkBoxField = `${field}_checked`
-        param.remarks = this[formName][checkBoxField] ? '1' : '0'
-      }
-
-      // 提交保存
-      FetchEditScreenSetting(param).then(res => {
-        this.$message.success(`${this.getFieldLabel(formName, field)}更新成功`)
-      }).catch(() => {
-        this.$message.error(`${this.getFieldLabel(formName, field)}更新失败`)
-        this[formName][field] = this.originalValues[formName][field]
-      })
-    },
-    // 复选框状态变化时的处理函数
-    handleCheckboxChange(code, checked) {
-      this.$set(this.librarySettingForm, `${code}_checked`, checked)
-      this.saveCheckboxStatus(code, checked)
+      // 4. 调用接口保存
+      FetchEditScreenSetting(submitParam)
+        .then(() => {
+          this.$message.success(`${this.getFieldLabel(formName, field)}更新成功`)
+          // 更新原始值为新值
+          if (formName === 'title') {
+            this.originalTitle = this.screen_title
+            this.originalValues.title = this.screen_title
+          } else if (formName === 'specialFields' && field.startsWith('show') && field !== 'show_screen') {
+            // 更新屏幕的originalTime
+            const screenItem = this.screenItems.find(item => item.code === field)
+            if (screenItem) {
+              screenItem.originalTime = context
+            }
+            this.originalValues[formName][field] = context
+          } else if (formName !== 'specialFields' || field !== 'show_screen') {
+            this.originalValues[formName][field] = context
+          }
+        })
+        .catch(() => {
+          this.$message.error(`${this.getFieldLabel(formName, field)}更新失败`)
+          this.rollbackValue(formName, field)
+        })
     },
-    saveCheckboxStatus(code, checked) {
-      const param = {
-        code: code, // 关联的基础字段（如visit_base）
-        context: this.librarySettingForm[code], // 基础字段的值
-        remarks: checked ? '1' : '0' // 转为后端需要的'1'/'0'
+    // 新增：回滚值的通用方法
+    rollbackValue(formName, field) {
+      if (this.originalValues[formName]?.[field] !== undefined) {
+        if (formName === 'title') {
+          this.screen_title = this.originalValues[formName][field]
+        } else if (formName === 'specialFields' && field.startsWith('show') && field !== 'show_screen') {
+          // 回滚屏幕时长
+          const screenItem = this.screenItems.find(item => item.code === field)
+          if (screenItem) {
+            screenItem.time = this.originalValues[formName][field]
+            screenItem.originalTime = this.originalValues[formName][field]
+          }
+        } else if (formName === 'specialFields') {
+          this[field] = this.originalValues[formName][field]
+        } else {
+          this[formName][field] = this.originalValues[formName][field]
+          // 回滚复选框状态
+          if (formName === 'librarySettingForm') {
+            const originalChecked = this.originalValues[formName][`${field}_checked`]
+            if (originalChecked !== undefined) {
+              this[formName][`${field}_checked`] = originalChecked
+            }
+          }
+        }
       }
-
-      FetchEditScreenSetting(param).then(res => {
-        this.$message.success(`"${this.getFieldLabel('librarySettingForm', code)}"的直接显示状态已更新`)
-      }).catch(() => {
-        this.$message.error('状态更新失败')
-        // 失败时回滚状态
-        this.$set(this.librarySettingForm, `${code}_checked`, !checked)
-      })
     },
-    //   获取字段显示名称（用于提示信息）
     getFieldLabel(formName, field) {
       const labels = {
+        title: {
+          screen_title: '大屏标题'
+        },
+        specialFields: {
+          arrival_library_setting: '到馆统计设置',
+          show_screen: '大屏显示设置',
+          show1: '总览屏播放时长',
+          show2: '区域屏播放时长',
+          show3: '统计屏播放时长',
+          show4: '媒体屏播放时长',
+          show5: '欢迎屏播放时长'
+        },
         openForm: {
           open_lib_http: 'OpenLib地址',
           open_lib_appId: 'AppId',
@@ -800,9 +949,6 @@ export default {
           yesterday_visit: '昨日到馆',
           this_month_visit: '本月到馆',
           last_month_visit: '上月到馆'
-        },
-        specialFields: {
-          arrival_library_setting: '到馆统计设置'
         }
       }
       return labels[formName][field] || field
@@ -935,7 +1081,7 @@ export default {
 
 // 内容区域样式 + 过渡动画
 .content-area {
-  height: 520px;
+  height: 510px;
   border-radius: 4px;
   width: 100%;
   overflow-y: scroll;
diff --git a/src/views/digitalScreen/module/addBookDialog.vue b/src/views/digitalScreen/module/addBookDialog.vue
index 37f48aa..5405e21 100644
--- a/src/views/digitalScreen/module/addBookDialog.vue
+++ b/src/views/digitalScreen/module/addBookDialog.vue
@@ -3,8 +3,8 @@
     <div class="setting-dialog">
       <el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="90px">
         <div style="width: 696px;">
-          <el-form-item label="题名" prop="title">
-            <el-input v-model="form.title" placeholder="请输入" />
+          <el-form-item label="题名" prop="name">
+            <el-input v-model="form.name" placeholder="请输入" />
           </el-form-item>
           <el-form-item label="著者" prop="author">
             <el-input v-model="form.author" placeholder="请输入" />
@@ -12,11 +12,11 @@
           <el-form-item label="ISBN" prop="isbn">
             <el-input v-model="form.isbn" placeholder="请输入" />
           </el-form-item>
-          <el-form-item label="分类号" prop="classNo">
-            <el-input v-model="form.classNo" placeholder="请输入" />
+          <el-form-item label="分类号" prop="callnos">
+            <el-input v-model="form.callnos" placeholder="请输入" />
           </el-form-item>
-          <el-form-item label="出版年份" prop="publishYear">
-            <el-input v-model="form.publishYear" placeholder="请输入" />
+          <el-form-item label="出版年份" prop="publisherdate">
+            <el-input v-model="form.publisherdate" placeholder="请输入" />
           </el-form-item>
           <div>
             <el-form-item label="出版社" prop="publisher">
@@ -24,13 +24,13 @@
             </el-form-item>
           </div>
           <div>
-            <el-form-item label="简介" prop="remarks">
-              <el-input v-model="form.remarks" type="textarea" row="4" placeholder="请输入" style="width: 586px;" />
+            <el-form-item label="简介" prop="explain">
+              <el-input v-model="form.explain" type="textarea" row="4" placeholder="请输入" style="width: 586px;" />
             </el-form-item>
           </div>
           <UploadCover :label-name="labelName" :form="form" upload-type="book" @childCover="handleCover" />
         </div>
-        <div v-if="form.bookCover" class="preview-cover">
+        <div v-if="form.imgPath" class="preview-cover">
           <p>封面预览</p>
           <img :src="bookCover" alt="">
         </div>
@@ -45,6 +45,7 @@
 </template>
 
 <script>
+import { FetchEditScreenBookRecommend } from '@/api/digitalScreen/index'
 import UploadCover from '@/views/components/upload.vue'
 import { mapGetters } from 'vuex'
 
@@ -55,11 +56,11 @@ export default {
     return {
       btnLoading: false,
       addBookDialogVisible: false,
-      form: { id: null, title: null, author: null, isbn: null, classNo: null, publishYear: null, publisher: null, bookCover: null, bookRecNo: null, remarks: null },
+      form: { id: null, name: null, author: null, isbn: null, callnos: null, publisherdate: null, publisher: null, imgPath: null, explain: null },
       bookCover: null,
       labelName: '图书封面',
       rules: {
-        title: [
+        name: [
           { required: true, message: '题名不可为空', trigger: 'blur' }
         ],
         // author: [
@@ -68,7 +69,7 @@ export default {
         isbn: [
           { required: true, message: 'ISBN不可为空', trigger: 'blur' }
         ]
-        // classNo: [
+        // callnos: [
         //   { required: true, message: '分类号不可为空', trigger: 'blur' }
         // ],
         // publisher: [
@@ -88,10 +89,10 @@ export default {
     handleCover(value) {
       console.log(value)
       if (value) {
-        this.form.bookCover = value
-        this.bookCover = this.baseApi + '/api/fileRelevant/getImg?imgType=2&imgId=' + value + '.jpg'
+        this.form.imgPath = value
+        this.bookCover = this.baseApi + '/api/fileRelevant/getImg?imgType=2&imgId=' + value
       } else {
-        this.form.bookCover = null
+        this.form.imgPath = null
         this.bookCover = null
       }
     },
@@ -102,22 +103,18 @@ export default {
       this.$refs.form.validate((valid) => {
         if (valid) {
           this.addBookDialogVisible = false
-          // const ids = []
-          // this.selectBookData.forEach(val => {
-          //   ids.push(val.id)
-          // })
-          // const params = {
-          //   'gridId': this.selectGridVal.id,
-          //   'ids': ids
-          // }
-          // console.log('params', params)
-          // FetchManualShelving(params).then(() => {
-          //   this.$message({ message: '批量上架成功', type: 'success', offset: 8 })
-          //   this.handleCloseDialog()
-          // }).catch(err => {
-          //   console.log(err)
-          //   this.addBookDialogVisible = false
-          // })
+          console.log(this.form)
+          FetchEditScreenBookRecommend(this.form).then((res) => {
+            if (res.code !== 500) {
+              this.$message({ message: '推荐图书新增成功', type: 'success', offset: 8 })
+            } else {
+              this.$message({ message: res.message, type: 'error', offset: 8 })
+            }
+            this.handleClose()
+          }).catch(err => {
+            console.log(err)
+            this.addBookDialogVisible = false
+          })
         } else {
           console.log('error submit!!')
           return false
diff --git a/src/views/digitalScreen/module/advSetting.vue b/src/views/digitalScreen/module/advSetting.vue
index 5f5ea0a..d74db73 100644
--- a/src/views/digitalScreen/module/advSetting.vue
+++ b/src/views/digitalScreen/module/advSetting.vue
@@ -4,12 +4,12 @@
       <div class="config-item-main">
         <span class="data-title">播放设置</span>
         <el-form ref="advForm" class="advForm" :model="advForm" size="small" label-width="100px">
-          <el-form-item label="图片切换时长" prop="time">
-            <div v-if="!editStatus.advForm.time" style="display: flex; justify-content: flex-start; width: 340px; height: 32px; align-items: flex-start;">
-              <span class="edit-readonly" @dblclick="handleDblClick('advForm', 'time')"> {{ advForm.time || '' }} </span>
+          <el-form-item label="图片切换时长" prop="welcome_play">
+            <div v-if="!editStatus.advForm.welcome_play" style="display: flex; justify-content: flex-start; width: 340px; height: 32px; align-items: flex-start;">
+              <span class="edit-readonly" @dblclick="handleDblClick('advForm', 'welcome_play')"> {{ advForm.welcome_play || '' }} </span>
               <span class="edit-slot">秒</span>
             </div>
-            <el-input v-else ref="advFormtime" v-model="advForm.time" @blur="handleBlur('advForm', 'time')" @keyup.enter="handleBlur('advForm', 'time')"><template slot="append">秒</template></el-input>
+            <el-input v-else ref="advFormwelcome_play" v-model="advForm.welcome_play" @blur="handleBlur('advForm', 'welcome_play')" @keyup.enter="handleBlur('advForm', 'welcome_play')"><template slot="append">秒</template></el-input>
           </el-form-item>
         </el-form>
       </div>
@@ -30,16 +30,19 @@
                 v-for="(book, index) in advImgList"
                 :key="book.id"
                 class="book-list-item"
+                :class="{ 'book-list-item--selected': book.selected }"
               >
-                <img :src="book.url || require('@/assets/images/cover-bg.png')" alt="图书封面">
-                <span style="position: absolute; top: 0; left: 0;">{{ book.id }}</span>
-                <div class="book-select" @click.stop="toggleBookSelect(index)">
+                <div style="cursor: default;" @click.stop="toggleBookSelect(index)">
+                  <img :src="book.url || require('@/assets/images/cover-bg.png')" alt="图书封面"></img>
+                </div>
+                <!-- <span style="position: absolute; top: 0; left: 0;">{{ book.id }}</span> -->
+                <!-- <div class="book-select" @click.stop="toggleBookSelect(index)">
                   <i v-if="book.selected" class="iconfont icon-wancheng" />
                   <i v-else class="iconfont icon-weixuan" />
                 </div>
                 <div class="book-delete" @click.stop="deleteBook(index)">
                   <i class="iconfont icon-shanchu" />
-                </div>
+                </div> -->
               </swiper-slide>
             </swiper>
           </div>
@@ -60,6 +63,7 @@
 </template>
 
 <script>
+import { FetchEditScreenSetting } from '@/api/digitalScreen/index'
 import { swiper, swiperSlide } from 'vue-awesome-swiper'
 import 'swiper/dist/css/swiper.css'
 import { mapGetters } from 'vuex'
@@ -72,21 +76,27 @@ export default {
     swiper,
     swiperSlide
   },
+  props: {
+    welcomePlay: {
+      type: String,
+      default: null
+    }
+  },
   data() {
     return {
       advForm: {
-        time: null
+        welcome_play: null
       },
       editStatus: {
         advForm: {
-          time: false
+          welcome_play: false
         }
       },
       originalValues: {
         advForm: {}
       },
       advImgList: [
-        { id: 1, url: require('@/assets/images/screen/screen4.png'), selected: false },
+        { id: 1, url: require('@/assets/images/screen/screen5.png'), selected: false },
         { id: 2, url: require('@/assets/images/screen/screen4.png'), selected: true },
         { id: 3, url: require('@/assets/images/screen/screen4.png'), selected: false },
         { id: 4, url: require('@/assets/images/screen/screen4.png'), selected: false },
@@ -122,18 +132,21 @@ export default {
       return this.advImgList.some(book => book.selected)
     }
   },
+  watch: {
+    welcomePlay(newVal) {
+      if (newVal !== this.advForm.welcome_play) {
+        this.advForm.welcome_play = newVal
+        this.originalValues.advForm.welcome_play = newVal
+      }
+    }
+  },
   created() {
+    this.advForm.welcome_play = this.welcomePlay
   },
   mounted() {
   },
   methods: {
-    updateSwiper() {
-      if (this.$refs.adImgSwiper && this.$refs.adImgSwiper.swiper) {
-        const swiper = this.$refs.adImgSwiper.swiper
-        swiper.update()
-        swiper.slideReset()
-      }
-    },
+
     handleDblClick(formName, field) {
       this.originalValues[formName][field] = this[formName][field]
       this.editStatus[formName][field] = true
@@ -145,18 +158,43 @@ export default {
     handleBlur(formName, field) {
       this.editStatus[formName][field] = false
       if (this[formName][field] !== this.originalValues[formName][field]) {
-        this.saveEdit(formName, field)
+        this.submitMapData(formName, field)
       }
     },
-    saveEdit(formName, field) {
+    submitMapData(formName, field) {
       const value = this[formName][field]
-      console.log(`保存${formName}.${field}：`, value)
       if (!value) {
-        this.$message.warning(`${this.getFieldLabel(formName, field)}不能为空`)
+        this.$message.warning(`图片切换时长不能为空`)
         this[formName][field] = this.originalValues[formName][field]
         return
       }
-      this.$message.success(`${this.getFieldLabel(formName, field)}更新成功`)
+
+      const param = {
+        'code': field,
+        'context': value,
+        'remarks': null
+      }
+      FetchEditScreenSetting(param)
+        .then((res) => {
+          if (res.code !== 500) {
+            this.$message.success('图片切换时长更新成功')
+            this.$emit('update:welcomePlay', value)
+            this.$emit('triggerInit')
+          } else {
+            this.$message.error('图片切换时长更新失败')
+          }
+        })
+        .catch(() => {
+          this.$message.error('图片切换时长更新失败')
+        })
+    },
+
+    updateSwiper() {
+      if (this.$refs.adImgSwiper && this.$refs.adImgSwiper.swiper) {
+        const swiper = this.$refs.adImgSwiper.swiper
+        swiper.update()
+        swiper.slideReset()
+      }
     },
     toggleBookSelect(index) {
       this.advImgList[index].selected = !this.advImgList[index].selected
diff --git a/src/views/digitalScreen/module/areaSetting.vue b/src/views/digitalScreen/module/areaSetting.vue
index 14e8169..6fcfc96 100644
--- a/src/views/digitalScreen/module/areaSetting.vue
+++ b/src/views/digitalScreen/module/areaSetting.vue
@@ -4,22 +4,23 @@
       <div class="config-item-main">
         <span class="data-title">地图DataV</span>
         <el-form ref="areaForm" class="areaForm" :model="areaForm" size="small" label-width="100px">
-          <el-form-item label="GeoJSON" prop="geoJSON">
+          <el-form-item label="GeoJSON" prop="map_data">
             <span
-              v-if="!editStatus.areaForm.geoJSON"
+              v-if="!editStatus.areaForm.map_data"
               class="edit-readonly"
-              @dblclick="handleDblClick('areaForm', 'geoJSON')"
+              style="padding: 4px 15px;"
+              @dblclick="handleDblClick('areaForm', 'map_data')"
             >
-              {{ areaForm.geoJSON || '' }}
+              {{ areaForm.map_data || '' }}
             </span>
             <el-input
               v-else
-              ref="areaFormgeoJSON"
-              v-model="areaForm.geoJSON"
+              ref="areaFormmap_data"
+              v-model="areaForm.map_data"
               type="textarea"
               rows="5"
-              @blur="handleBlur('areaForm', 'geoJSON')"
-              @keyup.enter="handleBlur('areaForm', 'geoJSON')"
+              @blur="handleBlur('areaForm', 'map_data')"
+              @keyup.enter="handleBlur('areaForm', 'map_data')"
             />
           </el-form-item>
         </el-form>
@@ -50,6 +51,7 @@
               </el-table-column>
             </el-table>
             <el-pagination
+              v-if="tableData.length !== 0"
               style="margin: 34px 0 10px 0 !important;"
               :current-page="page.page"
               :total="page.total"
@@ -171,19 +173,27 @@
 </template>
 
 <script>
+import { FetchEditScreenSetting, FetchInitScreenBranch } from '@/api/digitalScreen/index'
 import { mapGetters } from 'vuex'
 
 export default {
   name: 'AreaSetting',
   components: { },
+  props: {
+    mapData: {
+      type: String,
+      default: null
+    }
+  },
   data() {
     return {
+      btnLoading: false,
       areaForm: {
-        geoJSON: null
+        map_data: null
       },
       editStatus: {
         areaForm: {
-          geoJSON: false
+          map_data: false
         }
       },
       originalValues: {
@@ -192,17 +202,10 @@ export default {
       geoJsonVisible: false,
       link: 'https://datav.aliyun.com/portal/school/atlas/area_selector',
       copied: false,
-      tableData: [{
-        name: '总管',
-        libCode: 'lib001',
-        province: '114.133561,30.641408',
-        number: '3'
-      }, {
-        name: '分管1',
-        libCode: 'lib001',
-        province: '114.133561,30.641408',
-        number: '3'
-      }],
+      tableData: [
+        // { name: '总管', libCode: 'lib001', province: '114.133561,30.641408', number: '3' },
+        // { name: '分管1', libCode: 'lib001', province: '114.133561,30.641408', number: '3' }
+      ],
       page: {
         page: 1,
         size: 10,
@@ -241,42 +244,70 @@ export default {
       'baseApi'
     ])
   },
+  watch: {
+    mapData(newVal) {
+      if (newVal !== this.areaForm.map_data) {
+        this.areaForm.map_data = newVal
+        this.originalValues.areaForm.map_data = newVal
+      }
+    }
+  },
   created() {
+    this.areaForm.map_data = this.mapData
+  },
+  mounted() {
+    this.$emit('ready')
   },
   methods: {
-    // 双击进入编辑模式
+    initScreenBranch() {
+      FetchInitScreenBranch().then((res) => {
+        console.log('initScreenBranch', res)
+      }).catch(err => {
+        console.log(err)
+      })
+    },
     handleDblClick(formName, field) {
-    // 记录原始值（用于恢复）
       this.originalValues[formName][field] = this[formName][field]
-      // 开启编辑状态
       this.editStatus[formName][field] = true
-      // 聚焦输入框
       this.$nextTick(() => {
         const input = this.$refs[`${formName}${field}`]
         if (input) input.focus()
       })
     },
-    // 失焦/回车保存编辑
     handleBlur(formName, field) {
-    // 关闭编辑状态
       this.editStatus[formName][field] = false
-      // 对比新值与原始值，有变化则执行保存逻辑
       if (this[formName][field] !== this.originalValues[formName][field]) {
-        this.saveEdit(formName, field)
+        this.submitMapData(formName, field)
       }
     },
-
-    // 保存编辑
-    saveEdit(formName, field) {
+    submitMapData(formName, field) {
       const value = this[formName][field]
-      console.log(`保存${formName}.${field}：`, value)
       if (!value) {
-        this.$message.warning(`${this.getFieldLabel(formName, field)}不能为空`)
+        this.$message.warning(`GeoJSON不能为空`)
         this[formName][field] = this.originalValues[formName][field]
         return
       }
-      this.$message.success(`${this.getFieldLabel(formName, field)}更新成功`)
+
+      const param = {
+        'code': field,
+        'context': value,
+        'remarks': null
+      }
+      FetchEditScreenSetting(param)
+        .then((res) => {
+          if (res.code !== 500) {
+            this.$message.success('GeoJSON更新成功')
+            this.$emit('update:mapData', value)
+            this.$emit('triggerInit')
+          } else {
+            this.$message.error('GeoJSON更新失败')
+          }
+        })
+        .catch(() => {
+          this.$message.error('GeoJSON更新失败')
+        })
     },
+
     handleClose() {
       this.geoJsonVisible = false
       this.libDialogVisible = false
diff --git a/src/views/digitalScreen/module/bookRecommend.vue b/src/views/digitalScreen/module/bookRecommend.vue
index 0bc7554..e41484b 100644
--- a/src/views/digitalScreen/module/bookRecommend.vue
+++ b/src/views/digitalScreen/module/bookRecommend.vue
@@ -28,7 +28,7 @@
       </div>
       <!-- <div class="book-upload-btn" @click.stop="uploadBook"><i class="iconfont icon-shangchuan2" /></div> -->
     </div>
-    <div style="display: flex; flex-direction: column; justify-content: flex-start; margin-left: 15px;">
+    <div style="display: flex; flex-direction: column; justify-content: flex-start;">
       <el-button size="mini" type="primary" @click.stop="uploadBook"><i class="iconfont icon-shangchuan" />图书上传</el-button>
       <el-button size="mini" style="margin-left: 0 !important; margin-top: 10px;" :disabled="!hasSelectedItems" @click="batchDelete">
         <i class="iconfont icon-shanchu" />
@@ -40,6 +40,7 @@
 </template>
 
 <script>
+import { FetchInitScreenBookRecommend } from '@/api/digitalScreen/index'
 import { swiper, swiperSlide } from 'vue-awesome-swiper'
 import 'swiper/dist/css/swiper.css'
 import addBookDialog from './addBookDialog'
@@ -57,21 +58,21 @@ export default {
   data() {
     return {
       bookList: [
-        { id: 1, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 2, url: require('@/assets/images/screen/book.jpg'), selected: true },
-        { id: 3, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 4, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 5, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 6, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 7, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 8, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 9, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 10, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 11, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 12, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 13, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 14, url: require('@/assets/images/screen/book.jpg'), selected: false },
-        { id: 15, url: require('@/assets/images/screen/book.jpg'), selected: false }
+        // { id: 1, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 2, url: require('@/assets/images/screen/book.jpg'), selected: true },
+        // { id: 3, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 4, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 5, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 6, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 7, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 8, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 9, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 10, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 11, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 12, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 13, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 14, url: require('@/assets/images/screen/book.jpg'), selected: false },
+        // { id: 15, url: require('@/assets/images/screen/book.jpg'), selected: false }
       ],
       swiperOptions: {
         slidesPerView: 'auto', // 保持自动适应数量
@@ -105,8 +106,16 @@ export default {
   created() {
   },
   mounted() {
+    this.$emit('ready')
   },
   methods: {
+    initScreenBookRecommend() {
+      FetchInitScreenBookRecommend().then((res) => {
+        console.log('BookRecommend', res)
+      }).catch(err => {
+        console.log(err)
+      })
+    },
     updateBookSwiper() {
       if (this.$refs.bookSwiper && this.$refs.bookSwiper.swiper) {
         const swiper = this.$refs.bookSwiper.swiper
diff --git a/src/views/digitalScreen/module/mediaSetting.vue b/src/views/digitalScreen/module/mediaSetting.vue
index bed7f78..233e18f 100644
--- a/src/views/digitalScreen/module/mediaSetting.vue
+++ b/src/views/digitalScreen/module/mediaSetting.vue
@@ -186,6 +186,7 @@ export default {
   components: { },
   data() {
     return {
+      btnLoading: false,
       tableData: [
         { name: 'XXXX通知', startTime: '2025-05-01 10:05:00', endTime: '2025-05-01 10:05:00' },
         { name: 'XXXX通知', startTime: '2025-05-01 10:05:00', endTime: '2025-05-01 10:05:00' }
diff --git a/src/views/digitalScreen/module/wecharQrCode.vue b/src/views/digitalScreen/module/wecharQrCode.vue
new file mode 100644
index 0000000..3cf19f8
--- /dev/null
+++ b/src/views/digitalScreen/module/wecharQrCode.vue
@@ -0,0 +1,205 @@
+<template>
+  <div class="config-item">
+    <div class="config-item-main">
+      <span class="data-title">二维码</span>
+      <div class="upload-item" style="margin-bottom: 20px;">
+        <p>公众号二维码</p>
+        <div style="display: flex; justify-content: flex-start;">
+          <div class="image-container">
+            <div v-if="isLoading" class="image-loading">
+              <div class="spinner" />
+              <span class="loading-text">加载中...</span>
+            </div>
+            <img
+              v-show="!isLoading || imageError"
+              :key="imageKey"
+              style="display: block; height: 120px; margin-right: 15px; transition: opacity 0.3s ease-in-out;"
+              :src="currentQrCodeUrl"
+              :class="{ 'image-loaded': !isLoading && currentQrCodeUrl }"
+              alt="公众号二维码"
+              @load="handleImageLoad"
+              @error="handleImageError"
+            >
+            <!-- 错误提示 -->
+            <div v-if="imageError" class="image-error">
+              <i class="iconfont icon-error" />
+              <span>加载失败</span>
+            </div>
+          </div>
+          <UploadCover upload-type="other-digital" @childCover="handleCover" />
+        </div>
+      </div>
+    </div>
+    <div class="config-remarks">双击可上传图片。二维码用于“总览屏”、“媒体屏”，在任意分屏编辑均可生效！</div>
+  </div>
+</template>
+
+<script>
+import { FetchEditScreenSetting } from '@/api/digitalScreen/index'
+import UploadCover from '@/views/components/upload.vue'
+import { mapGetters } from 'vuex'
+
+export default {
+  name: 'WecharQrCode',
+  components: { UploadCover },
+  props: {
+    qrCodeUrl: {
+      type: String,
+      default: null
+    }
+  },
+  data() {
+    return {
+      defaultImg: '@/assets/images/cover-bg.png',
+      imageKey: 0,
+      localQrCodeUrl: null,
+      isLoading: false, // 加载状态
+      imageError: false // 错误状态
+    }
+  },
+  computed: {
+    ...mapGetters(['baseApi']),
+    currentQrCodeUrl() {
+      if (this.localQrCodeUrl) {
+        return this.localQrCodeUrl
+      }
+      if (this.qrCodeUrl) {
+        return this.qrCodeUrl.startsWith('http') ? this.qrCodeUrl : this.baseApi + this.qrCodeUrl
+      }
+      return this.defaultImg
+    }
+  },
+  watch: {
+    qrCodeUrl(newVal) {
+      this.localQrCodeUrl = newVal
+      this.reloadImage()
+    },
+    currentQrCodeUrl(newVal) {
+      if (newVal && newVal !== this.defaultImg) {
+        this.reloadImage()
+      }
+    }
+  },
+  created() {
+    this.localQrCodeUrl = this.qrCodeUrl
+  },
+  mounted() {
+    this.$emit('ready')
+  },
+  methods: {
+    handleCover(value) {
+      if (value) {
+        const imgUrl = this.baseApi + '/api/fileRelevant/getImg?imgType=1&imgId=' + value
+        this.submitCover(imgUrl)
+      } else {
+        this.localQrCodeUrl = null
+        this.imageKey++
+        this.isLoading = false
+        this.imageError = false
+      }
+    },
+    submitCover(imgUrl) {
+      const param = {
+        'code': 'wechar_qr_code',
+        'context': imgUrl,
+        'remarks': null
+      }
+      FetchEditScreenSetting(param)
+        .then(() => {
+          this.$message.success('公众号二维码更新成功')
+          this.localQrCodeUrl = imgUrl
+          this.reloadImage()
+          this.$emit('update:qrCodeUrl', imgUrl)
+          this.$emit('triggerInit')
+        })
+        .catch(() => {
+          this.$message.error('公众号二维码更新失败')
+        })
+    },
+    reloadImage() {
+      this.isLoading = true
+      this.imageError = false
+      this.imageKey++
+    },
+    // 图片加载完成
+    handleImageLoad() {
+      this.isLoading = false
+      this.imageError = false
+    },
+    // 图片加载失败
+    handleImageError() {
+      this.isLoading = false
+      this.imageError = true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/digitalScreen.scss";
+.image-container {
+  position: relative;
+  min-width: 120px;
+  height: 120px;
+  // margin-right: 15px;
+}
+
+.image-loading {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 120px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+}
+
+.spinner {
+  width: 20px;
+  height: 20px;
+  border: 2px solid #eee;
+  border-top: 2px solid #0348f3;
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+  margin-bottom: 8px;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+
+.loading-text {
+  font-size: 12px;
+  color: #666;
+}
+
+.image-loaded {
+  opacity: 1;
+}
+
+.image-error {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 120px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+  color: #ED4A41;
+  font-size: 12px;
+}
+
+.image-error .icon-error {
+  font-size: 20px;
+  margin-bottom: 8px;
+}
+</style>