Browse Source

list页面

黄琪勇 1 month ago
parent
commit
7f16cbbab9

+ 12 - 0
src/api/pptOperate.ts

@@ -61,6 +61,18 @@ export const getMusicTagTreeApi = () => {
   })
 }
 
+// 获取标签
+export const getMaterialTagApi = () => {
+  return httpAxios.axioseRquest({
+    method: "post",
+    url: "/edu-app/materialTag/page",
+    data: {
+      page: 1,
+      rows: 9999
+    }
+  })
+}
+
 // 收藏课件 取消收藏
 export const favoriteApi = (data: { favoriteFlag: 0 | 1; materialId: string; type: string }) => {
   return httpAxios.axioseRquest({

+ 25 - 3
src/views/Editor/CanvasTool/index.vue

@@ -68,11 +68,11 @@
       <div class="handler-item">
         <img class="itemImg" src="./imgs/tylx.png" alt="" />
         <div class="tit">听音练习</div>
-      </div>
-      <div class="handler-item">
+      </div> -->
+      <div class="handler-item" @click="resourcesListVisible = true">
         <img class="itemImg" src="./imgs/zyk.png" alt="" />
         <div class="tit">资源库</div>
-      </div> -->
+      </div>
       <div class="handler-item" @click="drawText()" :class="{ active: creatingElement?.type === 'text' }">
         <img class="itemImg" src="./imgs/wz.png" alt="" />
         <Popover trigger="click" v-model:value="textTypeSelectVisible" :offset="10">
@@ -246,6 +246,26 @@
         "
       />
     </Modal>
+    <Modal
+      :contentStyle="{
+        width: '70%',
+        minWidth: '1200px',
+        height: '86%',
+        boxShadow: '0px 2px 10px 0px rgba(0,0,0,0.08)',
+        borderRadius: '16px',
+        border: '1px solid #DEDEDE',
+        padding: '0'
+      }"
+      v-model:visible="resourcesListVisible"
+    >
+      <resourcesList
+        @close="
+          () => {
+            resourcesListVisible = false
+          }
+        "
+      />
+    </Modal>
   </div>
 </template>
 
@@ -272,6 +292,7 @@ import Popover from "@/components/Popover.vue"
 import PopoverMenuItem from "@/components/PopoverMenuItem.vue"
 import { ElUpload, ElMessage, type UploadRequestOptions } from "element-plus"
 import cloudCoachList from "@/views/components/element/cloudCoachElement/cloudCoachList"
+import resourcesList from "@/views/components/element/enjoyElement/resourcesList"
 import fileUpload from "@/utils/oss-file-upload"
 import usePptWork from "@/store/pptWork"
 
@@ -318,6 +339,7 @@ const latexEditorVisible = ref(false)
 const textTypeSelectVisible = ref(false)
 const shapeMenuVisible = ref(false)
 const cloudCoachVisible = ref(false)
+const resourcesListVisible = ref(false)
 const moreToolsVisible = ref(false)
 
 // 音视频

+ 10 - 2
src/views/components/element/AudioElement/AudioPlayer.vue

@@ -122,6 +122,7 @@ const paused = ref(true)
 const currentTime = ref(0)
 const duration = ref(0)
 const loaded = ref(0)
+const isThumbDown = ref(false)
 
 const playBarTimeVisible = ref(false)
 const playBarTime = ref("00:00")
@@ -186,6 +187,9 @@ const handlePlayed = () => {
 }
 
 const handleEnded = () => {
+  if (isThumbDown.value) {
+    return
+  }
   if (!props.loop) pause()
   else {
     seek(0)
@@ -197,7 +201,7 @@ const handleProgress = () => {
   loaded.value = audioRef.value?.buffered.length ? audioRef.value.buffered.end(audioRef.value.buffered.length - 1) : 0
 }
 
-const handleError = () => message.error("频加载失败")
+const handleError = () => message.error("频加载失败")
 
 const thumbMove = (e: MouseEvent | TouchEvent) => {
   if (!audioRef.value || !playBarWrap.value) return
@@ -222,7 +226,10 @@ const thumbUp = (e: MouseEvent | TouchEvent) => {
 
   audioRef.value.currentTime = time
   currentTime.value = time
-
+  const _time = setTimeout(() => {
+    clearTimeout(_time)
+    isThumbDown.value = false
+  }, 500)
   document.removeEventListener("mousemove", thumbMove)
   document.removeEventListener("touchmove", thumbMove)
   document.removeEventListener("mouseup", thumbUp)
@@ -230,6 +237,7 @@ const thumbUp = (e: MouseEvent | TouchEvent) => {
 }
 
 const handleMousedownPlayBar = () => {
+  isThumbDown.value = true
   document.addEventListener("mousemove", thumbMove)
   document.addEventListener("touchmove", thumbMove)
   document.addEventListener("mouseup", thumbUp)

BIN
src/views/components/element/enjoyElement/resourcesList/imgs/audio.png


BIN
src/views/components/element/enjoyElement/resourcesList/imgs/img.png


BIN
src/views/components/element/enjoyElement/resourcesList/imgs/jxImg.png


BIN
src/views/components/element/enjoyElement/resourcesList/imgs/video.png


+ 183 - 274
src/views/components/element/enjoyElement/resourcesList/resourcesList.vue

@@ -25,7 +25,16 @@
         <div></div>
       </div>
       <div class="typeTools">
-        <div class="typeTabCon"></div>
+        <div class="typeTabCon">
+          <div
+            v-for="item in resourcesTypeOption"
+            :key="item.value"
+            @click="handleTypeChange(item.value)"
+            :class="['queryTip', queryData.type === item.value && 'active']"
+          >
+            {{ item.text }}
+          </div>
+        </div>
         <div class="query">
           <Input :placeholder="'请输入搜索关键词'" v-model:value="queryData.name" @enter="handleQuery">
             <template #prefix>
@@ -39,33 +48,7 @@
       </div>
       <div class="musicListCon">
         <div class="queryFrom" :class="{ isExpandAct: !isExpand }">
-          <div v-show="queryData.sourceType === 2" class="queryFromList">
-            <div class="tit">教程:</div>
-            <div class="queryFromCon">
-              <div
-                v-for="item in musicTagList"
-                :key="item.id"
-                @click="handleMusicTagChange(item.id)"
-                :class="['queryTip', queryData.bookVersionId === item.id && 'active']"
-              >
-                {{ item.name }}
-              </div>
-            </div>
-          </div>
-          <div v-show="queryData.sourceType !== 3" class="queryFromList">
-            <div class="tit">场景:</div>
-            <div class="queryFromCon">
-              <div
-                v-for="item in audioPlayTypesOption"
-                :key="item.value"
-                @click="handleAudioPlayTypesChange(item.value)"
-                :class="['queryTip', queryData.audioPlayTypes === item.value && 'active']"
-              >
-                {{ item.text }}
-              </div>
-            </div>
-          </div>
-          <div v-show="queryData.audioPlayTypes !== 'SING'" class="queryFromList">
+          <div class="queryFromList">
             <div class="tit">乐器:</div>
             <div class="queryFromCon">
               <template v-for="item in subjectList">
@@ -100,44 +83,49 @@
               </template>
             </div>
           </div>
+          <div class="queryFromList">
+            <div class="tit">标签:</div>
+            <div class="queryFromCon">
+              <div
+                v-for="item in materialTagList"
+                :key="item.id"
+                @click="handleMaterialTagChange(item.id)"
+                :class="['queryTip', queryData.materialTagId === item.id && 'active']"
+              >
+                {{ item.name }}
+              </div>
+            </div>
+          </div>
         </div>
-        <div v-show="queryData.sourceType === 2" @click="isExpand = !isExpand" class="isExpand" :class="{ active: isExpand }">
+        <!-- <div v-show="queryData.sourceType === 2" @click="isExpand = !isExpand" class="isExpand" :class="{ active: isExpand }">
           <div>{{ isExpand ? "收起" : "展开" }}</div>
           <img src="../../cloudCoachElement/cloudCoachList/imgs/jiao.png" alt="" />
-        </div>
+        </div> -->
         <div class="musicListConBox" v-loading="loading">
           <div class="musicList" :class="{ empty: !musicList.length && !loading }">
             <div class="musicListBox" v-if="musicList.length && !loading">
               <div class="musicCon" v-for="item in musicList" :key="item.id">
-                <div class="musicLeft">
-                  <div class="iconCon">
-                    <img class="icon" :src="item.titleImg" alt="" />
-                    <img v-if="item.sourceFrom === 'PLATFORM'" class="jxImg" src="../../cloudCoachElement/cloudCoachList/imgs/jx.png" alt="" />
-                  </div>
-                  <div class="musicInfo">
-                    <EllipsisScroll class="musicTit" :title="item.highName || ''" />
-                    <div class="info">
-                      <div class="hotInfo" v-if="item.usedNum">
-                        <img src="../../cloudCoachElement/cloudCoachList/imgs/hot.png" alt="" />
-                        <div>{{ formatNumber(item.usedNum) }}</div>
-                      </div>
-                      <div class="play" v-if="item.audioPlayTypes?.includes('SING')">演唱</div>
-                      <div class="sing" v-if="item.audioPlayTypes?.includes('PLAY')">演奏</div>
-                      <div class="musicUserName">
-                        <EllipsisScroll :title="item.composer || ''" />
-                      </div>
+                <div class="coverImgCon">
+                  <img v-if="item.sourceFrom === 'PLATFORM'" class="jxImg" src="./imgs/jxImg.png" alt="" />
+                  <div class="addBtn" @click="handleAddResources(item)">添加</div>
+                  <img class="coverImg" :src="item.coverImg" />
+                </div>
+                <div class="musicDetails">
+                  <div class="musLeft">
+                    <img class="labelImg" :src="item.type === 'IMG' ? imgImg : item.type === 'SONG' ? audioImg : videoImg" />
+                    <div class="musicTitCon">
+                      <EllipsisScroll class="musicTit" :title="item.highName || ''" />
                     </div>
                   </div>
-                </div>
-                <div class="musicRight">
-                  <img
-                    v-if="queryParams.fromType !== 'PLATFORM'"
-                    class="sc"
-                    @click="handleFavorite(item)"
-                    :src="item.favoriteFlag ? scActImg : scImg"
-                    alt=""
-                  />
-                  <div class="addBtn" @click="handleAddMusic(item.id, item.name)">添加</div>
+                  <div class="musRight">
+                    <img
+                      v-if="queryParams.fromType !== 'PLATFORM'"
+                      class="sc"
+                      @click="handleFavorite(item)"
+                      :src="item.favoriteFlag ? scActImg : scImg"
+                      alt=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -160,20 +148,23 @@ import PopoverMenuItem from "@/components/PopoverMenuItem.vue"
 import Empty from "@/components/Empty"
 import EllipsisScroll from "@/components/ellipsisScroll"
 import { reactive, ref } from "vue"
-import { getMaterialQueryPage, getSubjectListApi, getMusicTagTreeApi, favoriteApi } from "@/api/pptOperate"
+import { getMaterialQueryPage, getSubjectListApi, favoriteApi, getMaterialTagApi } from "@/api/pptOperate"
 import { httpAjax } from "@/plugins/httpAjax"
 import queryParams from "@/queryParams"
 import scActImg from "../../cloudCoachElement/cloudCoachList/imgs/scAct.png"
 import scImg from "../../cloudCoachElement/cloudCoachList/imgs/sc.png"
+import audioImg from "./imgs/audio.png"
+import imgImg from "./imgs/img.png"
+import videoImg from "./imgs/video.png"
 import { CODE_ERR_CANCELED } from "@/libs/auth"
 
 const emits = defineEmits<{
-  (event: "update", id: string, name: string): void
+  (event: "update", item: Record<string, any>): void
   (event: "close"): void
 }>()
 
-function handleAddMusic(id: string, name: string) {
-  emits("update", id, name)
+function handleAddResources(item: Record<string, any>) {
+  emits("update", item)
   emits("close")
 }
 
@@ -203,15 +194,14 @@ const tabData =
           value: 4
         }
       ]
-// 场景
-const audioPlayTypesOption = [
-  { text: "全部", value: "" },
-  { text: "演唱", value: "SING" },
-  { text: "演奏", value: "PLAY" },
-  { text: "演唱+演奏", value: "PLAY,SING" }
+// 资源类型
+const resourcesTypeOption = [
+  { text: "图片", value: "IMG" },
+  { text: "音频", value: "SONG" },
+  { text: "视频", value: "VIDEO" }
 ]
-// 教程
-const musicTagList = ref<any[]>([])
+// 标签
+const materialTagList = ref<any[]>([])
 // 乐器
 const subjectList = ref<any[]>([])
 
@@ -219,10 +209,10 @@ const queryData = reactive({
   page: 1,
   rows: 21,
   total: 0,
+  type: "SONG",
+  materialTagId: "",
   sourceType: tabData[0].value,
   name: "",
-  bookVersionId: "",
-  audioPlayTypes: "",
   subject: {
     id: "",
     name: ""
@@ -236,8 +226,8 @@ const isExpand = ref(true)
 
 getQueryList()
 function getQueryList() {
-  Promise.all([httpAjax(getSubjectListApi), httpAjax(getMusicTagTreeApi)]).then(res => {
-    const [subjectListRes, musicTagTreeRes] = res
+  Promise.all([httpAjax(getSubjectListApi), httpAjax(getMaterialTagApi)]).then(res => {
+    const [subjectListRes, materialTagRes] = res
     if (subjectListRes.code === 200) {
       subjectList.value = subjectListRes.data.map((item: any) => {
         return item.instruments.length > 1 ? Object.assign(item, { isExpand: ref(false) }) : item
@@ -245,16 +235,8 @@ function getQueryList() {
       // 赋默认值
       handleSubjectDefault()
     }
-    if (musicTagTreeRes.code === 200) {
-      musicTagList.value = [
-        { id: "", name: "全部" },
-        ...musicTagTreeRes.data.map((item: any) => {
-          return {
-            id: item.id,
-            name: item.name
-          }
-        })
-      ]
+    if (materialTagRes.code === 200) {
+      materialTagList.value = [{ id: "", name: "全部" }, ...(materialTagRes.data?.rows || [])]
     }
     handleQuery()
   })
@@ -284,8 +266,8 @@ function clearQueryData() {
   queryData.total = 0
   queryData.sourceType = 5
   queryData.name = ""
-  queryData.bookVersionId = ""
-  queryData.audioPlayTypes = ""
+  queryData.type = "SONG"
+  queryData.materialTagId = ""
   queryData.subject = {
     id: "",
     name: ""
@@ -298,17 +280,17 @@ function handleTabChange(sourceType: number) {
   queryData.sourceType = sourceType
   handleQuery()
 }
-function handleMusicTagChange(id: string) {
-  queryData.bookVersionId = id
+function handleSubjectChange(item: any) {
+  queryData.subject.id = item.id
+  queryData.subject.name = item.name
   handleQuery()
 }
-function handleAudioPlayTypesChange(value: string) {
-  queryData.audioPlayTypes = value
+function handleMaterialTagChange(id: string) {
+  queryData.materialTagId = id
   handleQuery()
 }
-function handleSubjectChange(item: any) {
-  queryData.subject.id = item.id
-  queryData.subject.name = item.name
+function handleTypeChange(type: string) {
+  queryData.type = type
   handleQuery()
 }
 function isActiveSubjectPop(item: any) {
@@ -330,69 +312,18 @@ function handleQuery() {
 let controller: AbortController
 function handleGetQuery() {
   loading.value = true
-  let { sourceType, subject, audioPlayTypes, name, page, rows, bookVersionId } = queryData
+  let { sourceType, subject, type, materialTagId, name, page, rows } = queryData
   let musicalInstrumentId = subject.id
-  const audioPlayTypesParams = audioPlayTypes ? audioPlayTypes.split(",") : []
-  let params: any
-  // 相关资源
-  if (sourceType === 5) {
-    if (audioPlayTypesParams[0] === "SING") {
-      musicalInstrumentId = ""
-    }
-    params = {
-      name,
-      type: "MUSIC",
-      sourceType,
-      musicalInstrumentId,
-      enableFlag: true,
-      page,
-      rows,
-      audioPlayTypes: audioPlayTypesParams,
-      lessonCoursewareKnowledgeId: queryParams.lessonCoursewareKnowledgeId
-    }
-  }
-  if (sourceType === 2) {
-    if (audioPlayTypesParams[0] === "SING") {
-      musicalInstrumentId = ""
-    }
-    params = {
-      name,
-      type: "MUSIC",
-      sourceType,
-      musicalInstrumentId,
-      enableFlag: true,
-      page,
-      rows,
-      audioPlayTypes: audioPlayTypesParams,
-      lessonCoursewareKnowledgeId: queryParams.lessonCoursewareKnowledgeId,
-      bookVersionId
-    }
-  }
-  if (sourceType === 3) {
-    params = {
-      name,
-      type: "MUSIC",
-      sourceType,
-      musicalInstrumentId,
-      enableFlag: true,
-      page,
-      rows
-    }
-  }
-  if (sourceType === 4) {
-    if (audioPlayTypesParams[0] === "SING") {
-      musicalInstrumentId = ""
-    }
-    params = {
-      name,
-      type: "MUSIC",
-      sourceType,
-      musicalInstrumentId,
-      enableFlag: true,
-      page,
-      rows,
-      audioPlayTypes: audioPlayTypesParams
-    }
+  const params = {
+    name,
+    type,
+    sourceType,
+    musicalInstrumentId,
+    enableFlag: true,
+    page,
+    rows,
+    materialTagId,
+    lessonCoursewareKnowledgeId: [2, 5].includes(sourceType) ? queryParams.lessonCoursewareKnowledgeId : "" // 相关资源和共享资源需要这个
   }
   if (controller) {
     controller.abort()
@@ -418,16 +349,13 @@ function handleFavorite(item: any) {
   httpAjax(favoriteApi, {
     favoriteFlag: item.favoriteFlag ? 0 : 1,
     materialId: item.id,
-    type: "MUSIC"
+    type: item.type
   }).then(res => {
     if (res.code === 200) {
       item.favoriteFlag = !item.favoriteFlag
     }
   })
 }
-function formatNumber(num: number) {
-  return num >= 10000 ? (num / 10000).toFixed(1).replace(/\.0$/, "") + "万" : num.toString()
-}
 const highlightedText = (text: string, query: string) => {
   if (!text) {
     return ""
@@ -483,10 +411,12 @@ const highlightedText = (text: string, query: string) => {
   .content {
     width: 100%;
     height: calc(100% - 64px);
+    display: flex;
+    flex-direction: column;
     .tabTools {
-      height: 72px;
+      flex-shrink: 0;
       width: 100%;
-      padding: 18px 30px;
+      padding: 24px 30px;
       display: flex;
       justify-content: space-between;
       align-items: center;
@@ -524,11 +454,32 @@ const highlightedText = (text: string, query: string) => {
       }
     }
     .typeTools {
+      flex-shrink: 0;
       display: flex;
       justify-content: space-between;
       align-items: center;
-      .typeTabCon{
-
+      margin: 0 30px;
+      padding-bottom: 16px;
+      border-bottom: 1px solid #eaeaea;
+      .typeTabCon {
+        display: flex;
+        align-items: center;
+        .queryTip {
+          margin-right: 16px;
+          font-weight: 400;
+          font-size: 14px;
+          color: rgba(0, 0, 0, 0.6);
+          line-height: 20px;
+          padding: 6px 20px;
+          background: #f5f6fa;
+          border-radius: 16px;
+          cursor: pointer;
+          &.active,
+          &:hover {
+            background: #d2ecff;
+            color: rgba(0, 0, 0, 1);
+          }
+        }
       }
       .query {
         width: 400px;
@@ -575,8 +526,10 @@ const highlightedText = (text: string, query: string) => {
       }
     }
     .musicListCon {
+      padding-top: 16px;
       width: 100%;
-      height: calc(100% - 72px);
+      flex-grow: 1;
+      overflow: hidden;
       display: flex;
       flex-direction: column;
       .queryFrom {
@@ -677,129 +630,43 @@ const highlightedText = (text: string, query: string) => {
             padding: 0 30px;
             .musicCon {
               margin-bottom: 24px;
-              width: calc(33.3333% - 24px);
+              width: calc(25% - 24px);
               margin-left: 24px;
-              padding: 16px;
-              background: #f5f6fa;
               border-radius: 12px;
+              background: linear-gradient(0, #dbf1ff 0%, #e7f9ff 100%);
+              outline: 1.5px solid #d3eef1;
+              height: 213px;
               display: flex;
-              justify-content: space-between;
-              align-items: center;
-              height: 102px;
+              flex-direction: column;
+              overflow: hidden;
               &:nth-last-child(-n + 3) {
                 margin-bottom: 0;
               }
               &:hover {
                 outline: 2px solid #198cfe;
               }
-              .musicLeft {
-                display: flex;
-                align-items: center;
-                margin-right: 14px;
-                overflow: hidden;
-                .iconCon {
-                  position: relative;
-                  .icon {
-                    width: 70px;
-                    height: 70px;
-                    border-radius: 8px;
-                  }
-                  .jxImg {
-                    position: absolute;
-                    left: 0;
-                    top: 0;
-                    width: 34px;
-                    height: 16px;
-                  }
-                }
-                .musicInfo {
-                  margin-left: 12px;
-                  overflow: hidden;
-                  .musicTit {
-                    font-weight: 600;
-                    font-size: 15px;
-                    color: #131415;
-                    line-height: 21px;
-                    &::v-deep(.highlighted) {
-                      color: $themeColor;
-                    }
-                  }
-                  .info {
-                    margin-top: 13px;
-                    display: flex;
-                    align-items: center;
-                    .hotInfo {
-                      margin-right: 4px;
-                      padding: 0 4px;
-                      background: #fff3f3;
-                      border-radius: 3px;
-                      border: 1px solid rgba(254, 67, 67, 0.5);
-                      display: flex;
-                      align-items: center;
-                      justify-content: center;
-                      flex-shrink: 0;
-                      line-height: 16px;
-                      & > img {
-                        width: 10px;
-                        height: 12px;
-                      }
-                      & > div {
-                        margin-left: 2px;
-                        font-weight: 400;
-                        font-size: 12px;
-                        color: #fe4343;
-                      }
-                    }
-                    .play {
-                      margin-right: 4px;
-                      flex-shrink: 0;
-                      padding: 0 4px;
-                      background: #ffffff;
-                      border-radius: 3px;
-                      border: 1px solid rgba(243, 130, 26, 0.5);
-                      font-weight: 400;
-                      font-size: 12px;
-                      color: #f3821a;
-                      line-height: 16px;
-                      text-align: center;
-                    }
-                    .sing {
-                      margin-right: 4px;
-                      flex-shrink: 0;
-                      padding: 0 4px;
-                      background: #ffffff;
-                      border-radius: 3px;
-                      border: 1px solid rgba(21, 178, 253, 0.5);
-                      font-weight: 400;
-                      font-size: 12px;
-                      color: #00adff;
-                      line-height: 16px;
-                      text-align: center;
-                    }
-                    .musicUserName {
-                      overflow: hidden;
-                      font-weight: 400;
-                      font-size: 13px;
-                      color: #777777;
-                      line-height: 16px;
-                    }
-                  }
-                }
-              }
-              .musicRight {
+              .coverImgCon {
                 flex-shrink: 0;
-                display: flex;
-                align-items: center;
-                .sc {
-                  width: 26px;
-                  height: 26px;
-                  cursor: pointer;
-                  &:hover {
-                    opacity: 0.8;
-                  }
+                width: 100%;
+                height: 170px;
+                position: relative;
+                .coverImg {
+                  width: 100%;
+                  height: 100%;
+                  object-fit: cover;
+                  object-position: top;
+                }
+                .jxImg {
+                  position: absolute;
+                  left: 0;
+                  top: 0;
+                  width: 50px;
+                  height: 27px;
                 }
                 .addBtn {
-                  margin-left: 12px;
+                  position: absolute;
+                  top: 8px;
+                  right: 12px;
                   width: 54px;
                   height: 26px;
                   background: #198cfe;
@@ -815,6 +682,48 @@ const highlightedText = (text: string, query: string) => {
                   }
                 }
               }
+              .musicDetails {
+                flex-grow: 1;
+                padding: 0 12px;
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                .musLeft {
+                  display: flex;
+                  align-items: center;
+                  margin-right: 14px;
+                  overflow: hidden;
+                  .labelImg {
+                    flex-shrink: 0;
+                    width: 16px;
+                    height: 16px;
+                  }
+                  .musicTitCon {
+                    margin-left: 6px;
+                    overflow: hidden;
+                    .musicTit {
+                      font-weight: 600;
+                      font-size: 14px;
+                      color: #131415;
+                      line-height: 20px;
+                      &::v-deep(.highlighted) {
+                        color: $themeColor;
+                      }
+                    }
+                  }
+                }
+                .musRight {
+                  flex-shrink: 0;
+                  .sc {
+                    width: 26px;
+                    height: 26px;
+                    cursor: pointer;
+                    &:hover {
+                      opacity: 0.8;
+                    }
+                  }
+                }
+              }
             }
           }
         }

+ 1 - 1
vite.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
     proxy: {
       // 正则表达式写法
       "^/pptApi/.*": {
-        target: "https://test.kt.colexiu.com",
+        target: "https://dev.kt.colexiu.com",
         changeOrigin: true,
         rewrite: path => path.replace(/^\/pptApi/, "")
       }