Skip to content

Commit

Permalink
feat：流水线变量语法支持两种风格 TencentBlueKing#10576
Browse files Browse the repository at this point in the history 
# Reviewed, transaction id: 20950
  • Loading branch information
@useryuyu
useryuyu committed Oct 16, 2024
1 parent de97804 commit b487784
Show file tree
Hide file tree
Showing 10 changed files with 263 additions and 233 deletions.
2 changes: 1 addition & 1 deletion src/frontend/devops-manage/src/components/dialectPopoverTable.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
theme="light"
:width="900"
extCls="dialect-popover"
:componentEventDelay="300"
show-overflow-tooltip
:componentEventDelay="300"
autoPlacement
>
<label class="label">{{ t('变量语法风格') }}</label>
Expand Down
2 changes: 1 addition & 1 deletion src/frontend/devops-manage/src/components/manage-header.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ const goToManage = () => {
border-bottom: 1px solid #DCDEE5;
}
.manage-header {
height: 60px;
height: 59px;
background: #FFFFFF;
box-shadow: 0 2px 5px 0 rgba(51,60,72,0.03);
display: flex;
Expand Down
349 changes: 186 additions & 163 deletions src/frontend/devops-manage/src/components/project-form.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -316,179 +316,182 @@ onBeforeUnmount(() => {
ref="projectForm"
:rules="rules"
:model="projectData"
:label-width="160"
:label-width="216"
>
<bk-form-item :label="t('项目名称')" property="projectName" :required="true">
<bk-input
v-model="projectData.projectName"
:placeholder="t('请输入1-32字符的项目名称')"
:maxlength="32"
@change="handleChangeForm"
></bk-input>
<div class="error-tips" v-if="validateProjectNameTips">
{{ validateProjectNameTips }}
</div>
</bk-form-item>
<bk-form-item :label="t('项目ID')" property="englishName" :required="true">
<bk-input
v-model="projectData.englishName"
:disabled="type === 'edit'"
:maxlength="32"
:placeholder="t('请输入2-32 字符的项目ID，由小写字母、数字、中划线组成，以小写字母开头。提交后不可修改。')"
></bk-input>
<div class="error-tips" v-if="validateEnglishNameTips">
{{ validateEnglishNameTips }}
</div>
</bk-form-item>
<bk-form-item :label="t('项目描述')" property="description" :required="true">
<bk-input
v-model="projectData.description"
class="textarea"
type="textarea"
:rows="3"
:maxlength="255"
:placeholder="t('请输入项目描述')"
@change="handleChangeForm"
></bk-input>
</bk-form-item>
<bk-form-item :label="t('项目LOGO')">
<bk-upload
theme="picture"
:files="logoFiles"
with-credentials
:multiple="false"
:custom-request="handleUploadLogo"
/>
<span class="logo-upload-tip">{{ t('只允许上传png、jpg，大小不超过 2M')}}</span>
</bk-form-item>
<!-- <bk-form-item :label="t('项目所属组织')" property="bgId" :required="true">
<div class="bk-dropdown-box">
<bk-select
v-model="projectData.bgId"
placeholder="BG"
name="bg"
:loading="deptLoading.bg"
filterable
@change="id => handleChangeBg('bg', id)"
>
<bk-option
v-for="bg in curDepartmentInfo.bg"
:value="bg.id"
:key="bg.id"
:label="bg.name"
/>
</bk-select>
</div>
<div class="bk-dropdown-box">
<bk-select
v-model="projectData.deptId"
:placeholder="t('部门')"
name="dept"
:loading="deptLoading.dept"
filterable
@change="id => handleChangeDept('dept', id)"
>
<bk-option
v-for="bg in curDepartmentInfo.dept"
:value="bg.id"
:key="bg.id"
:label="bg.name"
/>
</bk-select>
</div>
<div class="bk-dropdown-box">
<div class="project-tab advanced">
<p class="title">{{t('基础信息')}}</p>
<bk-form-item :label="t('项目名称')" property="projectName" :required="true">
<bk-input
v-model="projectData.projectName"
:placeholder="t('请输入1-32字符的项目名称')"
:maxlength="32"
@change="handleChangeForm"
></bk-input>
<div class="error-tips" v-if="validateProjectNameTips">
{{ validateProjectNameTips }}
</div>
</bk-form-item>
<bk-form-item :label="t('项目ID')" property="englishName" :required="true">
<bk-input
v-model="projectData.englishName"
:disabled="type === 'edit'"
:maxlength="32"
:placeholder="t('请输入2-32 字符的项目ID，由小写字母、数字、中划线组成，以小写字母开头。提交后不可修改。')"
></bk-input>
<div class="error-tips" v-if="validateEnglishNameTips">
{{ validateEnglishNameTips }}
</div>
</bk-form-item>
<bk-form-item :label="t('项目描述')" property="description" :required="true">
<bk-input
v-model="projectData.description"
class="textarea"
type="textarea"
:rows="3"
:maxlength="255"
:placeholder="t('请输入项目描述')"
@change="handleChangeForm"
></bk-input>
</bk-form-item>
<bk-form-item :label="t('项目LOGO')">
<bk-upload
theme="picture"
:files="logoFiles"
with-credentials
:multiple="false"
:custom-request="handleUploadLogo"
/>
<span class="logo-upload-tip">{{ t('只允许上传png、jpg，大小不超过 2M')}}</span>
</bk-form-item>
<!-- <bk-form-item :label="t('项目所属组织')" property="bgId" :required="true">
<div class="bk-dropdown-box">
<bk-select
v-model="projectData.bgId"
placeholder="BG"
name="bg"
:loading="deptLoading.bg"
filterable
@change="id => handleChangeBg('bg', id)"
>
<bk-option
v-for="bg in curDepartmentInfo.bg"
:value="bg.id"
:key="bg.id"
:label="bg.name"
/>
</bk-select>
</div>
<div class="bk-dropdown-box">
<bk-select
v-model="projectData.deptId"
:placeholder="t('部门')"
name="dept"
:loading="deptLoading.dept"
filterable
@change="id => handleChangeDept('dept', id)"
>
<bk-option
v-for="bg in curDepartmentInfo.dept"
:value="bg.id"
:key="bg.id"
:label="bg.name"
/>
</bk-select>
</div>
<div class="bk-dropdown-box">
<bk-select
v-model="projectData.centerId"
:placeholder="t('中心')"
name="center"
:loading="deptLoading.center"
filterable
@change="id => handleChangeCenter('center', id)"
>
<bk-option
v-for="center in curDepartmentInfo.center"
:value="center.id"
:key="center.id"
:label="center.name"
/>
</bk-select>
</div>
</bk-form-item> -->
<bk-form-item :label="t('项目类型')" property="projectType" :required="true">
<bk-select
v-model="projectData.centerId"
:placeholder="t('中心')"
v-model="projectData.projectType"
:placeholder="t('选择项目类型')"
name="center"
:loading="deptLoading.center"
filterable
@change="id => handleChangeCenter('center', id)"
searchable
@change="handleChangeForm"
>
<bk-option
v-for="center in curDepartmentInfo.center"
:value="center.id"
:key="center.id"
:label="center.name"
v-for="type in projectTypeList"
:value="type.id"
:key="type.id"
:label="type.name"
/>
</bk-select>
</div>
</bk-form-item> -->
<bk-form-item :label="t('项目类型')" property="projectType" :required="true">
<bk-select
v-model="projectData.projectType"
:placeholder="t('选择项目类型')"
name="center"
searchable
@change="handleChangeForm"
</bk-form-item>
<bk-form-item
v-if="isRbac"
:label="t('项目性质')"
property="authSecrecy"
:required="true"
>
<bk-option
v-for="type in projectTypeList"
:value="type.id"
:key="type.id"
:label="type.name"
<bk-radio-group
v-model="projectData.authSecrecy"
@change="handleChangeForm"
>
<bk-radio class="mr10" :label="0">
<Popover :content="t('`项目最大可授权人员范围`内的用户可以主动申请加入项目')">
<span class="authSecrecy-item">{{ t('私有项目') }}</span>
</Popover>
</bk-radio>
<bk-radio :label="1">
<Popover :content="t('拥有项目/资源管理权限的成员才可以主动添加用户')">
<span class="authSecrecy-item">{{ t('保密项目') }}</span>
</Popover>
</bk-radio>
</bk-radio-group>
</bk-form-item>
</div>
<div class="project-tab">
<p class="title">{{t('高级信息')}}</p>
<bk-form-item
v-if="!isRbac"
:label="t('项目最大可授权人员范围')"
:description="t('该设置表示可以加入项目的成员的最大范围，范围内的用户才可以成功加入项目下的任意用户组')"
property="subjectScopes"
:required="true">
<bk-tag
v-for="(subjectScope, index) in projectData.subjectScopes"
:key="index"
>
{{ subjectScope.id === '*' ? t('全员') : subjectScope.name }}
</bk-tag>
<EditLine
class="edit-line ml5"
@click="showMemberDialog"
/>
</bk-select>
</bk-form-item>
<bk-form-item
v-if="isRbac"
:label="t('项目性质')"
property="authSecrecy"
:required="true"
>
<bk-radio-group
v-model="projectData.authSecrecy"
@change="handleChangeForm"
>
<bk-radio class="mr10" :label="0">
<Popover :content="t('`项目最大可授权人员范围`内的用户可以主动申请加入项目')">
<span class="authSecrecy-item">{{ t('私有项目') }}</span>
</Popover>
</bk-radio>
<bk-radio :label="1">
<Popover :content="t('拥有项目/资源管理权限的成员才可以主动添加用户')">
<span class="authSecrecy-item">{{ t('保密项目') }}</span>
</Popover>
</bk-radio>
</bk-radio-group>
</bk-form-item>
<bk-form-item
v-if="isRbac"
:label="t('项目最大可授权人员范围')"
:description="t('该设置表示可以加入项目的成员的最大范围，范围内的用户才可以成功加入项目下的任意用户组')"
property="subjectScopes"
:required="true">
<bk-tag
v-for="(subjectScope, index) in projectData.subjectScopes"
:key="index"
</bk-form-item>
<bk-form-item
property="pipelineDialect"
>
{{ subjectScope.id === '*' ? t('全员') : subjectScope.name }}
</bk-tag>
<EditLine
class="edit-line ml5"
@click="showMemberDialog"
/>
</bk-form-item>
<bk-form-item
property="pipelineDialect"
>
<template #label>
<dialect-popover-table />
</template>
<bk-radio-group
v-model="projectData.pipelineDialect"
@change="handleChangeForm"
>
<bk-radio label="CLASSIC">
<span>{{ t('CLASSIC') }}</span>
</bk-radio>
<bk-radio label="CONSTRAINED">
<span>{{ t('CONSTRAINED') }}</span>
</bk-radio>
</bk-radio-group>
</bk-form-item>
<div>
<slot></slot>
<template #label>
<dialect-popover-table />
</template>
<bk-radio-group
v-model="projectData.pipelineDialect"
@change="handleChangeForm"
>
<bk-radio label="CLASSIC">
<span>{{ t('CLASSIC') }}</span>
</bk-radio>
<bk-radio label="CONSTRAINED">
<span>{{ t('CONSTRAINED') }}</span>
</bk-radio>
</bk-radio-group>
</bk-form-item>
</div>
</bk-form>

Expand Down Expand Up @@ -558,4 +561,24 @@ onBeforeUnmount(() => {
.bk-form-error {
white-space: nowrap;
}
.project-tab {
width: 100%;
padding: 16px 120px 1px 24px;
background-color: #fff;
box-shadow: 0 2px 2px 0 #00000026;
}
.advanced {
margin-bottom: 24px;
}
.title {
width: 56px;
height: 22px;
margin-bottom: 16px;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
font-size: 14px;
color: #63656E;
letter-spacing: 0;
line-height: 22px;
}
</style>
Loading

0 comments on commit b487784

Please sign in to comment.