拼音由基础组件移动到题型组件

src/views/book/courseware/create/components/base/pinyin_base/PinyinBase.vue → src/views/book/courseware/create/components/question/pinyin_base/PinyinBase.vue

@@ -3,6 +3,15 @@
     <template #content>
       <!-- eslint-disable max-len -->
       <div class="fill-wrapper">
+        <div class="fun-type">
+          <a
+            v-for="{ value, label } in funList"
+            :key="value"
+            :class="[data.property.fun_type === value ? 'active' : '']"
+            @click="data.property.fun_type = value"
+            >{{ label }}</a
+          >
+        </div>
         <div class="content-box">
           <el-input
             v-if="data.property.audio_generation_method === 'auto'"
@@ -23,8 +32,7 @@
             style="width: 200px"
           />
         </div>
-        <span v-if="data.property.fun_type === 'input'"
-class="tips"
+        <span v-if="data.property.fun_type === 'input'" class="tips"
           >在需要加空的内容处插入 3 个或以上的下划线“_”。</span
         >
         <div v-if="data.audio_file_id">
@@ -72,7 +80,7 @@ import ModuleMixin from '../../common/ModuleMixin';
 import SoundRecord from '@/views/book/courseware/create/components/question/fill/components/SoundRecord.vue';
 import UploadAudio from '@/views/book/courseware/create/components/question/fill/components/UploadAudio.vue';
 
-import { getPinyinBaseData } from '@/views/book/courseware/data/pinyinBase';
+import { getPinyinBaseData, funList } from '@/views/book/courseware/data/pinyinBase';
 import { addTone, handleToneValue } from '@/views/book/courseware/data/common';
 import { getRandomNumber } from '@/utils';
 import { GetStaticResources } from '@/api/app';
@@ -90,6 +98,7 @@ export default {
       matically_pinyin_obj: {}, // 存放转成声调的拼音
       matically_pinyin_str: {}, // 存放转成声调的字符串
       res_arr: [],
+      funList,
     };
   },
   watch: {
@@ -306,6 +315,30 @@ export default {
     width: 100%;
   }
 
+  .fun-type {
+    display: flex;
+    gap: 5px;
+    width: 100%;
+    padding-bottom: 10px;
+    border-bottom: 1px solid #e5e6eb;
+
+    a {
+      padding: 5px 10px;
+      font-weight: normal;
+      color: #1d2129;
+      cursor: pointer;
+      background: #f2f3f5;
+      border: 1px solid #f2f3f5;
+      border-radius: 2px;
+
+      &.active {
+        color: #165dff;
+        background: #e7eeff;
+        border-color: #165dff;
+      }
+    }
+  }
+
   .tips {
     font-size: 12px;
     color: #999;

src/views/book/courseware/create/components/base/pinyin_base/PinyinBaseSetting.vue → src/views/book/courseware/create/components/question/pinyin_base/PinyinBaseSetting.vue

@@ -2,11 +2,11 @@
   <div>
     <el-form :model="property" label-width="72px" label-position="left">
       <SerailNumber :property="property" />
-      <el-form-item label="功能">
+      <!-- <el-form-item label="功能">
         <el-select v-model="property.fun_type" placeholder="请选择">
           <el-option v-for="{ value, label } in funList" :key="value" :label="label" :value="value" />
         </el-select>
-      </el-form-item>
+      </el-form-item> -->
       <el-form-item v-if="property.fun_type === 'mark'" label="选择类型">
         <el-radio-group v-model="property.answer_mode">
           <el-radio v-for="{ value, label } in markList" :key="value" :label="value">

src/views/book/courseware/data/bookType.js

@@ -31,8 +31,8 @@ import UploadControl from '../create/components/base/upload_control/UploadContro
 import UploadControlSetting from '../create/components/base/upload_control/UploadControlSetting.vue';
 import UploadPreview from '../create/components/base/upload_preview/UploadPreview.vue';
 import UploadRreviewSetting from '../create/components/base/upload_preview/UploadRreviewSetting.vue';
-import PinyinBase from '../create/components/base/pinyin_base/PinyinBase.vue';
-import PinyinBaseSetting from '../create/components/base/pinyin_base/PinyinBaseSetting.vue';
+import PinyinBase from '../create/components/question/pinyin_base/PinyinBase.vue';
+import PinyinBaseSetting from '../create/components/question/pinyin_base/PinyinBaseSetting.vue';
 import CharacterBase from '../create/components/base/character_base/CharacterBase.vue';
 import CharacterBaseSetting from '../create/components/base/character_base/CharacterBaseSetting.vue';
 import Character from '../create/components/question/character/Character.vue';
@@ -179,14 +179,6 @@ export const bookTypeOption = [
         set: SpacingSetting,
         preview: SpacingPreview,
       },
-      {
-        value: 'pinyin_base',
-        label: '拼音',
-        icon: 'pinyin',
-        component: PinyinBase,
-        set: PinyinBaseSetting,
-        preview: PinyinBasePreview,
-      },
       // {
       //   value: 'character_base',
       //   label: '汉字',
@@ -345,6 +337,14 @@ export const bookTypeOption = [
         set: ImageTextSetting,
         preview: ImageTextPreview,
       },
+      {
+        value: 'pinyin_base',
+        label: '拼音组件',
+        icon: '',
+        component: PinyinBase,
+        set: PinyinBaseSetting,
+        preview: PinyinBasePreview,
+      },
     ],
   },
 ];