style: 修改项目管理&组织管理模板工作流相关展示问题

frontend/src/views/case-management/caseManagementFeature/index.vue

@@ -162,17 +162,13 @@
   import ValidateModal from './components/export/validateModal.vue';
   import ValidateResult from './components/export/validateResult.vue';
 
-  import featureCase, {
-    createCaseModuleTree,
-    importExcelCase,
-    importExcelChecked,
-  } from '@/api/modules/case-management/featureCase';
+  import { createCaseModuleTree, importExcelCase, importExcelChecked } from '@/api/modules/case-management/featureCase';
   import { useI18n } from '@/hooks/useI18n';
   import useAppStore from '@/store/modules/app';
   import useFeatureCaseStore from '@/store/modules/case/featureCase';
   import { hasAllPermission, hasAnyPermission } from '@/utils/permission';
 
-  import type { CaseModuleQueryParams, CreateOrUpdateModule, ValidateInfo } from '@/models/caseManagement/featureCase';
+  import type { CreateOrUpdateModule, ValidateInfo } from '@/models/caseManagement/featureCase';
   import { TableQueryParams } from '@/models/common';
   import { CaseManagementRouteEnum } from '@/enums/routeEnum';
 

frontend/src/views/project-management/projectAndPermission/member/components/memberTable.vue

@@ -30,6 +30,7 @@
     <MsBaseTable
       v-bind="propsRes"
       :action-config="tableBatchActions"
+      :selectable="hasAnyPermission(['ORGANIZATION_MEMBER:READ+UPDATE'])"
       @selected-change="handleTableSelect"
       v-on="propsEvent"
       @batch-action="handleTableBatch"

frontend/src/views/setting/organization/template/components/addFieldToTemplateDrawer.vue

@@ -15,8 +15,7 @@
       <div class="inner-wrapper">
         <div class="optional-field">
           <div class="optional-header">
-            <div class="font-medium">{{ t('system.orgTemplate.optionalField') }}</div>
-            <a-checkbox :model-value="isCheckedAll" :indeterminate="indeterminate" @change="handleChangeAll">
+            <a-checkbox :model-value="isCheckedAll" :indeterminate="!indeterminate" @change="handleChangeAll">
               <span class="font-medium text-[var(--color-text-3)]">{{ t('system.orgTemplate.selectAll') }}</span>
             </a-checkbox>
           </div>
@@ -28,7 +27,7 @@
                   <div v-for="field in systemField" :key="field.id" class="item checkbox">
                     <a-checkbox :value="field.id" :disabled="field.internal && field.name == t('case.caseLevel')"
                       ><a-tooltip :content="field.name">
-                        <div>{{ field.name }}</div></a-tooltip
+                        <div class="one-line-text max-w-[100px]">{{ field.name }}</div></a-tooltip
                       ></a-checkbox
                     >
                   </div>
@@ -43,7 +42,7 @@
                 <div v-for="field in customField" :key="field.id" class="item">
                   <a-checkbox :value="field.id"
                     ><a-tooltip :content="field.name">
-                      <div class="checkbox">{{ field.name }}</div></a-tooltip
+                      <div class="one-line-text max-w-[100px]">{{ field.name }}</div></a-tooltip
                     ></a-checkbox
                   >
                 </div>
@@ -74,9 +73,13 @@
           <div class="selected-list p-4">
             <VueDraggable v-model="selectedList" ghost-class="ghost">
               <div v-for="element in selectedList" :key="element.dateIndex" class="selected-item">
-                <a-tooltip :content="element.name">
-                  <span> <MsIcon type="icon-icon_drag" class="mt-[3px] text-[16px] text-[var(--color-text-4)]" /></span>
-                  <span class="one-line-text ml-2 w-[270px]">{{ element.name }}</span>
+                <a-tooltip :content="element.name" position="left">
+                  <div class="flex flex-row flex-nowrap">
+                    <span>
+                      <MsIcon type="icon-icon_drag" class="mt-[3px] text-[16px] text-[var(--color-text-4)]"
+                    /></span>
+                    <span class="one-line-text ml-2 max-w-[180px]">{{ element.name }}</span>
+                  </div>
                 </a-tooltip>
                 <icon-close
                   v-if="!element.internal"
@@ -169,7 +172,7 @@
   });
   // 计算是否半选
   const indeterminate = computed(() => {
-    return selectSystemIds.value.length + selectCustomIds.value.length === selectCustomIds.value.length;
+    return isCheckSystemIdsAll.value && isCheckCustomIdsAll.value;
   });
 
   // 全选
@@ -265,6 +268,7 @@
       width: 100%;
       height: 100%;
       border: 1px solid var(--color-text-n8);
+      border-radius: 6px;
       // 可选字段
       .optional-field {
         flex-grow: 1;
@@ -302,12 +306,7 @@
   .checkboxContainer {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
-    grid-gap: 16px;
-    .checkbox {
-      width: 90px;
-      white-space: nowrap;
-      @apply overflow-hidden text-ellipsis;
-    }
+    grid-gap: 8px;
   }
   .ghost {
     border: 1px dashed rgba(var(--primary-5));

frontend/src/views/setting/organization/template/components/addTemplate.vue

@@ -742,7 +742,7 @@
           position: absolute;
           top: -12px;
           right: 16px;
-          z-index: 99999999 !important;
+          z-index: 9 !important;
           background: white;
           opacity: 0;
           @apply flex items-center justify-end;

frontend/src/views/setting/organization/template/components/caseTemplateLeftContent.vue

@@ -11,9 +11,7 @@
         v-model="viewForm.name"
         :max-length="255"
         :placeholder="t('system.orgTemplate.caseNamePlaceholder')"
-        show-word-limit
         allow-clear
-        :disabled="isDisabled"
       ></a-input>
     </a-form-item>
     <a-form-item field="precondition" :label="t('system.orgTemplate.precondition')" asterisk-position="end">

frontend/src/views/setting/organization/template/components/defectTemplateLeftContent.vue

@@ -9,10 +9,8 @@
     >
       <a-input
         v-model="viewForm.name"
-        :disabled="true"
         :max-length="255"
         :placeholder="t('system.orgTemplate.defectNamePlaceholder')"
-        show-word-limit
         allow-clear
       ></a-input>
     </a-form-item>

frontend/src/views/setting/organization/template/components/fieldSetting.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <a-alert
-      v-if="isShowTip"
+      v-if="isShowTip && hasAnyPermission([...props.createPermission, ...props.updatePermission])"
       class="mb-6"
       :type="isEnabledTemplate && props.mode === 'organization' ? 'warning' : 'info'"
     >

frontend/src/views/setting/organization/template/components/templateItem.vue

@@ -247,10 +247,11 @@
             cursor: pointer;
           }
           .enable {
+            height: 20px;
             font-size: 12px;
             color: var(--color-text-4);
             background: var(--color-text-n8);
-            line-height: 20px;
+            line-height: 14px;
             @apply ml-4 rounded p-1;
           }
           @apply flex flex-col justify-between;

frontend/src/views/setting/organization/template/components/workflowTable.vue

@@ -32,7 +32,6 @@
       :data="dataList"
       row-key="id"
       :bordered="{ cell: true }"
-      :hoverable="false"
       :pagination="false"
       :scroll="{ x: 'auto' }"
       :draggable="{ type: 'handle', width: 39 }"
@@ -53,31 +52,27 @@
               <MsTag class="relative" size="large" theme="light">{{ column.title }} </MsTag></div
             >
             <div v-else class="splitBox">
-              <div class="startStatus"> {{ t('system.orgTemplate.startState') }} </div>
+              <div class="startStatus font-normal"> {{ t('system.orgTemplate.startState') }} </div>
               <div class="line"></div>
-              <div class="endStatus"> {{ t('system.orgTemplate.flowState') }} </div>
+              <div class="endStatus font-normal"> {{ t('system.orgTemplate.flowState') }} </div>
             </div>
           </template>
           <template #cell="{ record }">
             <div v-if="column.dataIndex === 'statusName'">
               <div class="flex items-center justify-between">
                 <div class="relative">
-                  <MsTag class="relative" size="large" theme="light">{{ record.name }}</MsTag>
+                  <MsTag class="relative font-normal" size="large" theme="light">{{ record.name }}</MsTag>
                   <span v-if="record.statusDefinitions.join().includes('START')" class="absolute -top-6 left-7">
                     <svg-icon width="36px" height="36px" class="inline-block text-[white]" name="start"></svg-icon
                   ></span>
                 </div>
 
-                <div
-                  v-if="!isEnableProjectState"
-                  v-permission="props.updatePermission"
-                  class="action mr-2 flex h-8 w-8 items-center justify-center rounded opacity-0"
-                >
                 <MsTableMoreAction
+                  v-if="!isEnableProjectState"
+                  class="mr-2"
                   :list="getMoreActions(record)"
                   @select="(item) => handleMoreActionSelect(item, record)"
-                  ></MsTableMoreAction
-                ></div>
+                ></MsTableMoreAction>
               </div>
             </div>
             <div v-else class="!h-[82px] min-w-[116px] p-[2px]">
@@ -98,7 +93,7 @@
         </a-table-column>
         <a-table-column
           :title="t('system.orgTemplate.operation')"
-          :width="320"
+          :width="260"
           header-cell-class="splitOperation"
           fixed="right"
         >
@@ -252,6 +247,7 @@
         label: 'system.orgTemplate.setInitState',
         eventTag: 'setInit',
         disabled: record.statusDefinitions.join().includes('START'),
+        permission: props.updatePermission,
       },
       {
         isDivider: true,
@@ -260,6 +256,7 @@
         label: 'system.orgTemplate.delete',
         eventTag: 'delete',
         danger: true,
+        permission: props.updatePermission,
       },
     ];
     return moreActions;
@@ -390,6 +387,7 @@
     if (isChange) return false;
     try {
       await dragChangeRequest(scopedId.value, route.query.type, dataIds);
+      Message.success(t('common.updateSuccess'));
       getWorkFetchList();
     } catch (error) {
       console.log(error);
@@ -490,7 +488,7 @@
     }
   }
   :deep(.arco-table-drag-handle) {
-    border-right: 1px solid transparent !important;
+    border-right: none !important;
     .arco-icon-drag-dot-vertical {
       color: var(--color-text-brand);
     }
@@ -506,7 +504,7 @@
     }
   }
   :deep(.arco-table-operation) {
-    border-right: 1px solid transparent !important;
+    border-right: none;
   }
   .startStatus {
     position: absolute;
@@ -520,11 +518,11 @@
   }
   .line {
     position: absolute;
-    left: -35px;
-    width: 117%;
+    left: -45px;
+    width: 128%;
     height: 1px;
     background: var(--color-text-n8);
-    transform: rotateZ(18deg);
+    transform: rotateZ(19deg);
   }
   .label {
     margin-top: 16px;
@@ -544,4 +542,16 @@
     text-overflow: ellipsis;
     white-space: nowrap;
   }
+  :deep(.arco-table-border) {
+    border-right: none !important;
+    border-bottom: none !important;
+  }
+  :deep(.arco-table-tr):hover {
+    .arco-table-td:not(.arco-table-col-fixed-right) {
+      background: transparent !important;
+    }
+    .arco-table-td.arco-table-col-fixed-right::before {
+      background: transparent !important;
+    }
+  }
 </style>

frontend/src/views/setting/organization/template/locale/en-US.ts

@@ -137,7 +137,8 @@ export default {
   'system.orgTemplate.deleteFiledContentNotUsed': 'This field will be lost, please be careful!',
   'system.orgTemplate.deleteSuccess': 'Delete Successfully',
   'system.orgTemplate.setInitStateSuccess': 'Set the initial state successfully',
-  'system.orgTemplate.setEndStateSuccess': 'Setting the end status succeeded',
+  'system.orgTemplate.setEndStateSuccess':
+    'If the setting is successful, the end state takes effect immediately in the project',
   'system.orgTemplate.noAllowDeleteInitState': 'The initial status cannot be deleted',
   'system.orgTemplate.deleteStateStepTitle': 'Are you sure about the delete {name} step?',
   'system.orgTemplate.deleteStateStepContent':
@@ -212,4 +213,5 @@ export default {
   'system.orgTemplate.apiFieldNotEmpty': 'The field API cannot be empty',
   'system.orgTemplate.selectThirdPlatType': 'Please select the third party platform',
   'system.orgTemplate.orgNameTip': 'The organization name is incorrect',
+  'system.orgTemplate.notAllowEditView': 'The template is preview and cannot be edited',
 };

frontend/src/views/setting/organization/template/locale/zh-CN.ts

@@ -130,7 +130,7 @@ export default {
   'system.orgTemplate.deleteFiledContentNotUsed': '删除后，字段将从字段列表移除，请谨慎操作！',
   'system.orgTemplate.deleteSuccess': '删除成功',
   'system.orgTemplate.setInitStateSuccess': '设置初始态成功',
-  'system.orgTemplate.setEndStateSuccess': '设置结束状态成功',
+  'system.orgTemplate.setEndStateSuccess': '设置成功，结束状态在项目中立即生效',
   'system.orgTemplate.noAllowDeleteInitState': '初始状态不可删除',
   'system.orgTemplate.deleteStateStepTitle': '确定删除 {name} 步骤吗？',
   'system.orgTemplate.deleteStateStepContent': '删除后，会在项目中立即生效且删除不可撤回，请谨慎操作！',
@@ -201,4 +201,5 @@ export default {
   'system.orgTemplate.apiFieldNotEmpty': '字段 API 不能为空',
   'system.orgTemplate.selectThirdPlatType': '请选择三方平台',
   'system.orgTemplate.orgNameTip': '组织名称不正确',
+  'system.orgTemplate.notAllowEditView': '当前为模板预览,不可编辑',
 };