视频标签功能

src/api/viedoTag/viedoManagement.ts

@@ -23,9 +23,9 @@ export function createVideoTag(data) {
   });
 }
 // 修改
-export function updateVideoTag(data, dictCode) {
+export function updateVideoTag(data) {
   return request({
-    url: '/api/videoResource/tag/update/' + dictCode,
+    url: '/api/videoResource/tag/update/',
     method: 'put',
     data: data
   });
@@ -37,3 +37,10 @@ export function deleteVideoTag(dictCode: string) {
     method: 'delete'
   });
 }
+// 判断
+export function getVideoIsNull(data) {
+  return request({
+    url: '/api/videoResource/tag/isNull/',
+    method: 'get'
+  });
+}

src/types/components.d.ts

@@ -27,13 +27,9 @@ declare module 'vue' {
     ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
     ElBadge: typeof import('element-plus/es')['ElBadge']
     ElButton: typeof import('element-plus/es')['ElButton']
-    ElCard: typeof import('element-plus/es')['ElCard']
-    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
-    ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
-    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElDialog: typeof import('element-plus/es')['ElDialog']
     ElDivider: typeof import('element-plus/es')['ElDivider']
     ElDrawer: typeof import('element-plus/es')['ElDrawer']
@@ -44,35 +40,19 @@ declare module 'vue' {
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElIcon: typeof import('element-plus/es')['ElIcon']
-    ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
-    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
-    ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopover: typeof import('element-plus/es')['ElPopover']
-    ElRadio: typeof import('element-plus/es')['ElRadio']
-    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
-    ElSegmented: typeof import('element-plus/es')['ElSegmented']
-    ElSelect: typeof import('element-plus/es')['ElSelect']
-    ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
-    ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
-    ElSlider: typeof import('element-plus/es')['ElSlider']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
-    ElTag: typeof import('element-plus/es')['ElTag']
     ElText: typeof import('element-plus/es')['ElText']
-    ElTimeline: typeof import('element-plus/es')['ElTimeline']
-    ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
-    ElTree: typeof import('element-plus/es')['ElTree']
-    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
-    ElUpload: typeof import('element-plus/es')['ElUpload']
     ExcelEditor: typeof import('./../components/ExcelEditor/index.vue')['default']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
     FlvVideo: typeof import('./../components/FlvVideo/index.vue')['default']
@@ -84,8 +64,6 @@ declare module 'vue' {
     HikvisionPlayer: typeof import('./../components/HKVideo/hikvision-player.vue')['default']
     HKVideo: typeof import('./../components/HKVideo/index.vue')['default']
     IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
-    IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
-    IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
     IFrame: typeof import('./../components/iFrame/index.vue')['default']
     ImagePreview: typeof import('./../components/ImagePreview/index.vue')['default']
     ImageUpload: typeof import('./../components/ImageUpload/index.vue')['default']

src/views/videoTag/videoAdd.vue

@@ -3,12 +3,12 @@
     <div class="common-dialog-content">
       <div class="common-dialog-title-box">
         <i class="common-dialog-title-icon" />
-        <div>{{ props.id ? '修改视频标签' : '新增视频标签' }}</div>
+        <div>{{ props.dictCode ? '修改视频标签' : '新增视频标签' }}</div>
       </div>
       <div class="common-dialog-box">
         <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
-          <el-form-item label="标签名称：" prop="dict_label">
-            <el-input v-model="form.dict_label" placeholder="请输入标签名称" style="width: 468px !important" />
+          <el-form-item label="标签名称：" prop="dictLabel">
+            <el-input v-model="form.dictLabel" placeholder="请输入标签名称" style="width: 468px !important" />
           </el-form-item>
         </el-form>
         <div class="common-dialog-footer">
@@ -24,7 +24,7 @@ import { ref, reactive, toRefs } from 'vue';
 import { createVideoTag, getVideoTagInfo, updateVideoTag } from '@/api/viedoTag/viedoManagement';
 const emits = defineEmits(['close']);
 const props = defineProps({
-  id: String
+  dictCode: String
 });
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { show_status, material_category_level } = toRefs<any>(proxy?.useDict('show_status', 'material_category_level'));
@@ -34,10 +34,11 @@ const buttonLoading = ref(false);
 // 表单数据
 const data = reactive({
   form: {
-    dict_label: ''
+    dictCode: '',
+    dictLabel: ''
   },
   rules: {
-    dict_label: [{ required: true, message: '标签名称不能为空', trigger: 'blur' }]
+    dictLabel: [{ required: true, message: '标签名称不能为空', trigger: 'blur' }]
   }
 });
 
@@ -50,15 +51,17 @@ const submitForm = async (formEl) => {
   if (!formEl) return;
   await formEl.validate((valid, fields) => {
     if (valid) {
-      if (props.id) {
-        updateVideoTag(form.value, props.id).then(() => {
+      if (props.dictCode) {
+        updateVideoTag(form.value, props.dictCode).then(() => {
           proxy.$modal.msgSuccess('修改成功');
           emits('close', true);
+          emits('refresh');
         });
       } else {
         createVideoTag(form.value).then(() => {
           proxy.$modal.msgSuccess('新增成功');
           emits('close', true);
+          emits('refresh');
         });
       }
     } else {
@@ -79,8 +82,8 @@ const submitForm = async (formEl) => {
 };
 
 onMounted(() => {
-  if (!props.id) return;
-  getVideoTagInfo(props.id).then((res) => {
+  if (!props.dictCode) return;
+  getVideoTagInfo(props.dictCode).then((res) => {
     form.value = res.data;
   });
 });

src/views/videoTag/viedoManagement.vue

@@ -16,8 +16,8 @@
           <el-table-column label="视频标签" align="center" prop="dictLabel" />
           <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
             <template #default="scope">
-              <el-text class="common-btn-text-primary" @click="handleUpdate(scope.row)">编辑</el-text>
-              <el-text class="common-btn-text-danger" @click="handleDelete(scope.row)">删除</el-text>
+              <el-text class="common-btn-text-primary" @click="handleUpdate(scope.row.dictCode)">编辑</el-text>
+              <el-text class="common-btn-text-danger" @click="handleDelete(scope.row.dictCode)">删除</el-text>
             </template>
           </el-table-column>
         </el-table>
@@ -30,14 +30,13 @@
         />
       </div>
     </div>
-    <VideoAdd v-if="videoAddState.show" :event-id="videoAddState.eventId" @close="handleCancel" @refresh="fetchWorkrData" />
+    <VideoAdd v-if="videoAddState.show" :dict-code="videoId" @close="handleCancel" @refresh="fetchWorkrData" />
   </div>
 </template>
 <script setup lang="ts">
 import { onMounted, reactive, ref } from 'vue';
-import { to } from 'await-to-js';
 import VideoAdd from '@/views/videoTag/videoAdd.vue';
-import { getTagList } from '@/api/viedoTag/viedoManagement';
+import { deleteVideoTag, getTagList, getVideoIsNull } from '@/api/viedoTag/viedoManagement';
 const loading = ref(true);
 const showSearch = ref(true);
 const multiple = ref(true);
@@ -47,7 +46,6 @@ const total = ref(0);
 const tableData = ref([]);
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const initFormData = reactive({
-  dictcode: '',
   dictLabel: ''
 });
 const data = reactive({
@@ -60,35 +58,50 @@ const data = reactive({
 });
 const { queryParams, form } = toRefs(data);
 let videoAddState = reactive({
-  show: false,
-  eventId: ''
+  show: false
 });
+let videoId = ref('');
 const handleCancel = () => {
   videoAddState.show = false;
 };
 
 const handleAdd = () => {
   videoAddState.show = true;
+  videoId.value = '';
 };
-const handleUpdate = (row) => {
-  if (row) {
-    videoAddState.eventId = row.dictcode + '';
-    videoAddState.show = true;
-  }
+const handleUpdate = (dictCode: string) => {
+  videoAddState.show = true;
+  videoId.value = dictCode;
 };
-const handleDelete = async (row) => {
-  let id = [];
-  if (row) {
-    id = [row.dictcode];
-  } else {
-    id = ids.value;
-  }
-  const [err] = await to(proxy?.$modal.confirm('此标签已被摄像头使用，是否确认删除？') as any);
-  if (!err) {
-    await workDelete(id);
-    proxy.$modal.msgSuccess('删除成功');
-    fetchWorkrData();
-  }
+const handleDelete = (dictCode: string) => {
+  // 调用 getVideoIsNull 检查是否有摄像头使用此标签
+  getVideoIsNull(dictCode)
+    .then((response) => {
+      const videoNum = response.videonum;
+      if (videoNum > 0) {
+        // 如果 videonum 大于 0，弹出带有详细信息的确认框
+        proxy?.$modal
+          .confirm(response.data + ' 是否确认删除？')
+          .then(() => {
+            deleteVideoTag(dictCode).then(() => {
+              proxy?.$modal.msgSuccess('删除成功');
+              fetchWorkrData();
+            });
+          })
+          .catch(() => {
+            // 用户取消删除操作，不需要做任何事情
+          });
+      } else {
+        // 如果 videonum 小于或等于 0，直接删除，无需提示
+        deleteVideoTag(dictCode).then(() => {
+          proxy?.$modal.msgSuccess('删除成功');
+          fetchWorkrData();
+        });
+      }
+    })
+    .catch((error) => {
+      console.error('检查视频标签使用情况时发生错误:', error);
+    });
 };
 const fetchWorkrData = () => {
   loading.value = true;
@@ -102,7 +115,7 @@ const fetchWorkrData = () => {
     });
 };
 const handleSelectionChange = (selection) => {
-  ids.value = selection.map((item) => item.dictcode);
+  ids.value = selection.map((item) => item.dictCode);
   selectedRow.value = selection.length === 1 ? selection[0] : null;
   single.value = selection.length != 1;
   multiple.value = !selection.length;