1、组件初始化自动填充拼音设置 2、全文设置辅助色

src/common/data.js

@@ -0,0 +1,12 @@
+export const unified_attrib = {
+  topic_color: '#FFBBCC', // 主题色
+  assist_color: '#FFBBEE', // 辅助色
+  font: '宋体,微软雅黑', // 字体
+  font_size: '12pt', // 字号
+  pinyin_size: '12pt', // 拼音字号
+  line_height: 1.5, // 行距
+  text_color: '#1d2129', // 文字颜色
+  align: 'LEFT', // 对齐方式 LEFT:左对齐 MIDDLE:居中 RIGHT:右对齐
+  view_pinyin: 'false', // 启用拼音
+  pinyin_position: 'top', // 拼音位置 top:上方 bottom:下方
+};

src/views/book/courseware/create/components/CreateCanvas.vue

@@ -132,8 +132,14 @@
 <script>
 import { getRandomNumber } from '@/utils/index';
 import { componentList } from '../../data/bookType';
-import { ContentSaveCoursewareContent, ContentGetCoursewareContent, SaveBookUnifiedAttrib } from '@/api/book';
+import {
+  ContentSaveCoursewareContent,
+  ContentGetCoursewareContent,
+  SaveBookUnifiedAttrib,
+  GetBookUnifiedAttrib,
+} from '@/api/book';
 import _ from 'lodash';
+import { unified_attrib } from '@/common/data';
 
 import PreviewEdit from './PreviewEdit.vue';
 import FullTextSettings from '../components/FullTextSettings.vue';
@@ -145,6 +151,11 @@ export default {
     FullTextSettings,
   },
   inject: ['getCurSettingId'],
+  provide() {
+    return {
+      getBookUnifiedAttr: () => this.book_unified_attrib,
+    };
+  },
   props: {
     isEdit: {
       type: Boolean,
@@ -168,17 +179,7 @@ export default {
         // 组件列表
         row_list: [],
         // 全文设置
-        unified_attrib: {
-          topic_color: '#165dff',
-          font: '宋体,微软雅黑',
-          font_size: '12pt',
-          pinyin_size: '12pt',
-          line_height: 1.5,
-          text_color: '#1d2129',
-          align: 'LEFT',
-          view_pinyin: 'true',
-          pinyin_position: 'top',
-        },
+        unified_attrib,
       },
       rowCheckList: {}, // 行复选框列表
       content_group_row_list: [], // 行分组id列表
@@ -197,6 +198,7 @@ export default {
         dragging: false,
       },
       visibleFullTextSettings: false,
+      book_unified_attrib: unified_attrib,
     };
   },
   computed: {
@@ -341,6 +343,7 @@ export default {
         },
       );
     });
+    this.getBookUnifiedAttr();
   },
   mounted() {
     document.addEventListener('mousemove', this.dragMove);
@@ -372,6 +375,13 @@ export default {
       this.data.unified_attrib = data;
       this.saveBookUnifiedAttr(data);
     },
+    getBookUnifiedAttr() {
+      GetBookUnifiedAttrib({ book_id: this.project_id }).then(({ content }) => {
+        if (content) {
+          this.book_unified_attrib = JSON.parse(content);
+        }
+      });
+    },
     saveBookUnifiedAttr(data) {
       SaveBookUnifiedAttrib({
         book_id: this.project_id,
@@ -405,7 +415,7 @@ export default {
       });
 
       try {
-        // 先等待所有子组件内容落库完成
+        // 先等待所有子组件内容保存完成
         if (this.isEdit) {
           const comps = Array.isArray(this.$refs?.component)
             ? this.$refs.component

src/views/book/courseware/create/components/common/ModuleMixin.js

@@ -74,7 +74,7 @@ const mixin = {
       immediate: true,
     },
   },
-  inject: ['courseware_id', 'project_id'],
+  inject: ['courseware_id', 'project_id', 'getBookUnifiedAttr'],
   created() {
     if (this.type !== 'interaction') {
       this.GetCoursewareComponentContent();
@@ -94,6 +94,12 @@ const mixin = {
         ({ content }) => {
           if (content) {
             this.data = JSON.parse(content);
+          } else if ('view_pinyin' in this.data.property) {
+            // 初始化时，如果有 view_pinyin 则根据全文设置配置设 view_pinyin 和 pinyin_position
+            const bookUnifiedAttr = this.getBookUnifiedAttr();
+
+            this.data.property.view_pinyin = bookUnifiedAttr?.view_pinyin ?? 'false';
+            this.data.property.pinyin_position = bookUnifiedAttr?.pinyin_position ?? 'top';
           }
           this.property.isGetContent = true;
 

src/views/personal_workbench/project/components/BookUnifiedAttr.vue

@@ -11,7 +11,11 @@
       <div class="form">
         <el-form ref="form" :model="unified_attrib" label-width="80px" size="small">
           <el-form-item label="主题色">
-            <el-color-picker v-model="unified_attrib.topic_color" />
+            <div class="color-group">
+              <el-color-picker v-model="unified_attrib.topic_color" />
+              <span>辅助色</span>
+              <el-color-picker v-model="unified_attrib.assist_color" />
+            </div>
           </el-form-item>
           <el-form-item label="字体">
             <el-select v-model="unified_attrib.font" placeholder="请选择字体">
@@ -75,6 +79,7 @@
 <script>
 import { pinyinPositionList, isEnable } from '@/views/book/courseware/data/common';
 import { GetBookUnifiedAttrib, ApplyBookUnifiedAttrib } from '@/api/book';
+import { unified_attrib } from '@/common/data';
 
 export default {
   name: 'BookUnifiedAttrPage',
@@ -90,17 +95,7 @@ export default {
   },
   data() {
     return {
-      unified_attrib: {
-        topic_color: '#FFBBCC', // 主题色
-        font: '宋体,微软雅黑', // 字体
-        font_size: '12pt', // 字号
-        pinyin_size: '12pt', // 拼音字号
-        line_height: 1.5, // 行距
-        text_color: '#1d2129', // 文字颜色
-        align: 'LEFT', // 对齐方式 LEFT:左对齐 MIDDLE:居中 RIGHT:右对齐
-        view_pinyin: 'true', // 启用拼音
-        pinyin_position: 'top', // 拼音位置 top:上方 bottom:下方
-      },
+      unified_attrib,
       fontSizeList: [
         '8pt',
         '10pt',
@@ -164,6 +159,16 @@ export default {
       .el-input-number {
         width: calc(100% - 42px);
       }
+
+      .color-group {
+        display: flex;
+        column-gap: 10px;
+        align-items: center;
+
+        span {
+          white-space: nowrap;
+        }
+      }
     }
 
     .tips {