haiwei-module-admin 1.0.82 → 1.0.83

package/package.json

@@ -2,7 +2,7 @@
   "id": 0,
   "name": "haiwei-module-admin",
   "code": "admin",
-  "version": "1.0.82",
+  "version": "1.0.83",
   "description": "haiwei前端Admin模块组件",
   "author": "Eric",
   "license": "ISC",

package/src/components/enum-text/index.vue

@@ -69,11 +69,11 @@ export default {
       const enumItem = this.enumList.find(item => item.value == this.value)
       return enumItem ? enumItem.label : this.value
     },
-    
+
     showTag() {
       return this.useTag && this.value !== null && this.value !== undefined && this.value !== ''
     },
-    
+
     // 计算tag颜色类型
     computedTagType() {
       // 如果用户指定了tagType
@@ -82,14 +82,14 @@ export default {
         if (typeof this.tagType === 'string') {
           return this.tagType
         }
-        
+
         // 如果是对象，根据枚举值查找对应的颜色
         if (typeof this.tagType === 'object' && this.tagType !== null) {
           // 首先尝试精确匹配
           if (this.tagType[this.value] !== undefined) {
             return this.tagType[this.value]
           }
-          
+
           // 尝试数字匹配
           const numValue = Number(this.value)
           if (this.tagType[numValue] !== undefined) {
@@ -97,21 +97,21 @@ export default {
           }
         }
       }
-      
+
       // 如果没有指定或未找到匹配，根据枚举值自动计算
       if (this.value === null || this.value === undefined || this.value === '') {
         return 'info'
       }
-      
+
       // 将值转换为数字
       const numValue = Number(this.value)
-      
+
       // 简单的颜色映射
-      if (numValue === 0) return 'primary'   // 默认/初始状态
-      if (numValue === 1) return 'success'   // 成功/确认状态
-      if (numValue === 2) return 'warning'   // 警告状态
-      if (numValue === 3) return 'danger'    // 失败/错误状态
-      
+      if (numValue === 0) return 'primary' // 默认/初始状态
+      if (numValue === 1) return 'success' // 成功/确认状态
+      if (numValue === 2) return 'warning' // 警告状态
+      if (numValue === 3) return 'danger' // 失败/错误状态
+
       // 其他值使用循环颜色
       const colors = ['primary', 'success', 'warning', 'danger', 'info']
       return colors[numValue % colors.length] || 'info'
@@ -140,7 +140,7 @@ export default {
 
       // 生成缓存键
       const cacheKey = `${this.moduleCode}_${this.enumName}_${this.libName || ''}`
-      
+
       // 检查缓存
       if (enumCache.has(cacheKey)) {
         this.enumList = enumCache.get(cacheKey)
@@ -157,7 +157,7 @@ export default {
       try {
         const { moduleCode, enumName, libName } = this
         const result = await $api.admin.tool.enumSelect({ moduleCode, enumName, libName })
-        
+
         // API返回的是数组格式：[{label: '出仓', value: 0}, {label: '入仓', value: 1}]
         if (result && Array.isArray(result)) {
           this.enumList = result

package/src/components/file-preview/index.vue

@@ -1,12 +1,15 @@
 <template>
   <div class="file-preview">
-    <!-- 图片预览链接 -->
-    <a v-if="isImage" class="preview-link" @click="showPreviewDialog">
-      查看
-    </a>
+    <!-- 当fullPath有效时显示内容 -->
+    <template v-if="hasValidFullPath">
+      <!-- 图片预览链接 -->
+      <a v-if="isImage" class="preview-link" @click="showPreviewDialog">
+        查看
+      </a>
 
-    <!-- 非图片文件下载 -->
-    <nm-file-download v-else :url="downloadUrl" :private="isPrivate" :fileName="fileName" :text="downloadText" :icon="downloadIcon" :size="downloadSize" :type="downloadType" @click="onDownload" />
+      <!-- 非图片文件下载 -->
+      <nm-file-download v-else :url="downloadUrl" :private="isPrivate" :fileName="fileName" :text="downloadText" :icon="downloadIcon" :size="downloadSize" :type="downloadType" @click="onDownload" />
+    </template>
 
     <!-- 图片预览对话框 -->
     <nm-dialog
@@ -53,8 +56,17 @@
             <span class="text">重置</span>
           </button>
           <!-- 非图片文件下载 -->
-         <nm-file-download  :url="downloadUrl" :private="isPrivate" :fileName="fileName" :text="downloadText" :icon="downloadIcon" :size="downloadSize" :type="downloadType" @click="onDownload" />
-
+          <nm-file-download
+            v-if="hasValidFullPath"
+            :url="downloadUrl"
+            :private="isPrivate"
+            :fileName="fileName"
+            :text="downloadText"
+            :icon="downloadIcon"
+            :size="downloadSize"
+            :type="downloadType"
+            @click="onDownload"
+          />
         </div>
       </div>
     </nm-dialog>
@@ -66,9 +78,7 @@ export default {
   name: 'FilePreview',
   props: {
     fullPath: { type: String, required: true },
-    fileName: String,
     isPrivate: { type: Boolean, default: false },
-    ext: String,
     downloadText: { type: String, default: '下载' },
     downloadIcon: { type: String, default: 'download' },
     downloadSize: String,
@@ -104,10 +114,42 @@ export default {
   },
 
   computed: {
+    hasValidFullPath() {
+      // 检查fullPath是否有效：不为空
+      if (!this.fullPath || this.fullPath.trim() === '') return false
+
+      // 检查是否是目录路径（以斜杠结尾）
+      if (this.fullPath.endsWith('/') || this.fullPath.endsWith('\\')) return false
+
+      // 检查是否有文件名（路径的最后一部分）
+      const path = this.fullPath.replace(/\\/g, '/')
+      const filename = path.split('/').pop()
+
+      // 文件名不能为空
+      if (!filename || filename.trim() === '') return false
+
+      // 文件名应该包含点号（表示有扩展名），但为了兼容性，不强制要求
+      // 因为有些文件可能没有扩展名，或者扩展名被省略
+      return true
+    },
+
+    fileName() {
+      // 从fullPath中提取文件名
+      if (!this.fullPath) return ''
+      const path = this.fullPath.replace(/\\/g, '/')
+      const filename = path.split('/').pop()
+      return filename || ''
+    },
+
+    fileExt() {
+      // 从fullPath中提取文件扩展名
+      const filename = this.fileName
+      const dotIndex = filename.lastIndexOf('.')
+      return dotIndex > -1 ? filename.slice(dotIndex + 1).toLowerCase() : ''
+    },
+
     isImage() {
-      // return false;
-      const ext = this.ext || (this.fileName || '').split('.').pop() || ''
-      return this.imageExtensions.includes(ext.toLowerCase())
+      return this.imageExtensions.includes(this.fileExt)
     },
 
     downloadUrl() {
@@ -156,13 +198,6 @@ export default {
   },
 
   methods: {
-    getFileExtension() {
-      if (this.ext) return this.ext.toLowerCase()
-      const name = this.fileName || this.fullPath || ''
-      const dotIndex = name.lastIndexOf('.')
-      return dotIndex > -1 ? name.slice(dotIndex + 1).toLowerCase() : ''
-    },
-
     async getFileInfo() {
       if (!this.fullPath) return null
 

package/src/views/file/index/index.vue

@@ -36,7 +36,7 @@
 
       <!-- 文件预览列 -->
       <template v-slot:col-fullPath="{ row }">
-        <nm-file-preview :fullPath="row.fullPath" :fileName="row.fileName" :ext="row.ext" :isPrivate="row.accessMode !== 1" />
+        <nm-file-preview :fullPath="row.fullPath" :isPrivate="row.accessMode !== 1" />
         <!-- <nm-file-preview :fullPath="row.fullPath"/> -->
       </template>
 

package/src/components/file-preview/index copy.vue

@@ -1,531 +0,0 @@
-<template>
-  <div class="file-preview">
-    <!-- 图片预览链接 -->
-    <a v-if="isImage" class="preview-link" @click="showPreviewDialog">
-      查看
-    </a>
-
-    <!-- 非图片文件下载 -->
-    <nm-file-download v-else :url="downloadUrl" :private="isPrivate" :fileName="fileName" :text="downloadText" :icon="downloadIcon" :size="downloadSize" :type="downloadType" @click="onDownload" />
-
-    <!-- 图片预览对话框 -->
-    <nm-dialog
-      v-if="isImage"
-      ref="previewDialog"
-      :visible.sync="previewVisible"
-      :title="previewTitle"
-      width="800px"
-      height="800px"
-      :fullscreen="false"
-      :footer="false"
-      custom-class="image-preview-dialog"
-      @closed="resetState"
-    >
-      <div class="preview-wrapper">
-        <!-- 使用CSS实现图片居中，而不是JS计算 -->
-        <div class="preview-container" ref="previewContainer">
-          <img
-            :src="previewUrl"
-            :alt="fileName"
-            class="preview-image"
-            ref="previewImage"
-            @load="handleImageLoad"
-            @error="handleImageError"
-            :style="imageStyle"
-            @mousedown="startDrag"
-            @wheel="handleWheel"
-            @dblclick="resetImage"
-          />
-        </div>
-
-        <!-- 操作按钮栏 -->
-        <div class="toolbar">
-          <button class="toolbar-btn" @click="zoomIn">
-            <span class="icon">+</span>
-            <span class="text">放大</span>
-          </button>
-          <button class="toolbar-btn" @click="zoomOut">
-            <span class="icon">-</span>
-            <span class="text">缩小</span>
-          </button>
-          <button class="toolbar-btn" @click="resetImage">
-            <span class="icon">⟳</span>
-            <span class="text">重置</span>
-          </button>
-        </div>
-      </div>
-    </nm-dialog>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'FilePreview',
-  props: {
-    fullPath: { type: String, required: true },
-    fileName: String,
-    isPrivate: { type: Boolean, default: false },
-    ext: String,
-    downloadText: { type: String, default: '下载' },
-    downloadIcon: { type: String, default: 'download' },
-    downloadSize: String,
-    downloadType: { type: String, default: 'primary' },
-    previewTitle: { type: String, default: '图片预览' },
-    imageExtensions: {
-      type: Array,
-      default: () => ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'ico']
-    }
-  },
-
-  data() {
-    return {
-      previewVisible: false,
-      previewUrl: '',
-      fileInfo: null,
-
-      // 图片状态
-      imageLoading: false,
-      imageError: false,
-      loadingTimeout: null,
-
-      // 图片位置和缩放（使用CSS transform，但让CSS处理居中）
-      position: { x: 0, y: 0 },
-      scale: 1,
-      minScale: 0.1,
-      maxScale: 5,
-
-      // 拖拽状态
-      isDragging: false,
-      startPosition: { x: 0, y: 0 }
-    }
-  },
-
-  computed: {
-    isImage() {
-      // return false;
-      const ext = this.ext || (this.fileName || '').split('.').pop() || ''
-      return this.imageExtensions.includes(ext.toLowerCase())
-    },
-
-    downloadUrl() {
-      console.log('this.fileInfo?.url ', this.fileInfo?.url)
-      return this.fileInfo?.url || this.fullPath
-    },
-
-    imageStyle() {
-      return {
-        transform: `translate(${this.position.x}px, ${this.position.y}px) scale(${this.scale})`,
-        cursor: this.isDragging ? 'grabbing' : 'grab'
-      }
-    }
-  },
-
-  watch: {
-    fullPath(val) {
-      if (val && this.isImage && !this.isPrivate) {
-        this.previewUrl = val
-      }
-    },
-
-    previewVisible(val) {
-      if (!val) {
-        this.resetState()
-      }
-    }
-  },
-
-  mounted() {
-    // 监听全局鼠标事件用于拖拽
-    document.addEventListener('mousemove', this.handleDrag)
-    document.addEventListener('mouseup', this.stopDrag)
-  },
-
-  beforeDestroy() {
-    // 清理事件监听
-    document.removeEventListener('mousemove', this.handleDrag)
-    document.removeEventListener('mouseup', this.stopDrag)
-
-    // 清理超时
-    if (this.loadingTimeout) {
-      clearTimeout(this.loadingTimeout)
-      this.loadingTimeout = null
-    }
-  },
-
-  methods: {
-    getFileExtension() {
-      if (this.ext) return this.ext.toLowerCase()
-      const name = this.fileName || this.fullPath || ''
-      const dotIndex = name.lastIndexOf('.')
-      return dotIndex > -1 ? name.slice(dotIndex + 1).toLowerCase() : ''
-    },
-
-    async getFileInfo() {
-      if (!this.fullPath) return null
-
-      try {
-        const result = await $api.admin.file.getByFullPath(this.fullPath)
-        this.fileInfo = result
-
-        console.log('result', result)
-
-        return result
-      } catch (error) {
-        console.error('获取文件信息失败:', error)
-        return null
-      }
-    },
-
-    async showPreviewDialog() {
-      if (!this.isImage) return
-
-      this.resetState()
-      this.imageLoading = true
-      this.previewVisible = true
-
-      try {
-        const fileInfo = await this.getFileInfo()
-        if (!fileInfo) {
-          this.imageLoading = false
-          this.imageError = true
-          return
-        }
-
-        await this.setPreviewUrl(fileInfo)
-
-        // 设置一个立即检查，防止缓存图片不触发load事件
-        this.$nextTick(() => {
-          setTimeout(() => {
-            if (this.imageLoading && this.$refs.previewImage && this.$refs.previewImage.complete) {
-              this.handleImageLoad()
-            }
-          }, 300) // 300ms后检查
-        })
-
-        // 设置超时，防止图片加载事件未触发
-        this.loadingTimeout = setTimeout(() => {
-          if (this.imageLoading) {
-            console.warn('图片加载超时，强制结束加载状态')
-            this.imageLoading = false
-            // 检查图片是否已经加载完成
-            if (this.$refs.previewImage && this.$refs.previewImage.complete) {
-              this.handleImageLoad()
-            }
-          }
-        }, 2000) // 2秒超时
-      } catch (error) {
-        console.error('打开预览对话框失败:', error)
-        this.imageLoading = false
-        this.imageError = true
-      }
-    },
-
-    async setPreviewUrl(fileInfo) {
-      let newUrl
-      if (this.isPrivate && fileInfo.url) {
-        try {
-          newUrl = await $api.admin.file.preview(fileInfo.url)
-        } catch {
-          newUrl = fileInfo.url
-        }
-      } else {
-        newUrl = fileInfo.url || this.fullPath
-      }
-
-      // 先清空URL，强制重新加载（即使URL相同）
-      if (this.previewUrl) {
-        this.previewUrl = ''
-        // 等待一个tick确保DOM更新
-        await this.$nextTick()
-      }
-
-      // 设置新的URL
-      this.previewUrl = newUrl
-
-      // 等待DOM更新后检查图片是否已经加载完成
-      this.$nextTick(() => {
-        // 如果图片元素存在且已经加载完成，直接触发加载完成事件
-        if (this.$refs.previewImage && this.$refs.previewImage.complete) {
-          // 小延迟确保图片完全渲染
-          setTimeout(() => {
-            if (this.imageLoading) {
-              this.handleImageLoad()
-            }
-          }, 100)
-        }
-      })
-    },
-
-    async onDownload() {
-      const fileInfo = await this.getFileInfo()
-      const url = fileInfo?.url || this.fullPath
-      this.$emit('download', url, this.fileName)
-    },
-
-    handleImageLoad() {
-      // 清理超时
-      if (this.loadingTimeout) {
-        clearTimeout(this.loadingTimeout)
-        this.loadingTimeout = null
-      }
-      this.imageLoading = false
-      // 图片加载完成后自动居中
-      this.resetImage()
-    },
-
-    handleImageError() {
-      // 清理超时
-      if (this.loadingTimeout) {
-        clearTimeout(this.loadingTimeout)
-        this.loadingTimeout = null
-      }
-      this.imageLoading = false
-      this.imageError = true
-    },
-
-    // 鼠标滚轮缩放 - 以鼠标为中心点缩放
-    handleWheel(event) {
-      event.preventDefault()
-
-      const delta = event.deltaY < 0 ? 0.1 : -0.1
-      const newScale = Math.max(this.minScale, Math.min(this.maxScale, this.scale + delta))
-
-      // 计算缩放中心（相对于图片）
-      if (this.$refs.previewContainer) {
-        const containerRect = this.$refs.previewContainer.getBoundingClientRect()
-        const mouseX = event.clientX - containerRect.left
-        const mouseY = event.clientY - containerRect.top
-
-        // 计算鼠标相对于图片原始坐标系的位置
-        // 注意：position.x 和 position.y 是图片相对于容器的平移
-        const relativeX = (mouseX - this.position.x) / this.scale
-        const relativeY = (mouseY - this.position.y) / this.scale
-
-        // 更新位置以保持鼠标点不变
-        this.position.x = mouseX - relativeX * newScale
-        this.position.y = mouseY - relativeY * newScale
-        this.scale = newScale
-      } else {
-        this.scale = newScale
-      }
-    },
-
-    // 开始拖拽
-    startDrag(event) {
-      if (event.button !== 0) return // 只响应左键
-      this.isDragging = true
-      this.startPosition = {
-        x: event.clientX - this.position.x,
-        y: event.clientY - this.position.y
-      }
-      event.preventDefault()
-    },
-
-    // 处理拖拽
-    handleDrag(event) {
-      if (!this.isDragging) return
-
-      this.position.x = event.clientX - this.startPosition.x
-      this.position.y = event.clientY - this.startPosition.y
-    },
-
-    // 停止拖拽
-    stopDrag() {
-      this.isDragging = false
-    },
-
-    // 放大
-    zoomIn() {
-      const newScale = Math.min(this.maxScale, this.scale + 0.2)
-      if (newScale !== this.scale) {
-        this.centerZoom(newScale)
-      }
-    },
-
-    // 缩小
-    zoomOut() {
-      const newScale = Math.max(this.minScale, this.scale - 0.2)
-      if (newScale !== this.scale) {
-        this.centerZoom(newScale)
-      }
-    },
-
-    // 以当前视图中心点缩放（用于工具栏按钮）
-    centerZoom(newScale) {
-      if (this.$refs.previewContainer) {
-        const containerRect = this.$refs.previewContainer.getBoundingClientRect()
-        // 使用容器中心作为缩放中心点
-        const centerX = containerRect.width / 2
-        const centerY = containerRect.height / 2
-
-        // 计算中心点相对于图片原始坐标系的位置
-        const relativeX = (centerX - this.position.x) / this.scale
-        const relativeY = (centerY - this.position.y) / this.scale
-
-        // 更新位置以保持中心点不变
-        this.position.x = centerX - relativeX * newScale
-        this.position.y = centerY - relativeY * newScale
-      }
-      this.scale = newScale
-    },
-
-    // 重置图片位置和大小
-    resetImage() {
-      this.position = { x: 0, y: 0 }
-      this.scale = 1
-    },
-
-    // 重置所有状态
-    resetState() {
-      // 清理超时
-      if (this.loadingTimeout) {
-        clearTimeout(this.loadingTimeout)
-        this.loadingTimeout = null
-      }
-      this.position = { x: 0, y: 0 }
-      this.scale = 1
-      this.imageLoading = false
-      this.imageError = false
-      this.isDragging = false
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.file-preview {
-  display: inline-block;
-
-  .preview-link {
-    color: #409eff;
-    cursor: pointer;
-    text-decoration: none;
-    transition: color 0.2s;
-
-    &:hover {
-      color: #66b1ff;
-      text-decoration: underline;
-    }
-  }
-}
-
-.preview-wrapper {
-  width: 100%;
-  height: 750px;
-  background: #000;
-  position: relative;
-  overflow: hidden;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.preview-container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  overflow: hidden;
-  touch-action: none;
-  /* 防止移动端默认行为 */
-}
-
-.preview-image {
-  max-width: 100%;
-  max-height: 100%;
-  object-fit: contain;
-  /* 关键：保持比例并适应容器 */
-  transform-origin: 0 0;
-  /* 设置为左上角以匹配我们的数学计算 */
-  transition: transform 0.2s ease;
-  user-select: none;
-  -webkit-user-drag: none;
-
-  /* 平滑的拖拽和缩放效果 */
-  will-change: transform;
-}
-
-/* 操作工具栏 */
-.toolbar {
-  position: absolute;
-  bottom: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  display: flex;
-  gap: 10px;
-  background: rgba(0, 0, 0, 0.7);
-  padding: 10px;
-  border-radius: 4px;
-  z-index: 10;
-}
-
-.toolbar-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 5px;
-  background: rgba(255, 255, 255, 0.1);
-  border: 1px solid rgba(255, 255, 255, 0.2);
-  color: white;
-  padding: 8px 12px;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 12px;
-  transition: all 0.2s;
-
-  &:hover {
-    background: rgba(255, 255, 255, 0.2);
-    border-color: rgba(255, 255, 255, 0.3);
-  }
-
-  &:active {
-    transform: scale(0.95);
-  }
-
-  .icon {
-    font-size: 14px;
-    font-weight: bold;
-  }
-
-  .text {
-    white-space: nowrap;
-  }
-}
-</style>
-
-<style lang="scss">
-/* 对话框全局样式 */
-.image-preview-dialog {
-  .el-dialog {
-    background: #000;
-    border: 1px solid #333;
-  }
-
-  .el-dialog__header {
-    background: #000;
-    border-bottom: 1px solid #333;
-    padding: 10px 20px;
-
-    .el-dialog__title {
-      color: #fff;
-      font-size: 14px;
-    }
-
-    .el-dialog__close {
-      color: #fff;
-
-      &:hover {
-        color: #409eff;
-      }
-    }
-  }
-
-  .el-dialog__body {
-    padding: 0 !important;
-    background: #000 !important;
-    overflow: hidden !important;
-  }
-}
-</style>