UPDATE: 处理控制台警告问题
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
</div>
|
||||
<div class="data-check-content">
|
||||
<div class="content-tree" :style="{ height: `calc(100vh - ${props.shrink ? '370px' : '315px'})` }">
|
||||
<Tree :treeData="treeData" @setTab="setTab" />
|
||||
<TestScriptTree :treeData="treeData" @setTab="setTab" />
|
||||
</div>
|
||||
|
||||
<div
|
||||
@@ -19,17 +19,18 @@
|
||||
<el-tab-pane v-for="tab in tabData" :key="tab.value" :label="tab.label" :name="tab.value">
|
||||
<div v-if="activeName == tab.value">
|
||||
<div class="dialog-footer">
|
||||
<el-switch v-model="value1"
|
||||
inline-prompt
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="禁用"
|
||||
inactive-text="启用"
|
||||
@change="enableScript"
|
||||
size="large"
|
||||
width="80px"
|
||||
style="margin-right: 10px;"
|
||||
/>
|
||||
<el-switch
|
||||
v-model="value1"
|
||||
inline-prompt
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="禁用"
|
||||
inactive-text="启用"
|
||||
@change="enableScript"
|
||||
size="large"
|
||||
width="80px"
|
||||
style="margin-right: 10px"
|
||||
/>
|
||||
<el-button :icon="CirclePlus" type="primary" @click="openDialog('add')">新增</el-button>
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
@@ -41,7 +42,7 @@
|
||||
:formContent="props.formContent"
|
||||
:options="props.options"
|
||||
style="width: 360px"
|
||||
:shrink="props.shrink"
|
||||
:shrink="props.shrink"
|
||||
:disabled="tab.children.length == 0 ? false : true"
|
||||
ref="communRef"
|
||||
/>
|
||||
@@ -215,20 +216,21 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { type PropType, ref, nextTick } from 'vue'
|
||||
import Tree from './tree.vue'
|
||||
import { type PropType, ref } from 'vue'
|
||||
import TestScriptTree from './testScriptTree.vue'
|
||||
import Commun from './communication.vue'
|
||||
import { type CascaderOption, ElMessageBox } from 'element-plus'
|
||||
import { ElMessageBox } from 'element-plus'
|
||||
import { getTreeData } from '@/api/check/test'
|
||||
import { CirclePlus, Delete, Check, CopyDocument, View, EditPen } from '@element-plus/icons-vue'
|
||||
import { CirclePlus, CopyDocument, Delete, EditPen, View } from '@element-plus/icons-vue'
|
||||
import type { TestScript } from '@/api/device/interface/testScript'
|
||||
import TestProjectPopup from '@/views/machine/testScript/components/testProjectPopup.vue'
|
||||
import { CheckData } from '@/api/check/interface'
|
||||
import { dlsDetails, deleteDtls, updateDtls, addScriptDtls, checkDataList } from '@/api/device/testScript'
|
||||
import { addScriptDtls, deleteDtls, dlsDetails, updateDtls } from '@/api/device/testScript'
|
||||
import { useDictStore } from '@/stores/modules/dict'
|
||||
import { useHandleData } from '@/hooks/useHandleData'
|
||||
import { scriptDtlsCheckDataList } from '@/api/device/testScript/index'
|
||||
import ViewRow from '@/views/machine/testScript/components/viewRow.vue'
|
||||
|
||||
interface TabOption {
|
||||
label?: string
|
||||
name?: string
|
||||
@@ -280,7 +282,7 @@ const column = ref([
|
||||
])
|
||||
// 获取树
|
||||
const getTree = () => {
|
||||
// console.log('props.formContent.id', props.formContent.id)
|
||||
// console.log('props.formContent.id', props.formContent.id)
|
||||
getTreeData({
|
||||
scriptId: props.formContent.id
|
||||
}).then(res => {
|
||||
@@ -370,8 +372,6 @@ const inquireTable = () => {
|
||||
value1.value = tableData.value.some(item => item.enable === 1) ? 1 : 0
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
// 打开 drawer(新增、编辑)
|
||||
const openDialog = (titleType: string, row: Partial<TestScript.ResTestScript> = {}) => {
|
||||
@@ -420,7 +420,7 @@ const copyRow = async (row: any) => {
|
||||
// 查看
|
||||
const view = (row: Partial<TestScript.ResTestScript> = {}) => {
|
||||
getCommunication()
|
||||
// console.log('communicationList', communicationList.value)
|
||||
// console.log('communicationList', communicationList.value)
|
||||
//当前点击的一级tab
|
||||
const parentTabName = communicationList.value.find(t => t.id === activeName.value)?.name || '未找到对应名称'
|
||||
//当前点击的二级tab
|
||||
@@ -466,7 +466,6 @@ const enableRow = async (row: any) => {
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 启用/禁用脚本的方法
|
||||
const enableScript = async () => {
|
||||
const willEnable = value1.value === 1
|
||||
@@ -496,7 +495,6 @@ const enableScript = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 获取左边树数据
|
||||
// 新增保存
|
||||
const addTab = (row: any) => {
|
||||
@@ -537,7 +535,6 @@ onMounted(() => {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
|
||||
/* 确保 el-tree 内容可以超出容器宽度 */
|
||||
.el-tree {
|
||||
width: fit-content; /* 根据内容自适应宽度 */
|
||||
@@ -553,7 +550,6 @@ onMounted(() => {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
.divider-container {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
@@ -1,106 +1,106 @@
|
||||
<template>
|
||||
<el-tree
|
||||
node-key="id"
|
||||
default-expand-all
|
||||
:data="props.treeData"
|
||||
:props="defaultProps"
|
||||
style="width: 100%"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<el-tooltip effect="dark" :content="data.sourceDesc || data.scriptTypeName" placement="top" :hide-after="0">
|
||||
<div class="custom-tree-node">
|
||||
{{ data.scriptTypeName || data.sourceDesc }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-tree>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
import { CheckData } from '@/api/check/interface'
|
||||
const props = defineProps({
|
||||
treeData: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['setTab'])
|
||||
const dataTree = ref<CheckData.TreeItem[]>([])
|
||||
const defaultProps = {
|
||||
children: 'children',
|
||||
label: 'scriptTypeName',
|
||||
pid: 'pid'
|
||||
}
|
||||
const activeName = ref('')
|
||||
const childActiveName = ref('')
|
||||
const handleNodeClick = (data, node) => {
|
||||
console.log('handleNodeClick', data, node)
|
||||
let code = ['Base', 'VOL', 'Freq', 'Harm', 'Base_0_10', 'Base_20_85', 'Base_110_200']
|
||||
const parents = getParentNodes(node, [])
|
||||
parents.pop()
|
||||
parents.unshift(node.data)
|
||||
parents.reverse()
|
||||
let active = parents[0].scriptTypeCode
|
||||
let childActive = findTargetCodes(parents, code)[0] || ''
|
||||
// 获取当前节点的直接父节点
|
||||
if (activeName.value != active || childActiveName.value != childActive) {
|
||||
activeName.value = active
|
||||
childActiveName.value = childActive
|
||||
emit('setTab', {
|
||||
activeName: active,
|
||||
childActiveName: childActive
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 返回父级
|
||||
const getParentNodes = (node, parents) => {
|
||||
if (node.parent) {
|
||||
// 将父节点添加到数组中
|
||||
parents.push(node.parent.data)
|
||||
// 递归获取更高层级的父节点
|
||||
getParentNodes(node.parent, parents)
|
||||
}
|
||||
return parents
|
||||
}
|
||||
// 判断childActiveName值
|
||||
function findTargetCodes(data: any[], targetCodes: string[]) {
|
||||
let result: string[] = []
|
||||
data.forEach(item => {
|
||||
if (item.scriptTypeCode != null) {
|
||||
if (targetCodes.includes(item.scriptTypeCode)) {
|
||||
result.push(item.scriptTypeCode)
|
||||
}
|
||||
}
|
||||
})
|
||||
return result
|
||||
// for (let item of data) {
|
||||
// // 判断当前项的 scriptTypeCode 是否包含目标值
|
||||
// if (item.scriptTypeCode !=null && targetCodes.includes(item.scriptTypeCode)) {
|
||||
|
||||
// result.push(item.scriptTypeCode)
|
||||
// return result
|
||||
// }
|
||||
// // 如果存在 children,递归检查
|
||||
// if (item.children && item.children.length > 0) {
|
||||
// result = result.concat(findTargetCodes(item.children, targetCodes))
|
||||
// }
|
||||
// }
|
||||
// return result
|
||||
}
|
||||
|
||||
onMounted(() => {})
|
||||
// // 对外映射
|
||||
// defineExpose({ init })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.custom-tree-node {
|
||||
max-width: 230px;
|
||||
overflow-x: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<el-tree
|
||||
node-key="id"
|
||||
default-expand-all
|
||||
:data="props.treeData"
|
||||
:props="defaultProps"
|
||||
style="width: 100%"
|
||||
:expand-on-click-node="false"
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<el-tooltip effect="dark" :content="data.sourceDesc || data.scriptTypeName" placement="top" :hide-after="0">
|
||||
<div class="custom-tree-node">
|
||||
{{ data.scriptTypeName || data.sourceDesc }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-tree>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
import { CheckData } from '@/api/check/interface'
|
||||
const props = defineProps({
|
||||
treeData: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['setTab'])
|
||||
const dataTree = ref<CheckData.TreeItem[]>([])
|
||||
const defaultProps = {
|
||||
children: 'children',
|
||||
label: 'scriptTypeName',
|
||||
pid: 'pid'
|
||||
}
|
||||
const activeName = ref('')
|
||||
const childActiveName = ref('')
|
||||
const handleNodeClick = (data, node) => {
|
||||
console.log('handleNodeClick', data, node)
|
||||
let code = ['Base', 'VOL', 'Freq', 'Harm', 'Base_0_10', 'Base_20_85', 'Base_110_200']
|
||||
const parents = getParentNodes(node, [])
|
||||
parents.pop()
|
||||
parents.unshift(node.data)
|
||||
parents.reverse()
|
||||
let active = parents[0].scriptTypeCode
|
||||
let childActive = findTargetCodes(parents, code)[0] || ''
|
||||
// 获取当前节点的直接父节点
|
||||
if (activeName.value != active || childActiveName.value != childActive) {
|
||||
activeName.value = active
|
||||
childActiveName.value = childActive
|
||||
emit('setTab', {
|
||||
activeName: active,
|
||||
childActiveName: childActive
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 返回父级
|
||||
const getParentNodes = (node, parents) => {
|
||||
if (node.parent) {
|
||||
// 将父节点添加到数组中
|
||||
parents.push(node.parent.data)
|
||||
// 递归获取更高层级的父节点
|
||||
getParentNodes(node.parent, parents)
|
||||
}
|
||||
return parents
|
||||
}
|
||||
// 判断childActiveName值
|
||||
function findTargetCodes(data: any[], targetCodes: string[]) {
|
||||
let result: string[] = []
|
||||
data.forEach(item => {
|
||||
if (item.scriptTypeCode != null) {
|
||||
if (targetCodes.includes(item.scriptTypeCode)) {
|
||||
result.push(item.scriptTypeCode)
|
||||
}
|
||||
}
|
||||
})
|
||||
return result
|
||||
// for (let item of data) {
|
||||
// // 判断当前项的 scriptTypeCode 是否包含目标值
|
||||
// if (item.scriptTypeCode !=null && targetCodes.includes(item.scriptTypeCode)) {
|
||||
|
||||
// result.push(item.scriptTypeCode)
|
||||
// return result
|
||||
// }
|
||||
// // 如果存在 children,递归检查
|
||||
// if (item.children && item.children.length > 0) {
|
||||
// result = result.concat(findTargetCodes(item.children, targetCodes))
|
||||
// }
|
||||
// }
|
||||
// return result
|
||||
}
|
||||
|
||||
onMounted(() => {})
|
||||
// // 对外映射
|
||||
// defineExpose({ init })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.custom-tree-node {
|
||||
max-width: 230px;
|
||||
overflow-x: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user