From 5d12fd2f6b88854f4603c6424b3cf400fe330a15 Mon Sep 17 00:00:00 2001
From: lannoy0523 <46735290+lannoy0523@users.noreply.github.com>
Date: Thu, 11 Jan 2024 14:36:09 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=96=B0=E5=A2=9E=E4=BB=93=E5=BA=93?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE----=E6=B8=85=E7=90=86=E8=AE=BE=E7=BD=AE=20#1?=
 =?UTF-8?q?448=20(#1477)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat:新增仓库配置----清理设置 #1448

* feat:新增仓库配置----清理设置 #1448

* feat:新增仓库配置----清理设置 #1448

* feat:新增仓库配置----清理设置 #1448

* feat:新增仓库配置----清理设置 #1448
---
 .../cleanConfig/genericCleanRule.vue          |  93 +-------
 .../views/repoConfig/cleanConfig/index.vue    | 206 ++++++++++--------
 .../src/views/repoConfig/index.vue            |  12 +-
 .../src/views/repoList/index.vue              |   2 +-
 src/frontend/locale/repository/en-US.json     |  15 +-
 src/frontend/locale/repository/zh-CN.json     |  13 +-
 6 files changed, 153 insertions(+), 188 deletions(-)

diff --git a/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/genericCleanRule.vue b/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/genericCleanRule.vue
index ced8395229..143593d689 100644
--- a/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/genericCleanRule.vue
+++ b/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/genericCleanRule.vue
@@ -1,97 +1,32 @@
 <template>
-    <div class="rule-item flex-align-center" :data-suffix="$t('shortOr')">
+    <div class="rule-item flex-align-center" :data-suffix="$t('and')">
         <bk-input
-            style="width:180px;"
-            :value="path.value"
+            style="width:230px;"
+            :value="path"
             @input="path => change({ path })"
             :disabled="disabled"
-            :placeholder="$t('inputFilePathTip')">
+            :placeholder="type === 'generic' ? $t('inputFilePathTip') : $t('cleanPackageRuleTip')">
         </bk-input>
-        <bk-select
-            style="width:100px;"
-            v-model="type"
-            :clearable="false"
-            :disabled="disabled">
-            <bk-option id="name" :name="$t('fileName')"></bk-option>
-            <bk-option id="metadata" :name="$t('metadata')"></bk-option>
-            <bk-option id="all" :name="$t('total')"></bk-option>
-        </bk-select>
-        <bk-input
-            v-show="type === 'metadata'"
-            style="width:180px;"
-            :value="defaultValue.field.replace(/^metadata\.(.*)$/, '$1')"
-            @input="field => change({ field: `metadata.${field}` })"
-            :disabled="disabled"
-            :placeholder="$t('key')">
-        </bk-input>
-        <select-input
-            v-show="type !== 'all'"
-            :select="defaultValue.operation"
-            :select-list="typeList"
-            :input="defaultValue.value"
-            :disabled="disabled"
-            @change="r => change(r)">
-        </select-input>
         <Icon v-show="!disabled" class="ml10 hover-btn" size="24" name="icon-delete" @click.native="$emit('delete')" />
     </div>
 </template>
 <script>
-    import SelectInput from '@repository/components/SelectInput'
     export default {
         name: 'metadataRule',
-        components: { SelectInput },
         props: {
             disabled: Boolean,
             path: {
-                type: Object,
-                default: () => ({
-                    field: 'path',
-                    operation: 'REGEX',
-                    value: ''
-                })
-            }
-        },
-        data () {
-            return {
-                defaultValue: {
-                    field: '',
-                    operation: 'EQ',
-                    value: ''
-                },
-                typeList: [
-                    { id: 'EQ', name: this.$t('equal') },
-                    { id: 'MATCH', name: this.$t('contain') },
-                    { id: 'REGEX', name: this.$t('regular') }
-                ]
-            }
-        },
-        computed: {
+                type: String,
+                default: ''
+            },
             type: {
-                get () {
-                    if (this.defaultValue.field === 'name') return 'name'
-                    if (this.defaultValue.field) return 'metadata'
-                    return 'all'
-                },
-                set (val) {
-                    const oldValue = this.defaultValue.field
-                    // 被动改变
-                    if (val === oldValue) return
-                    // 用户输入
-                    let field = ''
-                    if (val === 'name') field = 'name'
-                    if (val === 'metadata') field = 'metadata.'
-                    this.change({ field, input: '' })
-                }
+                type: String,
+                default: 'generic'
             }
         },
         watch: {
             $attrs: {
                 handler (val) {
-                    this.defaultValue = {
-                        field: '',
-                        operation: 'EQ',
-                        value: ''
-                    }
                     const meta = Object.values(val).find(meta => meta.field)
                     // 触发type改变导致input回置
                     meta && (this.defaultValue = { ...meta })
@@ -102,15 +37,9 @@
         },
         methods: {
             change ({
-                path = this.path.value,
-                field = this.defaultValue.field,
-                select: operation = this.defaultValue.operation,
-                input: value = this.defaultValue.value
+                path = this.path
             }) {
-                const data = {
-                    path: { field: 'path', operation: 'REGEX', value: path }
-                }
-                field && (data[field] = { field, operation, value })
+                const data = { path }
                 this.$emit('change', data)
             }
         }
diff --git a/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/index.vue b/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/index.vue
index 4a01e8e224..722451111d 100644
--- a/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/index.vue
+++ b/src/frontend/devops-repository/src/views/repoConfig/cleanConfig/index.vue
@@ -1,30 +1,43 @@
 <template>
-    <bk-form class="clean-config-container" :label-width="120" :model="config" :rules="rules" ref="cleanForm">
+    <bk-form class="clean-config-container" :label-width="120" :model="cleanupStrategy" :rules="rules" ref="cleanForm">
         <bk-form-item :label="$t('autoCleanup')">
-            <bk-switcher v-model="config.autoClean" size="small" theme="primary" @change="clearError"></bk-switcher>
+            <bk-switcher v-model="cleanupStrategy.enable" size="small" theme="primary" @change="clearError"></bk-switcher>
         </bk-form-item>
-        <bk-form-item v-if="repoType !== 'generic'" :label="$t('minimumVersion')" required property="reserveVersions" error-display-type="normal">
-            <bk-input class="w250" v-model="config.reserveVersions" :disabled="!config.autoClean"></bk-input>
-            <div class="form-tip">{{'cleanTip'}}</div>
+        <bk-form-item :label="$t('cleanupStrategy')" required>
+            <bk-select
+                style="width:150px;"
+                v-model="cleanupStrategy.cleanupType"
+                @change="changeType"
+                :clearable="false"
+                :disabled="!cleanupStrategy.enable">
+                <bk-option id="retentionDays" :name="$t('retentionDays')"></bk-option>
+                <bk-option id="retentionDate" :name="$t('retentionDate')"></bk-option>
+                <bk-option v-if="repoType !== 'generic'" id="retentionNums" :name="$t('retentionNums')"></bk-option>
+            </bk-select>
         </bk-form-item>
-        <bk-form-item :label="$t('minRetentionTime')" required property="reserveDays" error-display-type="normal">
-            <bk-input class="w250" v-model="config.reserveDays" :disabled="!config.autoClean"></bk-input>
+        <bk-form-item :label="$t('retentionDays')" property="cleanupValue" required error-display-type="normal" v-if="cleanupStrategy.cleanupType === 'retentionDays'">
+            <bk-input class="w250" v-model="cleanupStrategy.cleanupValue" :disabled="!cleanupStrategy.enable"></bk-input>
         </bk-form-item>
-        <bk-form-item :label="$t('retentionRules')">
-            <bk-button :disabled="!config.autoClean" icon="plus" @click="addRule()">{{$t('addRules')}}</bk-button>
-            <div class="form-tip">
-                {{ repoType === 'generic' ? $t('genericTip') : $t('notGenericTip') }}
-            </div>
+        <bk-form-item :label="$t('retentionDate')" property="cleanupValue" required error-display-type="normal" v-if="cleanupStrategy.cleanupType === 'retentionDate'">
+            <bk-date-picker v-model="cleanupStrategy.cleanupValue" :placeholder="$t('chooseDateTip')" :clearable="false" :type="'datetime'" :disabled="!cleanupStrategy.enable"></bk-date-picker>
+        </bk-form-item>
+        <bk-form-item :label="$t('retentionNums')" property="cleanupValue" required error-display-type="normal" v-if="cleanupStrategy.cleanupType === 'retentionNums'">
+            <bk-input class="w250" v-model="cleanupStrategy.cleanupValue" :disabled="!cleanupStrategy.enable"></bk-input>
+        </bk-form-item>
+        <bk-form-item :label="$t('cleanTarget')">
+            <bk-button :disabled="!cleanupStrategy.enable" icon="plus" @click="addRule()">{{$t('addTarget')}}</bk-button>
             <div class="rule-list">
                 <component
-                    :is="repoType === 'generic' ? 'generic-clean-rule' : 'package-clean-rule'"
+                    :is="'generic-clean-rule'"
                     class="mt10"
-                    v-for="(rule, ind) in config.rules"
+                    v-for="(rule, ind) in cleanupStrategy.cleanTargets"
                     :key="ind"
-                    :disabled="!config.autoClean"
+                    :disabled="!cleanupStrategy.enable"
                     v-bind="rule"
-                    @change="r => config.rules.splice(ind, 1, r)"
-                    @delete="config.rules.splice(ind, 1)">
+                    :path.sync="rule"
+                    :type.sync="repoType"
+                    @change="changeTarget($event, ind)"
+                    @delete="deleteTarget(ind)">
                 </component>
             </div>
         </bk-form-item>
@@ -34,13 +47,12 @@
     </bk-form>
 </template>
 <script>
-    import packageCleanRule from './packageCleanRule'
     import genericCleanRule from './genericCleanRule.vue'
     import { mapActions } from 'vuex'
+    import moment from 'moment'
     export default {
         name: 'cleanConfig',
         components: {
-            packageCleanRule,
             genericCleanRule
         },
         props: {
@@ -49,24 +61,22 @@
         data () {
             return {
                 loading: false,
-                config: {
-                    autoClean: false,
-                    reserveVersions: 20,
-                    reserveDays: 30,
-                    rules: []
+                cleanupStrategy: {
+                    enable: false,
+                    cleanupValue: '',
+                    cleanTargets: [],
+                    cleanupType: 'retentionDays'
                 },
                 rules: {
-                    reserveVersions: [
+                    cleanupValue: [
                         {
-                            regex: /^[0-9]+$/,
-                            message: this.$t('nonNegativeIntegerTip'),
+                            validator: this.asynCheckCleanValue,
+                            message: this.$t('cleanConfigTip'),
                             trigger: 'blur'
-                        }
-                    ],
-                    reserveDays: [
+                        },
                         {
-                            regex: /^[0-9]+$/,
-                            message: this.$t('nonNegativeIntegerTip'),
+                            required: true,
+                            message: this.$t('cleanConfigTip'),
                             trigger: 'blur'
                         }
                     ]
@@ -87,24 +97,8 @@
         watch: {
             baseData: {
                 handler (val) {
-                    if (!val.configuration.cleanStrategy) return
-                    const {
-                        autoClean = false,
-                        reserveVersions = 20,
-                        reserveDays = 30,
-                        rule = { rules: [] }
-                    } = val.configuration.cleanStrategy
-                    this.config = { ...this.config, autoClean, reserveVersions, reserveDays }
-                    const rules = rule.rules.find(r => r.rules)?.rules || []
-                    this.config.rules = rules.map(r => {
-                        return r.rules?.reduce((target, item) => {
-                            target[item.field] = {
-                                ...item,
-                                value: item.operation === 'MATCH' ? item.value.replace(/^\*(.*)\*$/, '$1') : item.value
-                            }
-                            return target
-                        }, {})
-                    })
+                    if (!val.cleanupStrategy) return
+                    this.cleanupStrategy = val.cleanupStrategy
                 },
                 deep: true,
                 immediate: true
@@ -113,75 +107,95 @@
         methods: {
             ...mapActions(['updateRepoInfo']),
             addRule () {
-                if (!this.config.autoClean) return
-                this.config.rules.push({})
+                if (!this.cleanupStrategy.enable) return
+                if (!this.cleanupStrategy.cleanTargets) {
+                    const cleanStrategy = {
+                        enable: this.cleanupStrategy.enable,
+                        cleanupType: this.cleanupStrategy.cleanupType,
+                        cleanupValue: this.cleanupStrategy.cleanupValue,
+                        cleanTargets: []
+                    }
+                    this.cleanupStrategy = cleanStrategy
+                }
+                this.cleanupStrategy.cleanTargets.push('')
             },
             clearError () {
                 this.$refs.cleanForm.clearError()
             },
             async save () {
-                await this.$refs.cleanForm.validate()
-                const { autoClean, reserveVersions, reserveDays } = this.config
-                let rules = this.config.rules
-                rules = rules.map(rs => {
-                    return {
-                        relation: 'AND',
-                        rules: Object.values(rs).map(i => {
-                            return i.field.replace(/^metadata\./, '') && i.value && {
-                                ...i,
-                                value: i.operation === 'MATCH' ? `*${i.value}*` : i.value
+                let cleanStrategy
+                if (!this.cleanupStrategy.enable) {
+                    cleanStrategy = {
+                        enable: this.cleanupStrategy.enable
+                    }
+                } else {
+                    await this.$refs.cleanForm.validate()
+                    let cleanValue = ''
+                    if (this.cleanupStrategy.cleanupType === 'retentionDate' && this.cleanupStrategy.cleanupValue instanceof Date) {
+                        cleanValue = moment(this.cleanupStrategy.cleanupValue).add(8, 'hours').toISOString()
+                    } else {
+                        cleanValue = this.cleanupStrategy.cleanupValue
+                    }
+                    if (this.cleanupStrategy.cleanTargets) {
+                        const target = this.cleanupStrategy.cleanTargets.filter(function (item, index, array) {
+                            if (item.trim().length !== 0 && item !== null) {
+                                return array.indexOf(item) === index
+                            } else {
+                                return false
                             }
-                        }).filter(Boolean)
+                        })
+                        cleanStrategy = {
+                            enable: this.cleanupStrategy.enable,
+                            cleanupType: this.cleanupStrategy.cleanupType,
+                            cleanupValue: cleanValue,
+                            cleanTargets: target
+                        }
+                    } else {
+                        cleanStrategy = {
+                            enable: this.cleanupStrategy.enable,
+                            cleanupType: this.cleanupStrategy.cleanupType,
+                            cleanupValue: cleanValue
+                        }
                     }
-                }).filter(rs => rs.rules.length)
+                }
+                this.baseData.configuration.settings.cleanupStrategy = cleanStrategy
                 this.loading = true
                 this.updateRepoInfo({
                     projectId: this.projectId,
                     name: this.repoName,
                     body: {
                         configuration: {
-                            ...this.baseData.configuration,
-                            cleanStrategy: {
-                                autoClean,
-                                ...(this.repoType === 'generic' ? {} : { reserveVersions }),
-                                reserveDays,
-                                rule: {
-                                    relation: 'AND',
-                                    rules: rules.length
-                                        ? [
-                                            this.repoType === 'generic'
-                                                ? {
-                                                    field: 'projectId',
-                                                    value: this.projectId,
-                                                    operation: 'EQ'
-                                                }
-                                                : undefined,
-                                            this.repoType === 'generic'
-                                                ? {
-                                                    field: 'repoName',
-                                                    value: this.repoName,
-                                                    operation: 'EQ'
-                                                }
-                                                : undefined,
-                                            {
-                                                relation: 'OR',
-                                                rules
-                                            }
-                                        ].filter(Boolean)
-                                        : []
-                                }
-                            }
+                            ...this.baseData.configuration
                         }
                     }
                 }).then(() => {
                     this.$emit('refresh')
                     this.$bkMessage({
                         theme: 'success',
-                        message: this.$t('save') + this.$t('success')
+                        message: this.$t('save') + this.$t('space') + this.$t('success')
                     })
                 }).finally(() => {
                     this.loading = false
                 })
+            },
+            asynCheckCleanValue () {
+                if (this.cleanupStrategy.cleanupType === 'retentionDate') {
+                    return this.cleanupStrategy.cleanupValue instanceof Date || moment(this.cleanupStrategy.cleanupValue).isValid()
+                } else {
+                    return (/^[0-9]+$/).test(this.cleanupStrategy.cleanupValue)
+                }
+            },
+            changeType () {
+                if (this.cleanupStrategy.cleanupType !== 'retentionDate' && this.cleanupStrategy.cleanupValue instanceof Date) {
+                    this.cleanupStrategy.cleanupValue = ''
+                }
+                this.clearError()
+            },
+            deleteTarget (index) {
+                this.cleanupStrategy.cleanTargets.splice(index, 1)
+            },
+            changeTarget (r, ind) {
+                this.cleanupStrategy.cleanTargets.splice(ind, 1, r.path)
             }
         }
     }
diff --git a/src/frontend/devops-repository/src/views/repoConfig/index.vue b/src/frontend/devops-repository/src/views/repoConfig/index.vue
index 1e44c30df9..e30b7437a7 100644
--- a/src/frontend/devops-repository/src/views/repoConfig/index.vue
+++ b/src/frontend/devops-repository/src/views/repoConfig/index.vue
@@ -107,9 +107,9 @@
             <bk-tab-panel render-directive="if" v-if="showProxyConfigTab" name="proxyConfig" :label="$t('proxyConfig')">
                 <proxy-config :base-data="repoBaseInfo" @refresh="getRepoInfoHandler"></proxy-config>
             </bk-tab-panel>
-            <!-- <bk-tab-panel v-if="showCleanConfigTab" name="cleanConfig" label="清理设置">
+            <bk-tab-panel v-if="showCleanConfigTab" name="cleanConfig" :label="$t('cleanConfig')">
                 <clean-config :base-data="repoBaseInfo" @refresh="getRepoInfoHandler"></clean-config>
-            </bk-tab-panel> -->
+            </bk-tab-panel>
             <bk-tab-panel render-directive="if" v-if="showPermissionConfigTab" name="permissionConfig" :label="$t('permissionConfig')">
                 <permission-config :base-data="repoBaseInfo" @refresh="getRepoInfoHandler"></permission-config>
             </bk-tab-panel>
@@ -121,8 +121,8 @@
     import CardRadioGroup from '@repository/components/CardRadioGroup'
     import proxyConfig from '@repository/views/repoConfig/proxyConfig'
     import iamDenyDialog from '@repository/components/IamDenyDialog/IamDenyDialog'
-    // import cleanConfig from '@repository/views/repoConfig/cleanConfig'
     import permissionConfig from './permissionConfig/permissionConfig'
+    import cleanConfig from '@repository/views/repoConfig/cleanConfig'
     import { mapState, mapActions } from 'vuex'
     import { specialRepoEnum } from '@repository/store/publicEnum'
     export default {
@@ -131,8 +131,8 @@
             CardRadioGroup,
             proxyConfig,
             iamDenyDialog,
-            permissionConfig
-            // cleanConfig
+            permissionConfig,
+            cleanConfig
         },
         data () {
             const filenameRule = [
@@ -232,7 +232,7 @@
                 return ['maven', 'pypi', 'npm', 'composer', 'nuget'].includes(this.repoType)
             },
             showCleanConfigTab () {
-                return ['maven', 'docker', 'npm', 'helm', 'generic'].includes(this.repoType)
+                return ['docker', 'generic', 'helm'].includes(this.repoType)
             },
             showPermissionConfigTab () {
                 return ['generic'].includes(this.repoType) && (this.userInfo.admin || this.userInfo.manage) && !(['pipeline', 'custom'].includes(this.repoName))
diff --git a/src/frontend/devops-repository/src/views/repoList/index.vue b/src/frontend/devops-repository/src/views/repoList/index.vue
index 7a0176ce09..929878d4c5 100644
--- a/src/frontend/devops-repository/src/views/repoList/index.vue
+++ b/src/frontend/devops-repository/src/views/repoList/index.vue
@@ -85,7 +85,7 @@
                                     && row.name !== 'log'
                                     && row.name !== 'pipeline'
                                 )) && { label: $t('delete'), clickEvent: () => deleteRepo(row) },
-                            (userInfo.admin || userInfo.manage) && { label: $t('cleanRepo'), clickEvent: () => cleanRepo(row) }
+                            (userInfo.admin || userInfo.manage) && (row.repoType === 'generic') && { label: $t('cleanRepo'), clickEvent: () => cleanRepo(row) }
                         ]">
                     </operation-list>
                 </template>
diff --git a/src/frontend/locale/repository/en-US.json b/src/frontend/locale/repository/en-US.json
index ecb72057fe..144c247560 100644
--- a/src/frontend/locale/repository/en-US.json
+++ b/src/frontend/locale/repository/en-US.json
@@ -320,7 +320,7 @@
     "equal":"Equal",
     "contain": "Contain",
     "regular":"Regular",
-    "inputFilePathTip": "Please enter the absolute path of the file directory",
+    "inputFilePathTip": "Please enter the absolute path",
     "autoCleanup": "Auto cleanup",
     "minimumVersion":"minimum version",
     "cleanTip": "The number of artifact versions exceeds the number of reserved versions, and the artifact versions that have not been used within the retention time will be cleared",
@@ -813,5 +813,16 @@
     "deletePermissionMsg": "Confirm to delete this permission？",
     "createPermNameTip": "Please enter a name",
     "createPathsTip": "Please add path",
-    "createUsersTip": "Please add user"
+    "createUsersTip": "Please add user",
+    "cleanConfigTip": "Please enter the correct input",
+    "cleanupStrategy": "Cleanup Strategy",
+    "retentionDays":"Retention Days",
+    "retentionDate":"Retention Date",
+    "retentionNums":"Reserve Number",
+    "chooseDateTip": "Please select date time",
+    "cleanTarget":"Clean Target",
+    "addTarget": "Add Target",
+    "cleanConfig":"Clean Config",
+    "and": "and",
+    "cleanPackageRuleTip": "Package name,e.g., nginx"
 }
diff --git a/src/frontend/locale/repository/zh-CN.json b/src/frontend/locale/repository/zh-CN.json
index 3e155ced6f..693f00e323 100644
--- a/src/frontend/locale/repository/zh-CN.json
+++ b/src/frontend/locale/repository/zh-CN.json
@@ -814,5 +814,16 @@
     "deletePermissionMsg": "确认删除此权限？",
     "createPermNameTip": "请输入权限名称",
     "createPathsTip": "请添加路径",
-    "createUsersTip": "请添加用户"
+    "createUsersTip": "请添加用户",
+    "cleanConfigTip": "请填写正确的输入",
+    "cleanupStrategy": "清理策略",
+    "retentionDays":"保留天数",
+    "retentionDate":"保留日期",
+    "retentionNums":"保留数目",
+    "chooseDateTip": "请选择日期时间",
+    "cleanTarget":"清理目标",
+    "addTarget": "添加目标",
+    "cleanConfig":"清理设置",
+    "and": "和",
+    "cleanPackageRuleTip": "请输入包名，例如：nginx"
 }