|
|
@@ -0,0 +1,178 @@
|
|
|
+<template>
|
|
|
+ <CusDialog
|
|
|
+ :show="show"
|
|
|
+ title="关联分类"
|
|
|
+ @onClose="$emit('update:show', false)"
|
|
|
+ width="90%"
|
|
|
+ height="90%"
|
|
|
+ :show-submit="false"
|
|
|
+ :loading="state.loading"
|
|
|
+ >
|
|
|
+ <div class="__cus-manage_content">
|
|
|
+ <div class="__cus-manage_content-filters">
|
|
|
+ <CusFormColumn
|
|
|
+ :span="8"
|
|
|
+ link="tree-select"
|
|
|
+ :options="tagTreeCpt"
|
|
|
+ v-model:param="state.tagValue"
|
|
|
+ node-key="id"
|
|
|
+ :props="{
|
|
|
+ label: 'labelName',
|
|
|
+ value: 'id'
|
|
|
+ }"
|
|
|
+ default-expand-all
|
|
|
+ @change="handleSelect"
|
|
|
+ >
|
|
|
+ <template #default="{data}">
|
|
|
+ <div class="tree-item">
|
|
|
+ {{data.labelName}}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </CusFormColumn>
|
|
|
+ </div>
|
|
|
+ <div class="__cus-manage_content-main" v-loading="state.query.loading">
|
|
|
+ <CusTable
|
|
|
+ :data="state.query.result.data"
|
|
|
+ :table-head="state.query.tableHead"
|
|
|
+ :no-page="true"
|
|
|
+ >
|
|
|
+ <template #labelType-column-value="{scope}">
|
|
|
+ {{DictionaryStore.labelTypeMap.get(scope.row.labelType)}}
|
|
|
+ </template>
|
|
|
+ <template #do-column-value="{scope}">
|
|
|
+ <CusButton type="table-del" @click="onDel(scope.row)"/>
|
|
|
+ </template>
|
|
|
+ </CusTable>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </CusDialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import {computed, getCurrentInstance, nextTick, reactive, ref, watch} from "vue";
|
|
|
+import {useDictionaryStore} from "@/stores";
|
|
|
+import {ElMessage, ElMessageBox} from "element-plus";
|
|
|
+import {sysIndexCreate, sysIndexDeleteByLinkId, sysIndexFindAllByIndexId} from "@/api/modules/manage";
|
|
|
+import {sysLabelAddIndexToLabel, sysLabelGetAllSysLabels} from "@/api/modules/manage/type";
|
|
|
+
|
|
|
+const emit = defineEmits(['update:show', 'refresh'])
|
|
|
+const {proxy} = getCurrentInstance()
|
|
|
+const DictionaryStore = useDictionaryStore()
|
|
|
+const props = defineProps({
|
|
|
+ show: {default: false},
|
|
|
+ transfer: {}
|
|
|
+ })
|
|
|
+const state: any = reactive({
|
|
|
+ loading: false,
|
|
|
+ query: {
|
|
|
+ loading: false,
|
|
|
+ tableHead: [
|
|
|
+ {value: "labelType", label: "分类类型"},
|
|
|
+ {value: "labelName", label: "分类名称"},
|
|
|
+ {value: "linkTime", label: "关联时间"},
|
|
|
+ {value: "do", label: "操作", width: 100, fixed: 'right'},
|
|
|
+ ],
|
|
|
+ result: {
|
|
|
+ data: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tagTree: [],
|
|
|
+ tagValue: ''
|
|
|
+})
|
|
|
+const tagTreeCpt = computed(() => {
|
|
|
+ const arr = state.tagTree.map(v => {
|
|
|
+ v.disabled = true
|
|
|
+ v.children = v.sysLabels.filter(s => state.query.result.data.every(c => c.typeId != s.id))
|
|
|
+ return v
|
|
|
+ }).filter(v => v.children?.length > 0)
|
|
|
+ return arr
|
|
|
+})
|
|
|
+const tagTreeMapCpt = computed(() => {
|
|
|
+ const map = new Map()
|
|
|
+ tagTreeCpt.value.forEach(v => {
|
|
|
+ v.children.forEach(c => {
|
|
|
+ map.set(c.id, c.labelName)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ return map
|
|
|
+})
|
|
|
+const initTree = () => {
|
|
|
+ sysLabelGetAllSysLabels().then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ state.tagTree = res.data
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const handleSelect = (val) => {
|
|
|
+ ElMessageBox.confirm(`是否关联${tagTreeMapCpt.value.get(val)}?`, "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ } as any).then(() => {
|
|
|
+ state.loading = true
|
|
|
+ sysIndexCreate({
|
|
|
+ indexId: props.transfer.id,
|
|
|
+ typeId: val
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ ElMessage.success('添加成功！')
|
|
|
+ emit('refresh')
|
|
|
+ state.loading = false
|
|
|
+ state.tagValue = ''
|
|
|
+ initRelation()
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {})
|
|
|
+}
|
|
|
+const initRelation = () => {
|
|
|
+ state.query.loading = true
|
|
|
+ sysIndexFindAllByIndexId(props.transfer.id).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ state.query.result.data = res.data
|
|
|
+ state.query.loading = false
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const onDel = (row) => {
|
|
|
+ ElMessageBox.confirm(`请确认是否取消关联${row.labelName}?`, "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ } as any).then(() => {
|
|
|
+ state.loading = true
|
|
|
+ sysIndexDeleteByLinkId(row.id).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ ElMessage.success('删除成功！')
|
|
|
+ emit('refresh')
|
|
|
+ state.loading = false
|
|
|
+ initRelation()
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {})
|
|
|
+}
|
|
|
+watch(() => props.show, (n) => {
|
|
|
+ if (n) {
|
|
|
+ initDictionary()
|
|
|
+ initTree()
|
|
|
+ initRelation()
|
|
|
+ }
|
|
|
+})
|
|
|
+const initDictionary = () => {
|
|
|
+ DictionaryStore.initDict('label_type')
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.__cus-manage_content {
|
|
|
+ margin-bottom: 0;
|
|
|
+ height: calc(100% - 24px);
|
|
|
+}
|
|
|
+</style>
|
CzRger