fix: 配置模版产品交互弱化版本概念--bug=126815831 (#3344)

* fix: 配置元数据字段排序 * fix: 配置模版产品交互弱化版本概念
TencentBlueKing · Jul 8, 2024 · 090c7c1 · 090c7c1
1 parent d2ec8e1
commit 090c7c1
Show file tree

Hide file tree

Showing 14 changed files with 103 additions and 48 deletions.
diff --git a/bcs-services/bcs-bscp/ui/src/api/template.ts b/bcs-services/bcs-bscp/ui/src/api/template.ts
@@ -658,3 +658,24 @@ export const batchEditTemplatePermission = (biz_id: string, query: any) =>
  */
 export const getTemplateConfigMeta = (biz_id: string, template_id: number, revision_name?: string) =>
   http.get(`/config/biz/${biz_id}/templates/${template_id}/template_revisions`, { params: { revision_name } });
+
+/**
+ * 编辑模板配置文件
+ * @param biz_id 业务ID
+ * @param template_space_id 空间ID
+ * @param template_id 模板ID
+ * @param params 模板配置参数
+ * @returns
+ */
+export const updateTemplateConfig = (
+  biz_id: string,
+  template_space_id: number,
+  template_id: number,
+  params: ITemplateVersionEditingData,
+) =>
+  http
+    .put(
+      `/config/biz/${biz_id}/template_spaces/${template_space_id}/templates/${template_id}/template_revisions`,
+      params,
+    )
+    .then((res) => res.data);
diff --git a/bcs-services/bcs-bscp/ui/src/utils/config.ts b/bcs-services/bcs-bscp/ui/src/utils/config.ts
@@ -1,5 +1,4 @@
 import { CONFIG_FILE_TYPE } from '../constants/config';
-import dayjs from 'dayjs';
 
 // 查询配置文件类型名称
 export const getConfigTypeName = (type: string) => {
@@ -73,7 +72,6 @@ export function getConfigEditParams() {
     user: 'root',
     user_group: 'root',
     privilege: '644',
-    revision_name: `v${dayjs().format('YYYYMMDDHHmmss')}`,
   };
 }
 

diff --git a/bcs-services/bcs-bscp/ui/src/utils/index.ts b/bcs-services/bcs-bscp/ui/src/utils/index.ts
@@ -75,3 +75,14 @@ export const getTimeRange = (n: number) => {
   end.setSeconds(59);
   return [dayjs(start).format('YYYY-MM-DD HH:mm:ss'), dayjs(end).format('YYYY-MM-DD HH:mm:ss')];
 };
+
+export const sortObjectKeysByAscii = (obj: any) => {
+  // 获取对象的所有键，并按ASCII码排序
+  const sortedKeys = Object.keys(obj).sort((a, b) => a.localeCompare(b, 'en'));
+  const sortedObj: any = {};
+  sortedKeys.forEach((key) => {
+    sortedObj[key] = obj[key];
+  });
+
+  return sortedObj;
+};
diff --git a/...cp/ui/src/views/space/service/detail/config/config-list/config-table-list/config-form.vue b/...cp/ui/src/views/space/service/detail/config/config-list/config-table-list/config-form.vue
@@ -77,9 +77,6 @@
         <bk-input v-model="localVal.user_group" @input="change"></bk-input>
       </bk-form-item>
     </div>
-    <bk-form-item v-if="isTpl" class="fixed-width-form" property="revision_name" :label="t('form_版本号')" required>
-      <bk-input v-model="localVal.revision_name" :placeholder="t('请输入')"></bk-input>
-    </bk-form-item>
     <bk-form-item v-if="localVal.file_type === 'binary'" :label="t('配置内容')" :required="true">
       <bk-upload
         class="config-uploader"

diff --git a/...e/service/detail/config/config-list/config-table-list/create-config/import-file/index.vue b/...e/service/detail/config/config-list/config-table-list/create-config/import-file/index.vue
@@ -225,7 +225,7 @@
 
   const hasError = computed(() => {
     return importTemplateConfigList.value.some(
-      (config) => !config.template_space_exist || !config.template_set_exist || config.template_revisions.length === 0,
+      (config) => !config.template_space_exist || !config.template_set_exist || config.template_set_is_empty,
     );
   });
 

diff --git a/.../config/config-list/config-table-list/create-config/import-file/template-config-table.vue b/.../config/config-list/config-table-list/create-config/import-file/template-config-table.vue
@@ -21,11 +21,11 @@
         <bk-table-column :label="t('模板套餐')" prop="template_set_name">
           <template #default="{ row }">
             <div v-if="row.template_space_id" class="row-cell">
-              <span :class="{ error: !row.template_set_exist || row.template_revisions.length === 0 }">
+              <span :class="{ error: !row.template_set_exist || row.template_set_is_empty }">
                 {{ row.template_set_name }}
               </span>
               <Warn
-                v-if="row.template_space_exist && (!row.template_set_exist || row.template_revisions.length === 0)"
+                v-if="row.template_space_exist && (!row.template_set_exist || row.template_set_is_empty)"
                 class="warn-icon"
                 v-bk-tooltips="{ content: getErrorInfo(row) }" />
             </div>
@@ -74,7 +74,7 @@
   };
 
   const getRowCls = (data: ImportTemplateConfigItem) => {
-    if (!data.template_set_exist || !data.template_space_exist || data.template_revisions.length === 0) {
+    if (!data.template_set_exist || !data.template_space_exist || data.template_set_is_empty) {
       return 'row-error';
     }
   };
@@ -86,7 +86,7 @@
     if (!data.template_set_exist) {
       return t('模板套餐不存在，无法导入，请先删除此模板');
     }
-    if (data.template_revisions.length === 0) {
+    if (data.template_set_is_empty) {
       return t('模板套餐为空，无法导入，请先删除此模板');
     }
   };

diff --git a/...ui/src/views/space/service/detail/config/config-list/config-table-list/view-config-kv.vue b/...ui/src/views/space/service/detail/config/config-list/config-table-list/view-config-kv.vue
@@ -53,6 +53,7 @@
   import { IConfigKvType } from '../../../../../../../../types/config';
   import kvConfigContentEditor from '../../components/kv-config-content-editor.vue';
   import ConfigContentEditor from '../../components/config-content-editor.vue';
+  import { sortObjectKeysByAscii } from '../../../../../../../utils';
 
   const { t } = useI18n();
   const props = defineProps<{
@@ -73,7 +74,7 @@
     const { byte_size, signature } = content_spec;
     const { create_at, creator, reviser, update_at } = revision;
     const { key, kv_type } = spec;
-    return { key, kv_type, byte_size, signature, create_at, creator, reviser, update_at };
+    return sortObjectKeysByAscii({ key, kv_type, byte_size, signature, create_at, creator, reviser, update_at });
   });
 
   watch(

diff --git a/...cp/ui/src/views/space/service/detail/config/config-list/config-table-list/view-config.vue b/...cp/ui/src/views/space/service/detail/config/config-list/config-table-list/view-config.vue
@@ -79,7 +79,7 @@
     getTemplateVersionDetail,
     downloadTemplateContent,
   } from '../../../../../../../api/template';
-  import { byteUnitConverse, datetimeFormat } from '../../../../../../../utils/index';
+  import { byteUnitConverse, datetimeFormat, sortObjectKeysByAscii } from '../../../../../../../utils/index';
   import { fileDownload } from '../../../../../../../utils/file';
   import { IVariableEditParams } from '../../../../../../../../types/variable';
   import { IFileConfigContentSummary } from '../../../../../../../../types/config';
@@ -205,7 +205,7 @@
         const { create_at, creator, update_at, reviser } = res.config_item.revision;
         const { name, path, file_type, file_mode, permission } = res.config_item.spec;
         const { user, user_group, privilege } = permission;
-        configDetail.value = {
+        configDetail.value = sortObjectKeysByAscii({
           name,
           path,
           file_type,
@@ -223,14 +223,14 @@
           user,
           user_group,
           privilege,
-        };
+        });
       } else {
         const res = await getConfigItemDetail(props.bkBizId, props.id, props.appId);
         const { create_at, creator, update_at, reviser } = res.config_item.revision;
         const { name, memo, path, file_type, file_mode, permission } = res.config_item.spec;
         const { user, user_group, privilege } = permission;
         const { byte_size, signature, md5 } = res.content;
-        configDetail.value = {
+        configDetail.value = sortObjectKeysByAscii({
           name,
           path,
           file_type,
@@ -246,7 +246,7 @@
           user,
           user_group,
           privilege,
-        };
+        });
       }
       const signature = versionData.value.id
         ? (configDetail.value.origin_signature as string)
@@ -271,11 +271,13 @@
       let template_space_id;
       if (versionData.value.id) {
         const res = await getTemplateVersionDetail(props.bkBizId, props.appId, versionData.value.id, props.id);
-        configDetail.value = {
+        delete res.detail.update_at;
+        delete res.detail.reviser;
+        configDetail.value = sortObjectKeysByAscii({
           ...res.detail,
           create_at: datetimeFormat(res.detail.create_at),
           update_at: datetimeFormat(res.detail.update_at),
-        };
+        });
         template_space_id = res.detail.template_space_id;
       } else {
         let res;
@@ -285,11 +287,11 @@
         } else {
           res = await getTemplateConfigMeta(props.bkBizId, props.id, props.versionName);
         }
-        configDetail.value = {
+        configDetail.value = sortObjectKeysByAscii({
           ...props.templateMeta,
           ...res.data.detail,
           create_at: datetimeFormat(res.data.detail.create_at),
-        };
+        });
         template_space_id = props.templateMeta!.template_space_id;
       }
 

diff --git a/...p/ui/src/views/space/templates/list/package-detail/operations/edit-config/edit-config.vue b/...p/ui/src/views/space/templates/list/package-detail/operations/edit-config/edit-config.vue
@@ -34,7 +34,7 @@
   import useGlobalStore from '../../../../../../../store/global';
   import useTemplateStore from '../../../../../../../store/template';
   import {
-    createTemplateVersion,
+    updateTemplateConfig,
     getTemplateConfigMeta,
     downloadTemplateContent,
     updateTemplateContent,
@@ -53,9 +53,10 @@
     id: number;
     spaceId: string;
     show: Boolean;
+    memo: string;
   }>();
 
-  const emits = defineEmits(['update:show', 'added']);
+  const emits = defineEmits(['update:show', 'added', 'edited']);
 
   const configForm = ref<IConfigEditParams>(getConfigEditParams());
   const fileUploading = ref(false);
@@ -87,13 +88,12 @@
     try {
       configDetailLoading.value = true;
       const res = await getTemplateConfigMeta(props.spaceId, props.id);
-      const { name, template_revision_memo, path, file_type, user, user_group, privilege, signature, byte_size } =
-        res.data.detail;
+      const { name, path, file_type, user, user_group, privilege, signature, byte_size } = res.data.detail;
       configForm.value = {
         ...configForm.value,
         id: props.id,
         name,
-        memo: template_revision_memo,
+        memo: props.memo,
         file_type,
         path,
         user,
@@ -127,9 +127,8 @@
         size = new Blob([stringContent]).size;
         await updateTemplateContent(props.spaceId, currentTemplateSpace.value, stringContent, sign);
       }
-      const { memo, file_type, file_mode, user, user_group, privilege, revision_name } = configForm.value;
+      const { memo, file_type, file_mode, user, user_group, privilege } = configForm.value;
       const formData = {
-        revision_name,
         revision_memo: memo,
         file_type,
         file_mode,
@@ -139,7 +138,7 @@
         sign,
         byte_size: size,
       };
-      await createTemplateVersion(
+      await updateTemplateConfig(
         props.spaceId,
         currentTemplateSpace.value,
         props.id,
@@ -150,6 +149,7 @@
         message: t('编辑配置文件成功'),
       });
       close();
+      emits('edited');
     } catch (e) {
       console.log(e);
     } finally {

diff --git a/...p/ui/src/views/space/templates/list/package-detail/operations/view-config/view-config.vue b/...p/ui/src/views/space/templates/list/package-detail/operations/view-config/view-config.vue
@@ -13,7 +13,7 @@
           <bk-form label-width="100" form-type="vertical">
             <bk-form-item :label="t('配置文件绝对路径')">{{ fileAP() }}</bk-form-item>
             <bk-form-item :label="t('配置文件描述')">
-              <div class="memo">{{ configDetail.memo || configDetail.revision_memo || '--' }}</div>
+              <div class="memo">{{ props.memo ||  '--' }}</div>
             </bk-form-item>
             <bk-form-item :label="t('配置文件内容')">
               <bk-loading
@@ -68,7 +68,7 @@
   import { TextFill } from 'bkui-vue/lib/icon';
   import ConfigContentEditor from '../../../../../service/detail/config/components/config-content-editor.vue';
   import { getTemplateConfigMeta, downloadTemplateContent } from '../../../../../../../api/template';
-  import { byteUnitConverse, datetimeFormat } from '../../../../../../../utils/index';
+  import { byteUnitConverse, datetimeFormat, sortObjectKeysByAscii } from '../../../../../../../utils/index';
   import { fileDownload } from '../../../../../../../utils/file';
   import { IVariableEditParams } from '../../../../../../../../types/variable';
   import { IFileConfigContentSummary } from '../../../../../../../../types/config';
@@ -108,6 +108,7 @@
     id: number;
     spaceId: string;
     show: Boolean;
+    memo: string;
   }>();
 
   const emits = defineEmits(['update:show', 'openEdit']);
@@ -161,10 +162,10 @@
     try {
       detailLoading.value = true;
       const res = await getTemplateConfigMeta(props.spaceId, props.id);
-      configDetail.value = {
+      configDetail.value = sortObjectKeysByAscii({
         ...res.data.detail,
         create_at: datetimeFormat(res.data.detail.create_at),
-      };
+      });
       if (configDetail.value.file_type === 'binary') {
         content.value = {
           name: configDetail.value.name,

diff --git a/.../bcs-bscp/ui/src/views/space/templates/list/package-detail/tables/common-config-table.vue b/.../bcs-bscp/ui/src/views/space/templates/list/package-detail/tables/common-config-table.vue
@@ -31,7 +31,7 @@
         <bk-table-column type="selection" :min-width="40" :width="40"></bk-table-column>
         <bk-table-column :label="t('配置文件绝对路径')">
           <template #default="{ row }">
-            <div v-if="row.spec" v-overflow-title class="config-name" @click="handleViewConfig(row.id)">
+            <div v-if="row.spec" v-overflow-title class="config-name" @click="handleViewConfig(row)">
               {{ fileAP(row) }}
             </div>
           </template>
@@ -82,7 +82,7 @@
           <template #default="{ row, index }">
             <div class="actions-wrapper">
               <slot name="columnOperations" :config="row">
-                <bk-button theme="primary" text @click="handleEditConfig(row.id)">{{ t('编辑') }}</bk-button>
+                <bk-button theme="primary" text @click="handleEditConfig(row)">{{ t('编辑') }}</bk-button>
                 <bk-button theme="primary" text @click="goToVersionManage(row.id)">{{ t('版本管理') }}</bk-button>
                 <bk-popover
                   theme="light template-config-actions-popover"
@@ -139,9 +139,15 @@
     <ViewConfig
       v-model:show="isViewConfigShow"
       :space-id="spaceId"
-      :id="viewConfigId"
-      @open-edit="handleEditConfig(viewConfigId)" />
-    <EditConfig v-model:show="isEditConfigShow" :space-id="spaceId" :id="editConfigId" />
+      :id="viewConfig?.id as number"
+      :memo="selectConfigMemo"
+      @open-edit="handleEditConfig(viewConfig as ITemplateConfigItem)" />
+    <EditConfig
+      v-model:show="isEditConfigShow"
+      :memo="selectConfigMemo"
+      :space-id="spaceId"
+      :id="editConfigId"
+      @edited="refreshList"/>
   </div>
 </template>
 <script lang="ts" setup>
@@ -156,9 +162,9 @@
   import { ICommonQuery } from '../../../../../../../types/index';
   import useTablePagination from '../../../../../../utils/hooks/use-table-pagination';
   import {
-    ITemplateConfigItem,
     ITemplateCitedCountDetailItem,
     ITemplateCitedByPkgs,
+    ITemplateConfigItem,
   } from '../../../../../../../types/template';
   import { getPackagesByTemplateIds, getCountsByTemplateIds } from '../../../../../../api/template';
   import { datetimeFormat } from '../../../../../../utils/index';
@@ -210,9 +216,10 @@
   const crtConfig = ref<ITemplateConfigItem[]>([]);
   const isSearchEmpty = ref(false);
   const isViewConfigShow = ref(false);
-  const viewConfigId = ref(0);
+  const viewConfig = ref<ITemplateConfigItem>();
   const isEditConfigShow = ref(false);
   const editConfigId = ref(0);
+  const selectConfigMemo = ref('');
 
   watch(
     () => props.currentPkg,
@@ -389,15 +396,18 @@
     });
   };
 
-  const handleViewConfig = (id: number) => {
+  const handleViewConfig = (config: ITemplateConfigItem) => {
     isViewConfigShow.value = true;
-    viewConfigId.value = id;
+    viewConfig.value = config;
+    selectConfigMemo.value = config.spec.memo;
   };
 
-  const handleEditConfig = (id: number) => {
+  const handleEditConfig = (config: ITemplateConfigItem) => {
     isViewConfigShow.value = false;
     isEditConfigShow.value = true;
-    editConfigId.value = id;
+    console.log(config.id);
+    editConfigId.value = config.id;
+    selectConfigMemo.value = config.spec.memo;
   };
 
   // 设置新增行的标记class