@jari-ace/element-plus-component 0.5.6 → 0.5.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@jari-ace/element-plus-component",
   "private": false,
-  "version": "0.5.6",
+  "version": "0.5.7",
   "main": "lib/index.umd.cjs",
   "module": "lib/index.js",
   "types": "dist/index.d.ts",

package/packages/components/flowShell/FlowFormShell.vue

@@ -368,7 +368,7 @@ const handleForward = async () => {
   width: 100%;
   height: 100%;
   background-color: #f5f7fa;
-  z-index: 2000;
+  z-index: 300;
   display: flex;
   flex-direction: column;
 }

package/packages/components/upload/JaUploader.vue

@@ -5,7 +5,7 @@ import {getValue, setValue} from "../../utils/objectUtils";
 import Uploader from "./uploader.vue";
 
 export interface JaUploaderProps {
-    /**
+/**
      * 应用名
      */
     serviceName: string,
@@ -18,7 +18,7 @@ export interface JaUploaderProps {
      */
     attachToken?: string,
     /**
-     * 数据密级
+     * 数据密集
      */
     classificationLevel?: number,
     /**
@@ -28,7 +28,31 @@ export interface JaUploaderProps {
     /**
      * 文件列表最大高度
      */
-    maxHeight?: string | number
+    maxHeight?: string | number,
+    /**
+     * 是否允许上传, 为空表示采用应用里的附件设置
+     */
+    allowUpload?: boolean,
+    /**
+     * 是否允许下载，为空表示采用应用里的附件设置
+     */
+    allowDownload?: boolean,
+    /**
+     * 是否允许删除，为空表示采用应用里的附件设置
+     */
+    allowDelete?: boolean,
+    /**
+     * 是否允许预览，为空表示采用应用里的附件设置
+     */
+    allowPreview?: boolean,
+    /**
+     * 布局方式: list-列表布局(默认), inline-行内布局
+     */
+    layout?: 'list' | 'inline',
+    /**
+     * 是否隐藏下载所有按钮
+     */
+    hideDownloadAll?: boolean
 }
 
 const props = defineProps<JaUploaderProps>();
@@ -61,8 +85,18 @@ defineExpose({
 </script>
 
 <template>
-<uploader :service-name="serviceName" :max-height="maxHeight" :height="height" :config-key="configKey"
-          :attach-token="attachToken" :classification-level="classificationLevel"
+<uploader :service-name="serviceName"
+          :max-height="maxHeight" 
+          :height="height" 
+          :config-key="configKey"
+          :attach-token="attachToken" 
+          :classification-level="classificationLevel"
+          :allow-delete="allowDelete"
+          :allow-download="allowDownload"
+          :allow-preview="allowPreview"
+          :layout="layout"
+          :hide-download-all="hideDownloadAll"
+          :allow-upload="allowUpload"
           v-model="mv"
           @change="onChange"></uploader>
 </template>

package/packages/components/upload/uploader.vue

@@ -92,9 +92,18 @@ const props = withDefaults(defineProps<{
     /**
      * 布局方式: list-列表布局(默认), inline-行内布局
      */
-    layout?: 'list' | 'inline'
+    layout?: 'list' | 'inline',
+    /**
+     * 是否隐藏下载所有按钮
+     */
+    hideDownloadAll?: boolean
 }>(), {
-    layout: 'list'
+    layout: 'list',
+    allowUpload: undefined,
+    allowDownload: undefined,
+    allowDelete: undefined,
+    allowPreview: undefined,
+    hideDownloadAll: false
 });
 const attachId = defineModel<string>({
     required: false
@@ -178,15 +187,6 @@ const emits = defineEmits<{
 let uppy: Uppy | undefined;
 curAttachToken.value = props.attachToken;
 
-onMounted(async () => {
-    await updateAllowedClassificationLevels();
-    if (props.attachToken) {
-        await initLoad();
-    } else {
-        await initNew();
-    }
-});
-
 onUnmounted(() => {
     if (uppy) uppy.destroy();
     uppy = undefined;
@@ -198,7 +198,7 @@ async function updateAllowedClassificationLevels() {
     classificationLevels.value = await useSystemClassificationLevels();
     classificationLevelMap.value = await useSystemClassificationLevelMap();
     allowedClassificationLevels.value = classificationLevels.value.filter(l => l.value >= cl);
-    highestClassificationLevel.value = Math.min(...allowedClassificationLevels.value.map(l=>l.value))
+    highestClassificationLevel.value = Math.min(...allowedClassificationLevels.value.map(l => l.value))
     console.log(`附件控件密级调试:
     表单密级:`, props.classificationLevel, `
     用户密级:`, user.value?.classifiedLevel, `
@@ -326,6 +326,7 @@ function createUppyInstance() {
 }
 
 async function onUploadBtnClick() {
+    console.log('upload btn clicked')
     const cfg = uploadInitParams.value?.fileConfig;
     if (cfg) {
         uppy?.setMeta({
@@ -514,9 +515,13 @@ watch(() => props.attachToken, () => {
     } else {
         initNew();
     }
+}, {
+    immediate: true
 });
 
-watch(()=> props.classificationLevel,  updateAllowedClassificationLevels)
+watch(() => props.classificationLevel, updateAllowedClassificationLevels, {
+    immediate: true
+})
 
 function getFileIcon(fileName: string) {
     if (!fileName) return Document;
@@ -557,7 +562,7 @@ function getFileIcon(fileName: string) {
                 :disabled="loading" size="small" v-if="allowedClassificationLevels.length <= 1 && checkAllowUpload()">
                 上传{{ uploadInitParams?.fileConfig.enableClassifiedLevel ? "(非密)" : "" }}
             </el-button>
-            <el-button plain :icon="Download" @click="downloadAll" v-if="checkAllowDownload()" :loading="loading"
+            <el-button plain :icon="Download" @click="downloadAll" v-if="checkAllowDownload() && !hideDownloadAll" :loading="loading"
                 :disabled="loading || files?.length === 0" size="small">
                 全部下载
             </el-button>
@@ -582,13 +587,15 @@ function getFileIcon(fileName: string) {
                     <span class="loader-shimmer">正在上传，已完成{{ uploadingProgress }}%...</span>
                 </p>
             </div>
-            
+
             <div v-if="layout === 'inline'" class="inline-files">
-                 <div v-for="file in files" :key="file.id" class="inline-file-item">
+                <div v-for="file in files" :key="file.id" class="inline-file-item">
                     <el-popover placement="top" :width="300" trigger="hover">
                         <template #reference>
                             <div class="inline-file-icon-wrapper">
-                                <el-icon class="file-icon" size="20"><component :is="getFileIcon(file.fileName)" /></el-icon>
+                                <el-icon class="file-icon" size="20">
+                                    <component :is="getFileIcon(file.fileName)" />
+                                </el-icon>
                             </div>
                         </template>
                         <div class="file-popover-content">
@@ -596,38 +603,43 @@ function getFileIcon(fileName: string) {
                                 <span class="label">文件名：</span>
                                 <span class="value">{{ file.fileName }}</span>
                             </div>
-                             <div class="popover-row">
+                            <div class="popover-row">
                                 <span class="label">大小：</span>
                                 <span class="value">{{ prettyBytes(file.fileSize) }}</span>
                             </div>
-                             <div class="popover-row">
+                            <div class="popover-row">
                                 <span class="label">密级：</span>
                                 <span class="value">
-                                     <el-tag size="small"
+                                    <el-tag size="small"
                                         :type="file.classifiedLevel < 50 ? (file.classifiedLevel < 30 ? 'danger' : 'warning') : 'info'">
                                         {{ classificationLevelMap?.get(file.classifiedLevel) }}
                                     </el-tag>
                                 </span>
                             </div>
                             <div class="popover-actions">
-                                 <el-button link type="primary" @click="previewFile(file.token)"
+                                <el-button link type="primary" @click="previewFile(file.token)"
                                     v-if="checkAllowPreview(file)">预览
                                 </el-button>
-                                <el-button link type="primary" @click="downloadFile(file.token)" v-if="checkAllowDownload()">下载
+                                <el-button link type="primary" @click="downloadFile(file.token)"
+                                    v-if="checkAllowDownload()">下载
                                 </el-button>
-                                <el-button link type="danger" @click="delUploadedFile(file)" v-if="checkAllowDelete()">删除
+                                <el-button link type="danger" @click="delUploadedFile(file)"
+                                    v-if="checkAllowDelete()">删除
                                 </el-button>
                             </div>
                         </div>
                     </el-popover>
-                 </div>
+                </div>
             </div>
         </div>
-        <div v-if="layout === 'list'" class="file-list" :style="{ height: typeof props.height === 'number' ? props.height + 'px' : props.height, maxHeight: typeof props.maxHeight === 'number' ? props.maxHeight + 'px' : props.maxHeight }">
-            <div v-if="files.length === 0" class="empty-text">暂无文件</div>
+        <div v-if="layout === 'list'" class="file-list"
+            :style="{ height: typeof props.height === 'number' ? props.height + 'px' : props.height, maxHeight: typeof props.maxHeight === 'number' ? props.maxHeight + 'px' : props.maxHeight }">
+            <div v-if="files?.length === 0" class="empty-text">暂无文件</div>
             <div v-for="file in files" :key="file.id" class="file-item">
                 <div class="file-main">
-                    <el-icon class="file-icon"><component :is="getFileIcon(file.fileName)" /></el-icon>
+                    <el-icon class="file-icon">
+                        <component :is="getFileIcon(file.fileName)" />
+                    </el-icon>
                     <span class="file-name" :title="file.fileName">{{ file.fileName }}</span>
                 </div>
                 <div class="file-info-right">
@@ -637,9 +649,10 @@ function getFileIcon(fileName: string) {
                             :type="file.classifiedLevel < 50 ? (file.classifiedLevel < 30 ? 'danger' : 'warning') : 'info'">
                             {{ classificationLevelMap?.get(file.classifiedLevel) }}
                         </el-tag>
-                        <el-tooltip v-if="file.classifiedLevel < highestClassificationLevel" content="文件密级已高于当前许可范围，请立即删除">
+                        <el-tooltip v-if="file.classifiedLevel < highestClassificationLevel"
+                            content="文件密级已高于当前许可范围，请立即删除">
                             <el-icon color="#F56C6C" class="warning-icon">
-                                <warning-filled/>
+                                <warning-filled />
                             </el-icon>
                         </el-tooltip>
                     </div>
@@ -687,7 +700,7 @@ function getFileIcon(fileName: string) {
         flex-wrap: wrap;
         gap: 8px;
         margin-left: 8px;
-        
+
         .inline-file-item {
             .inline-file-icon-wrapper {
                 cursor: pointer;
@@ -697,7 +710,7 @@ function getFileIcon(fileName: string) {
                 padding: 4px;
                 border-radius: 4px;
                 color: var(--el-text-color-regular);
-                
+
                 &:hover {
                     background-color: var(--el-fill-color-light);
                     color: var(--el-color-primary);
@@ -763,23 +776,23 @@ function getFileIcon(fileName: string) {
     flex-direction: column;
     gap: 8px;
     font-size: 14px;
-    
+
     .popover-row {
         display: flex;
         align-items: flex-start;
-        
+
         .label {
             color: var(--el-text-color-secondary);
             width: 60px;
             flex-shrink: 0;
         }
-        
+
         .value {
             color: var(--el-text-color-primary);
             word-break: break-all;
         }
     }
-    
+
     .popover-actions {
         display: flex;
         justify-content: flex-end;
@@ -794,7 +807,7 @@ function getFileIcon(fileName: string) {
     overflow-y: auto;
     border: 1px solid var(--el-border-color-lighter);
     border-radius: 4px;
-    
+
     .empty-text {
         text-align: center;
         padding: 20px;
@@ -854,7 +867,7 @@ function getFileIcon(fileName: string) {
                 display: flex;
                 align-items: center;
                 gap: 4px;
-                
+
                 .warning-icon {
                     margin-left: 4px;
                     cursor: help;
@@ -864,7 +877,7 @@ function getFileIcon(fileName: string) {
             .file-actions {
                 display: flex;
                 gap: 8px;
-                
+
                 .el-button {
                     padding: 0;
                     height: auto;