v4版本最后一次提交

src/assets/svg/home/disabled.svg

+<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1855_284)">
+<path d="M50 0C36.7392 0 24.0215 5.26784 14.6447 14.6447C5.26784 24.0215 0 36.7392 0 50C0 63.2608 5.26784 75.9785 14.6447 85.3553C24.0215 94.7322 36.7392 100 50 100C63.2608 100 75.9785 94.7322 85.3553 85.3553C94.7322 75.9785 100 63.2608 100 50C100 36.7392 94.7322 24.0215 85.3553 14.6447C75.9785 5.26784 63.2608 0 50 0ZM50 91.5214C42.1486 91.5214 34.4581 89.2953 27.8207 85.1014C21.1833 80.9074 15.871 74.9175 12.5001 67.8266C9.12923 60.7356 7.83793 52.8343 8.776 45.0391C9.71407 37.2439 12.8431 29.8745 17.8 23.7857L76.2071 82.1929C68.8118 88.2373 59.5512 91.5336 50 91.5214ZM82.2 76.2071L23.7857 17.8C31.7585 11.325 41.8482 8.03479 52.1054 8.56504C62.3626 9.0953 72.0592 13.4084 79.3218 20.671C86.5844 27.9336 90.8976 37.6303 91.4278 47.8875C91.9581 58.1446 88.6678 68.2344 82.1929 76.2071H82.2Z" fill="#555555"/>
+</g>
+<defs>
+<clipPath id="clip0_1855_284">
+<rect width="100" height="100" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/pages/createLive/components/ChoseDigitalPerson.vue

@@ -6,18 +6,23 @@
     <div class="create-digital-person-list-box-parent narrow-scrollbar">
       <Loading v-show="loading"></Loading>
       <div class="create-digital-person-list-box">
-        <div class="create-digital-person-grid">
-          <template v-for="item in digitalList.list" :key="item.id">
-            <CardOne
-              :row="item"
-              :id="item.id"
-              :img="item.cover_url"
-              :name="item.name"
-              :className="item.id == currentCard ? 'card-active' : ''"
-              @change="onCardChange"
-            ></CardOne>
-          </template>
-        </div>
+        <template v-if="currentOption === digitalHumanTypeAudio">
+          <div class="create-digital-person-audio">此过程为音频直播，无需选择数字人。</div></template
+        >
+        <template v-else>
+          <div class="create-digital-person-grid">
+            <template v-for="item in digitalList.list" :key="item.id">
+              <CardOne
+                :row="item"
+                :id="item.id"
+                :img="item.cover_url"
+                :name="item.name"
+                :className="item.id == currentCard ? 'card-active' : ''"
+                @change="onCardChange"
+              ></CardOne>
+            </template>
+          </div>
+        </template>
       </div>
     </div>
   </div>
@@ -30,7 +35,7 @@ import CardOne from '@/components/cardOne.vue';
 import { ref, onMounted, reactive, watch, computed, onActivated } from 'vue';
 import { isDev } from '@/utils/tool';
 import { useStore } from 'vuex';
-import { createLiveKeys } from '@/service/CreateLive';
+import { createLiveKeys, digitalHumanTypeLib, digitalHumanTypeMy, digitalHumanTypeAudio } from '@/service/CreateLive';
 import { useLiveInfoSubmit } from '@/hooks/useStoreCommit';
 import { getDigitalPeopleList } from '@/service/Common';
 import { useRoute } from 'vue-router';
@@ -40,9 +45,11 @@ const props = withDefaults(
   defineProps<{
     toolHeight: number;
     initNum: number;
+    modelValue: string;
   }>(),
   {},
 );
+const emit = defineEmits(['update:modelValue']);
 const store = useStore();
 const route = useRoute();
 // 编辑信息
@@ -58,12 +65,16 @@ const currentCard = ref<string | number>('');
 const options = [
   {
     label: '数字人库',
-    value: '1',
+    value: digitalHumanTypeLib,
   },
   {
     label: '我的数字人',
-    value: '2',
+    value: digitalHumanTypeMy,
   },
+  // {
+  //   label: '音频驱动',
+  //   value: digitalHumanTypeAudio,
+  // },
 ];
 
 const updateInfo = (info: any) => {
@@ -120,6 +131,7 @@ const onSelectChange = (value: string) => {
     currentOption.value = value;
     checkPerson();
   }
+  emit('update:modelValue', value);
 };
 
 // 从python获取视频路径
@@ -197,10 +209,10 @@ const changeCurrentList = () => {
 
 // 切换数字人库
 const checkPerson = () => {
-  if (currentOption.value == '1') {
+  if (currentOption.value == digitalHumanTypeLib) {
     // 切换到数字人库
     digitalList.list = JSON.parse(JSON.stringify(digitalList.admin));
-  } else {
+  } else if (currentOption.value == digitalHumanTypeMy) {
     // 我的数字人
     digitalList.list = JSON.parse(JSON.stringify(digitalList.my));
   }
@@ -241,12 +253,13 @@ onActivated(() => {
 </script>
 
 <style lang="less">
+@import '@/style/variables.less';
+@import '@/style/flex.less';
 .chose-digital-person-box {
-  width: 550px;
   flex: 1;
   display: flex;
   flex-direction: column;
-  padding: 0 4px;
+  padding: 0 12px;
   overflow: hidden;
   .all-select {
     padding: 12px 0;
@@ -260,6 +273,13 @@ onActivated(() => {
     overflow-y: auto;
     .create-digital-person-list-box {
       padding: 12px;
+      height: 100%;
+      .create-digital-person-audio {
+        height: 100%;
+        .dja();
+        color: #b4b4b4;
+        font-size: @size-20;
+      }
       .custom-card-box {
         background: white;
         width: 150px;

src/pages/createLive/components/TextScriptDialog.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script lang="ts" setup>
-import { watch, ref, onMounted } from 'vue';
+import { watch, ref } from 'vue';
 import Select from '@/components/Select.vue';
 import Dialog from '@/components/Dialog.vue';
 import CustomInput from '@/components/input/index.vue';

src/pages/createLive/index.vue

@@ -6,24 +6,28 @@
     <div class="setps-right-box">
       <div class="setps-body">
         <template v-if="setpsList[0].load">
-          <div class="steps-item" v-show="currentSetp == '1'">
-            <ChoseDigitalPerson :toolHeight="toolHeight" :initNum="initNum"></ChoseDigitalPerson>
+          <div class="steps-item" v-show="currentSetp == 1">
+            <ChoseDigitalPerson
+              v-model="currentOption"
+              :toolHeight="toolHeight"
+              :initNum="initNum"
+            ></ChoseDigitalPerson>
           </div>
         </template>
         <template v-if="setpsList[1].load">
-          <div class="steps-item" v-show="currentSetp == '2'">
+          <div class="steps-item" v-show="currentSetp == 2">
             <ScriptVue :initNum="initNum"></ScriptVue>
           </div>
         </template>
         <template v-if="setpsList[2].load">
-          <div class="steps-item" v-show="currentSetp == '3'">
+          <div class="steps-item" v-show="currentSetp == 3">
             <InteractVue :initNum="initNum"></InteractVue>
           </div>
         </template>
         <div class="public-tool" ref="publicTool">
           <Button height="28px" theme="light" class="tool-button" @click="onSaveDrafts">保存草稿</Button>
           <Button height="28px" theme="light" class="tool-button" @click="onBack">上一步</Button>
-          <template v-if="currentSetp != '3'">
+          <template v-if="currentSetp != 3">
             <Button height="28px" theme="green" class="tool-button" @click="onNext">下一步</Button>
           </template>
           <template v-else>
@@ -38,14 +42,17 @@
       </div>
       <div class="create-live-right-drag">
         <div class="label">画面预览：点中主播，即可缩放、移动位置</div>
-        <div class="drag-box">
-          <template v-if="liveImage">
+        <template v-if="liveImage">
+          <div class="live-right-value drag-box" v-show="currentOption != digitalHumanTypeAudio">
             <Drag2 :child="videoPlay">
               <div class="video-play-box">
                 <video ref="videoPlay" :src="liveImage" @canplay="videoCanplay"></video>
               </div>
             </Drag2>
-          </template>
+          </div>
+        </template>
+        <div class="live-right-value disabled-box" v-show="currentOption == digitalHumanTypeAudio">
+          <div><DisabledSvg></DisabledSvg></div>
         </div>
       </div>
     </div>
@@ -70,6 +77,7 @@ import InteractVue from './components/interact.vue';
 import Button from '@/components/Button.vue';
 import ChoseDigitalPerson from './components/ChoseDigitalPerson.vue';
 import HomeSvg from '@/assets/svg/createLive/home.svg';
+import DisabledSvg from '@/assets/svg/home/disabled.svg';
 import InteractSvg from '@/assets/svg/createLive/interact.svg';
 import ScriptsSvg from '@/assets/svg/createLive/scripts.svg';
 import { computed, onBeforeMount, ref, onBeforeUnmount, onActivated, toRaw } from 'vue';
@@ -93,6 +101,7 @@ import {
   getAudioUrl,
   getAudioUrlKey,
   getDurationOfAudioFileList,
+  digitalHumanTypeAudio,
 } from '@/service/CreateLive';
 import { getLiveTaskInfo, createDrafts, getDraftsDetail, liveTts, createLiveTask } from '@/utils/api/userApi';
 import { useRoute, onBeforeRouteLeave } from 'vue-router';
@@ -111,6 +120,9 @@ const [commitInfo] = useLiveInfoSubmit();
 const store = useStore();
 const route = useRoute();
 
+// 当前选择的数字人
+const currentOption = ref('');
+
 // 离开页面前的query
 const currentQuery = ref({});
 const liveImage = computed(() => store.getters['live/getLiveimage']);
@@ -730,7 +742,6 @@ const confirm = async () => {
 };
 
 const initPage = () => {
-  let type = route.query.type;
   // 清空缓存数据
   if (route.query.clearCache === 'true') {
     submitSuccessed('', false);
@@ -864,13 +875,14 @@ onBeforeUnmount(() => {
         align-items: center;
         padding: 6px 0;
       }
-      .drag-box {
+      .live-right-value {
         width: 400px;
-        height: 400px;
-        background: rgb(61, 222, 99);
         border-radius: 2px;
         margin-top: 20px;
         flex: 1;
+      }
+      .drag-box {
+        background: rgb(61, 222, 99);
         .drag {
           width: 100%;
           height: auto;
@@ -885,6 +897,10 @@ onBeforeUnmount(() => {
           }
         }
       }
+      .disabled-box {
+        background: #1e1e1e;
+        .dja();
+      }
     }
   }
 }

src/service/CreateLive.ts

@@ -35,6 +35,11 @@ export const createLiveKeys = {
   scriptUuid: 'script_uuid', // 文本脚本生成的uuid
 };
 
+// 数字人库类型
+export const digitalHumanTypeLib = '1'; // 数字人库
+export const digitalHumanTypeMy = '2'; // 我的数字人
+export const digitalHumanTypeAudio = '3'; // 音频驱动
+
 // 脚本类型
 export const scriptTypeText = '2'; // 文本
 export const scriptTypePhonetics = '1'; // 音频