祖安之光
2025-07-15 050ee6d982a8ae40011f1f723198d23fedae40b3
src/views/build/conpanyFunctionConsult/qualityManage/rangeManage/range/index.vue
@@ -42,7 +42,17 @@
              node-key="id"
              :current-node-key="currentSelectedKey"
              @node-click="handleNodeClick"
          ></el-tree>
          >
            <template #default="{ node,data }">
              <el-tooltip
                  :content="data.mess"
                  placement="bottom"
                  :disabled="!isTextOverflow(data)"
              >
                <span class="tree-text">{{ data.mess }}</span>
              </el-tooltip>
            </template>
          </el-tree>
        </div>
        <el-empty v-else description="暂无数据" />
      </div>
@@ -236,6 +246,29 @@
  }
  loading.value = false;
}
const textMeasureRef = ref(null);
const getMeasureElement = () => {
  if (!textMeasureRef.value) {
    const el = document.createElement('span');
    el.className = 'text-measure-element';
    el.style.cssText = `
      position: absolute;
      visibility: hidden;
      white-space: nowrap;
      font-size: 14px; /* 匹配实际字体大小 */
    `;
    document.body.appendChild(el);
    textMeasureRef.value = el;
  }
  return textMeasureRef.value;
};
// 判断文本是否溢出
const isTextOverflow = (text) => {
  const measureEl = getMeasureElement();
  measureEl.textContent = text.mess;
  return measureEl.scrollWidth > 300; // 180px 是节点容器实际宽度
};
const handleTree = (val) => {
  const traverse = (nodes, currentPath = '') => {
    nodes.forEach((node, index) => {
@@ -486,6 +519,15 @@
  }
}
const openFile = async(path)=>{
  const ext = path.split('.').pop().toLowerCase();
  if (ext === 'doc') {
    ElMessageBox.confirm('暂不支持线上预览.doc文件,是否下载查看?', '提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => {
      window.open(`${import.meta.env.VITE_APP_BASE_API}/${path}`, '_blank');
    }).catch(() => {
      console.log('取消预览')
    });
    return
  }
  try {
    // 1. 获取文件
    const response = await fetch(import.meta.env.VITE_APP_BASE_API + '/' + path);
@@ -588,10 +630,31 @@
      :deep(.el-tree){
        background: none;
      }
      :deep(.el-tooltip )
        {
          color: black;
          text-overflow: ellipsis;
          overflow: hidden;
          word-break: break-all;
          white-space: nowrap;
        }
      .tree-text {
        display: inline-block;
        max-width: 300px;   /* 根据实际容器宽度调整 */
        white-space: nowrap; /* 强制不换行 */
        overflow: hidden;    /* 隐藏溢出 */
        text-overflow: ellipsis; /* 显示省略号 */
      }
      /* 可选:移除el-tree默认的节点内边距 */
      .el-tree-node__content {
        padding-right: 5px;
      }
      .tree-container {
        max-width: 600px;
        margin-top: 20px;
        height: 100%;
        max-height: 1200px;
        box-shadow: 8px 0 15px rgba(0,21,41,0.08);
        overflow: auto;  /* 确保出现滚动条 */
      }