视频标签修改

src/api/videoMonitor/index.ts

@@ -133,3 +133,12 @@ export function getTagList(params) {
     params: params
   });
 }
+
+// 视频标签打点
+export function setVideoTag(data: PointParams) {
+  return request({
+    url: '/api/videoResource/tag/labeling_video_tag',
+    method: 'post',
+    data: data
+  });
+}

src/components/Dialog/index.vue

@@ -6,12 +6,14 @@
     :style="{ width: computedWidth, height: computedHeight, zIndex: zIndex }"
   >
     <div :class="type === 'xs' || headerType === 'header2' ? 'dialog-header2' : 'dialog-header'">
-      <div v-if="!hideTitle" class="dialog-title" :title="title ? title : '弹窗'">
-        {{ title ? title : '弹窗' }}
-      </div>
-      <div v-if="!!getTagId" class="tags">
-        <div v-for="(item, index) in tags" :key="index" class="tag">{{ item.dict_label }}</div>
-        <i :class="tags && tags.length > 0 ? 'collectFill' : 'collect'" @click="handleShowAddTag" />
+      <div class="header-left">
+        <div v-if="!hideTitle" class="dialog-title" :title="title ? title : '弹窗'">
+          {{ title ? title : '弹窗' }}
+        </div>
+        <div v-if="!!getTagId" class="tags">
+          <div v-for="(item, index) in tags" :key="index" class="tag">{{ item.dict_label }}</div>
+          <i :class="tags && tags.length > 0 ? 'collectFill' : 'collect'" @click="handleShowAddTag" />
+        </div>
       </div>
       <i class="decoration" />
       <i class="dialog-close" @click="closeDialog" />
@@ -31,7 +33,7 @@
     <i class="triangle3" />
     <i class="triangle4" />
   </div>
-  <VideoTagEdit v-if="showAddTag" :id="getTagId" v-model="showAddTag" :tags="tags" @update-video-tag="getData(true)" />
+  <VideoTagEdit v-if="showAddTag" :id="getTagId" v-model="showAddTag" :tags="tags" @update-video-tag="getData2" />
 </template>
 
 <script lang="ts" setup name="Dialog">
@@ -138,6 +140,10 @@ const getData = (needUpdate?: boolean) => {
     }
   });
 };
+const getData2 = () => {
+  getData(true);
+  showAddTag.value = false;
+};
 onMounted(() => {
   if (props.customShow) {
     zIndex.value = appStore.getZIndex();
@@ -168,7 +174,7 @@ onMounted(() => {
     position: relative;
     min-height: 175px;
     line-height: 135px;
-    padding: 0 40px;
+    padding: 0 40px 40px;
     .dialog-title {
       width: 965px;
       color: transparent;
@@ -232,12 +238,11 @@ onMounted(() => {
     display: flex;
     .dialog-title {
       width: auto;
-      max-width: 2350px;
+      max-width: 1900px;
     }
     .tags {
       display: flex;
       align-items: center;
-      margin-top: -45px;
       .tag {
         width: 345px;
         height: 71px;
@@ -265,26 +270,31 @@ onMounted(() => {
         margin-left: 20px;
       }
     }
-    &::before {
-      content: '';
-      position: absolute;
-      bottom: 19px;
-      left: 0;
-      width: 163px;
-      height: 69px;
-      background: url('@/assets/images/line.png') no-repeat;
-      background-size: 100%;
-    }
-    &::after {
-      content: '';
-      position: absolute;
-      bottom: 50px;
-      left: 178px;
-      width: calc(100% - 178px);
-      height: 6.9px;
-      background-image: linear-gradient(to right, rgba(10, 154, 196, 1) 0%, rgba(10, 154, 196, 0) 100%);
-      background-size: 100% 100%;
+    .header-left {
+      position: relative;
+      max-width: 2350px;
+      &::before {
+        content: '';
+        position: absolute;
+        bottom: -31px;
+        left: 0;
+        width: 163px;
+        height: 69px;
+        background: url('@/assets/images/line.png') no-repeat;
+        background-size: 100%;
+      }
+      &::after {
+        content: '';
+        position: absolute;
+        bottom: 0px;
+        left: 178px;
+        width: calc(100% - 178px);
+        height: 6.9px;
+        background-image: linear-gradient(to right, rgba(10, 154, 196, 1) 0%, rgba(10, 154, 196, 0) 100%);
+        background-size: 100% 100%;
+      }
     }
+
   }
   .el-form-item__label {
     font-size: 38px;
@@ -342,4 +352,8 @@ onMounted(() => {
 .common-btn-danger {
   margin-left: 20px;
 }
+.header-left {
+  display: flex;
+  flex-wrap: wrap;
+}
 </style>

src/components/VideoTagEdit/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog v-model="show" title="视频标签" height="auto" draggable @close="handleClose" @confirm="handleAdd">
+  <Dialog v-model="show" custom-show title="视频标签" height="auto" draggable @close="handleClose" @confirm="handleAdd">
     <div class="title-box">
       <div class="title">当前标签</div>
     </div>
@@ -19,7 +19,7 @@
 </template>
 
 <script lang="ts" setup name="VideoTagEdit">
-import { addVideoTag } from '@/api/videoMonitor';
+import { addVideoTag, setVideoTag } from '@/api/videoMonitor';
 import { showSuccessMsg } from '@/utils/notification';
 import { getDicts } from '@/api/system/dict/data';
 
@@ -69,10 +69,9 @@ const handleAdd = () => {
   selectTags.value.forEach((item) => {
     tagsId.push(item.value);
   });
-  addVideoTag({ video_code: props.id, dict_value: tagsId, dict_type: 'video_type' }).then(() => {
+  setVideoTag({ video_code: props.id, dict_value_list: tagsId }).then(() => {
     showSuccessMsg('新增成功');
     emits('updateVideoTag');
-    handleClose();
   });
 };