|
@@ -9,7 +9,7 @@
|
|
|
<div class="title">当前标签</div>
|
|
|
</div>
|
|
|
<div class="tags">
|
|
|
- <div v-for="(item, index) in currentTags" :key="index" class="tag">{{ item.dict_label }}</div>
|
|
|
+ <div v-for="(item, index) in tags" :key="index" class="tag">{{ item.dict_label }}</div>
|
|
|
</div>
|
|
|
<div class="title-box">
|
|
|
<div class="title">新建标签</div>
|
|
@@ -22,7 +22,7 @@
|
|
|
<div class="title">最近标签</div>
|
|
|
</div>
|
|
|
<div class="tags">
|
|
|
- <div v-for="(item, index) in recentTags" :key="index" class="tag">{{ item.name }}</div>
|
|
|
+ <div v-for="(item, index) in recentTags" :key="index" class="tag" @click="handleAdd2(item)">{{ item.dict_label }}</div>
|
|
|
</div>
|
|
|
<div class="title-box3">
|
|
|
<i class="icon-type" />
|
|
@@ -32,13 +32,14 @@
|
|
|
:teleported="false"
|
|
|
class="custom-select"
|
|
|
popper-class="custom-select-popper"
|
|
|
- style="width: 140px; margin-bottom: 10px;"
|
|
|
+ style="width: 140px; margin-bottom: 10px"
|
|
|
>
|
|
|
- <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ <el-option label="全部" value="lx" />
|
|
|
+ <el-option v-for="item in video_tag_type" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="tags">
|
|
|
- <div v-for="(item, index) in typeTags" :key="index" class="tag">{{ item.name }}</div>
|
|
|
+ <div v-for="(item, index) in typeTags" :key="index" class="tag" @click="handleAdd2(item)">{{ item.dict_label }}</div>
|
|
|
</div>
|
|
|
<div class="title-box3">
|
|
|
<i class="icon-industry" />
|
|
@@ -48,58 +49,63 @@
|
|
|
:teleported="false"
|
|
|
class="custom-select"
|
|
|
popper-class="custom-select-popper"
|
|
|
- style="width: 140px; margin-bottom: 10px;"
|
|
|
+ style="width: 140px; margin-bottom: 10px"
|
|
|
>
|
|
|
- <el-option v-for="item in industryOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ <el-option label="全部" value="hy" />
|
|
|
+ <el-option v-for="item in video_tag_industry" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="tags">
|
|
|
- <div v-for="(item, index) in industryTags" :key="index" class="tag">{{ item.name }}</div>
|
|
|
+ <div v-for="(item, index) in industryTags" :key="index" class="tag" @click="handleAdd2(item)">{{ item.dict_label }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup name="VideoTagEdit">
|
|
|
+import {
|
|
|
+ addVideoTag,
|
|
|
+ addVideoTagLabel,
|
|
|
+ getLxHyVideoTagInfo,
|
|
|
+ getRecentlyVideoTagInfo,
|
|
|
+ getVideoTagInfo
|
|
|
+} from '@/api/videoMonitor';
|
|
|
+
|
|
|
const props = defineProps({
|
|
|
modelValue: Boolean,
|
|
|
+ tags: [],
|
|
|
id: String
|
|
|
});
|
|
|
-const emits = defineEmits(['update:modelValue']);
|
|
|
-let currentTags = ref([]);
|
|
|
+const emits = defineEmits(['update:modelValue', 'updateVideoTag']);
|
|
|
+const proxy = getCurrentInstance()?.proxy;
|
|
|
+const { video_tag_type, video_tag_industry } = toRefs<any>(proxy?.useDict('video_tag_type', 'video_tag_industry'));
|
|
|
let addTag = ref('');
|
|
|
let recentTags = ref([]);
|
|
|
-let type = ref('');
|
|
|
+let type = ref('lx');
|
|
|
let typeTags = ref([]);
|
|
|
-let typeOptions = ref([]);
|
|
|
-let industry = ref('');
|
|
|
+let industry = ref('hy');
|
|
|
let industryTags = ref([]);
|
|
|
-let industryOptions = ref([]);
|
|
|
|
|
|
-const getData = () => {
|
|
|
- getVideoTagInfo({ video_code: props.id }).then((res) => {
|
|
|
- currentTags.value = res.data;
|
|
|
+const getTypeList = () => {
|
|
|
+ getLxHyVideoTagInfo({ dict_value: type.value }).then((res) => {
|
|
|
+ typeTags.value = res.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+const getIndustryList = () => {
|
|
|
+ getLxHyVideoTagInfo({ dict_value: industry.value }).then((res) => {
|
|
|
+ industryTags.value = res.data;
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
watch(
|
|
|
() => props.id,
|
|
|
() => {
|
|
|
if (!!props.id) {
|
|
|
- getData();
|
|
|
- recentTags.value = [{ name: '河坝' }, { name: '水库' }, { name: '山塘' }];
|
|
|
- typeTags.value = [{ name: '河坝' }, { name: '水库' }, { name: '山塘' }];
|
|
|
- industryTags.value = [{ name: '河坝' }, { name: '水库' }, { name: '山塘' }];
|
|
|
- typeOptions.value = [
|
|
|
- { label: '全部', value: '' },
|
|
|
- { label: '水库', value: '1' }
|
|
|
- ];
|
|
|
- industryOptions.value = [
|
|
|
- { label: '全部', value: '' },
|
|
|
- { label: '水库', value: '1' }
|
|
|
- ];
|
|
|
+ getRecentlyVideoTagInfo().then((res) => {
|
|
|
+ recentTags.value = res.data;
|
|
|
+ });
|
|
|
+ getTypeList();
|
|
|
+ getIndustryList();
|
|
|
} else {
|
|
|
- currentTags.value = [];
|
|
|
addTag.value = '';
|
|
|
recentTags.value = [];
|
|
|
typeTags.value = [];
|
|
@@ -115,15 +121,20 @@ const handleClose = () => {
|
|
|
emits('update:modelValue', false);
|
|
|
};
|
|
|
const handleAdd = () => {
|
|
|
- addVideoTag({
|
|
|
+ addVideoTagLabel({
|
|
|
video_code: props.id,
|
|
|
- dict_value: addTag.value,
|
|
|
+ dict_label: addTag.value,
|
|
|
dict_type: 'video_type'
|
|
|
}).then(() => {
|
|
|
- getData();
|
|
|
+ emits('updateVideoTag');
|
|
|
});
|
|
|
addTag.value = '';
|
|
|
};
|
|
|
+const handleAdd2 = (item) => {
|
|
|
+ addVideoTag({ video_code: props.id, dict_value: item.dict_value, dict_type: 'video_type' }).then(() => {
|
|
|
+ emits('updateVideoTag');
|
|
|
+ });
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
@@ -245,6 +256,7 @@ const handleAdd = () => {
|
|
|
justify-content: center;
|
|
|
margin-top: 10px;
|
|
|
padding: 0 20px 0 15px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
.custom-input {
|
|
|
width: 230px;
|