github
/
certd
mirror of https://github.com/certd/certd
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: 修复access选择类型trigger

pull/21/merge
xiaojunnuo 2023-06-25 16:25:23 +08:00
parent 937e3fac19
commit 2851a33eb2
5 changed files with 99 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/core/pipeline/src/plugin/api.ts
View File

@ -31,6 +31,12 @@ export type PluginDefine = Registrable & {
autowire?: { autowire?: {
[key: string]: any; [key: string]: any;
}; };
reference?: {
src: string;
dest: string;
type: "computed";
}[];
}; };
export type ITaskPlugin = { export type ITaskPlugin = {

7
packages/plugins/plugin-cert/src/plugin/cert-plugin/index.ts
View File

@ -73,6 +73,13 @@ export class CertApplyPlugin extends AbstractTaskPlugin {
}, },
required: true, required: true,
helper: "请选择dns解析提供商授权", helper: "请选择dns解析提供商授权",
reference: [
{
src: "form.dnsProviderType",
dest: "component.type",
type: "computed",
},
],
}) })
dnsProviderAccess!: string; dnsProviderAccess!: string;

64
packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/step-form/index.vue
View File

@ -84,11 +84,12 @@
</a-drawer> </a-drawer>
</template> </template>
<script lang="jsx"> <script lang="tsx">
import { message, Modal } from "ant-design-vue"; import { message, Modal } from "ant-design-vue";
import { inject, ref } from "vue"; import { computed, inject, Ref, ref } from "vue";
import _ from "lodash"; import _ from "lodash";
import { nanoid } from "nanoid"; import { nanoid } from "nanoid";
import { compute } from "@fast-crud/fast-crud";
export default { export default {
name: "PiStepForm", name: "PiStepForm",
props: { props: {
@ -98,21 +99,21 @@ export default {
} }
}, },
emits: ["update"], emits: ["update"],
setup(props, context) { setup(props: any, context: any) {
/** /**
* step drawer * step drawer
* @returns * @returns
*/ */
function useStepForm() { function useStepForm() {
const stepPluginDefineList = inject("plugins"); const stepPluginDefineList: any = inject("plugins");
const mode = ref("add"); const mode: Ref = ref("add");
const callback = ref(); const callback: Ref = ref();
const currentStep = ref({ title: undefined, input: {} }); const currentStep: Ref = ref({ title: undefined, input: {} });
const currentPlugin = ref({}); const currentPlugin: Ref = ref({});
const stepFormRef = ref(null); const stepFormRef: Ref = ref(null);
const stepDrawerVisible = ref(false); const stepDrawerVisible: Ref = ref(false);
const rules = ref({ const rules: Ref = ref({
name: [ name: [
{ {
type: "string", type: "string",
@ -122,7 +123,7 @@ export default {
] ]
}); });
const stepTypeSelected = (item) => { const stepTypeSelected = (item: any) => {
currentStep.value.type = item.name; currentStep.value.type = item.name;
currentStep.value.title = item.title; currentStep.value.title = item.title;
console.log("currentStepTypeChanged:", currentStep.value); console.log("currentStepTypeChanged:", currentStep.value);
@ -155,13 +156,14 @@ export default {
stepDrawerVisible.value = false; stepDrawerVisible.value = false;
}; };
const stepDrawerOnAfterVisibleChange = (val) => { const stepDrawerOnAfterVisibleChange = (val: any) => {
console.log("stepDrawerOnAfterVisibleChange", val); console.log("stepDrawerOnAfterVisibleChange", val);
}; };
const stepOpen = (step, emit) => { const stepOpen = (step: any, emit: any) => {
callback.value = emit; callback.value = emit;
currentStep.value = _.merge({ input: {}, strategy: {} }, step); currentStep.value = _.merge({ input: {}, strategy: {} }, step);
console.log("currentStepOpen", currentStep.value); console.log("currentStepOpen", currentStep.value);
if (step.type) { if (step.type) {
changeCurrentPlugin(currentStep.value); changeCurrentPlugin(currentStep.value);
@ -169,9 +171,9 @@ export default {
stepDrawerShow(); stepDrawerShow();
}; };
const stepAdd = (emit) => { const stepAdd = (emit: any) => {
mode.value = "add"; mode.value = "add";
const step = { const step: any = {
id: nanoid(), id: nanoid(),
title: "新任务", title: "新任务",
type: undefined, type: undefined,
@ -182,31 +184,49 @@ export default {
stepOpen(step, emit); stepOpen(step, emit);
}; };
const stepEdit = (step, emit) => { const stepEdit = (step: any, emit: any) => {
mode.value = "edit"; mode.value = "edit";
stepOpen(step, emit); stepOpen(step, emit);
}; };
const stepView = (step, emit) => { const stepView = (step: any, emit: any) => {
mode.value = "view"; mode.value = "view";
stepOpen(step, emit); stepOpen(step, emit);
}; };
const changeCurrentPlugin = (step) => { const changeCurrentPlugin = (step: any) => {
const stepType = step.type; const stepType = step.type;
const pluginDefine = stepPluginDefineList.value.find((p) => { const pluginDefine = stepPluginDefineList.value.find((p: any) => {
return p.name === stepType; return p.name === stepType;
}); });
if (pluginDefine) { if (pluginDefine) {
step.type = stepType; step.type = stepType;
step._isAdd = false; step._isAdd = false;
currentPlugin.value = pluginDefine; currentPlugin.value = _.cloneDeep(pluginDefine);
for (let key in currentPlugin.value.input) {
const input = currentPlugin.value.input[key];
if (input?.reference) {
for (const reference of input.reference) {
_.set(
input,
reference.dest,
computed<any>(() => {
const scope = {
form: currentStep.value.input
};
return _.get(scope, reference.src);
})
);
} }
}
}
}
console.log("currentStepTypeChanged:", currentStep.value); console.log("currentStepTypeChanged:", currentStep.value);
console.log("currentStepPlugin:", currentPlugin.value); console.log("currentStepPlugin:", currentPlugin.value);
}; };
const stepSave = async (e) => { const stepSave = async (e: any) => {
console.log("currentStepSave", currentStep.value); console.log("currentStepSave", currentStep.value);
try { try {
await stepFormRef.value.validate(); await stepFormRef.value.validate();

53
packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-form/index.vue
View File

@ -1,12 +1,5 @@
<template> <template>
<a-drawer <a-drawer v-model:visible="taskDrawerVisible" placement="right" :closable="true" width="600px" class="pi-task-form" :after-visible-change="taskDrawerOnAfterVisibleChange">
v-model:visible="taskDrawerVisible"
placement="right"
:closable="true"
width="600px"
class="pi-task-form"
:after-visible-change="taskDrawerOnAfterVisibleChange"
>
<template #title> <template #title>
编辑任务 编辑任务
<a-button v-if="editMode" @click="taskDelete()"> <a-button v-if="editMode" @click="taskDelete()">
@ -15,13 +8,7 @@
</template> </template>
<template v-if="currentTask"> <template v-if="currentTask">
<pi-container> <pi-container>
<a-form <a-form ref="taskFormRef" class="task-form" :model="currentTask" :label-col="labelCol" :wrapper-col="wrapperCol">
ref="taskFormRef"
class="task-form"
:model="currentTask"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<fs-form-item <fs-form-item
v-model="currentTask.title" v-model="currentTask.title"
:item="{ :item="{
@ -37,13 +24,7 @@
/> />
<div class="steps"> <div class="steps">
<a-form-item <a-form-item :value="currentTask.steps" name="steps" label="" :wrapper-col="{ span: 24 }" :rules="[{ required: true, message: '至少需要一个步骤，或者你可以点击标题右边删除按钮删除此任务' }]">
:value="currentTask.steps"
name="steps"
label=""
:wrapper-col="{ span: 24 }"
:rules="[{ required: true, message: '至少需要一个步骤，或者你可以点击标题右边删除按钮删除此任务' }]"
>
<a-descriptions title="任务步骤" size="small"> <a-descriptions title="任务步骤" size="small">
<template #extra> <template #extra>
<a-button type="primary" @click="stepAdd(currentTask)">添加步骤</a-button> <a-button type="primary" @click="stepAdd(currentTask)">添加步骤</a-button>
@ -100,14 +81,14 @@ export default {
} }
}, },
emits: ["update"], emits: ["update"],
setup(props, ctx) { setup(props: any, ctx: any) {
function useStep() { function useStep() {
const stepFormRef: Ref<any> = ref(null); const stepFormRef: Ref<any> = ref(null);
const currentStepIndex = ref(0); const currentStepIndex = ref(0);
provide("currentStepIndex", currentStepIndex); provide("currentStepIndex", currentStepIndex);
const stepAdd = (task) => { const stepAdd = (task: any) => {
currentStepIndex.value = task.steps.length; currentStepIndex.value = task.steps.length;
stepFormRef.value.stepAdd((type, value) => { stepFormRef.value.stepAdd((type: any, value: any) => {
if (type === "save") { if (type === "save") {
task.steps.push(value); task.steps.push(value);
if (!task.title || task.title === "新任务") { if (!task.title || task.title === "新任务") {
@ -116,12 +97,12 @@ export default {
} }
}); });
}; };
const stepEdit = (task, step, stepIndex) => { const stepEdit = (task: any, step: any, stepIndex: any) => {
currentStepIndex.value = stepIndex; currentStepIndex.value = stepIndex;
console.log("step.edit start", task, step, props.editMode); console.log("step.edit start", task, step, props.editMode);
if (props.editMode) { if (props.editMode) {
console.log("step.edit", task, step); console.log("step.edit", task, step);
stepFormRef.value.stepEdit(step, (type, value) => { stepFormRef.value.stepEdit(step, (type: any, value: any) => {
console.log("step.save", step, type, value); console.log("step.save", step, type, value);
if (type === "delete") { if (type === "delete") {
task.steps.splice(stepIndex, 1); task.steps.splice(stepIndex, 1);
@ -131,11 +112,11 @@ export default {
console.log("task.steps", task.steps); console.log("task.steps", task.steps);
}); });
} else { } else {
stepFormRef.value.stepView(step, (type, value) => {}); stepFormRef.value.stepView(step, (type: any, value: any) => {});
} }
}; };
const stepDelete = (task, stepIndex) => { const stepDelete = (task: any, stepIndex: any) => {
Modal.confirm({ Modal.confirm({
title: "确认", title: "确认",
content: `确定要删除此步骤吗？`, content: `确定要删除此步骤吗？`,
@ -176,34 +157,34 @@ export default {
taskDrawerVisible.value = false; taskDrawerVisible.value = false;
}; };
const taskDrawerOnAfterVisibleChange = (val) => { const taskDrawerOnAfterVisibleChange = (val: any) => {
console.log("taskDrawerOnAfterVisibleChange", val); console.log("taskDrawerOnAfterVisibleChange", val);
}; };
const taskOpen = (task, emit) => { const taskOpen = (task: any, emit: any) => {
callback.value = emit; callback.value = emit;
currentTask.value = _.merge({ steps: {} }, task); currentTask.value = _.merge({ steps: {} }, task);
console.log("currentTaskOpen", currentTask.value); console.log("currentTaskOpen", currentTask.value);
taskDrawerShow(); taskDrawerShow();
}; };
const taskAdd = (emit) => { const taskAdd = (emit: any) => {
mode.value = "add"; mode.value = "add";
const task = { id: nanoid(), title: "新任务", steps: [], status: null }; const task: any = { id: nanoid(), title: "新任务", steps: [], status: null };
taskOpen(task, emit); taskOpen(task, emit);
}; };
const taskEdit = (task, emit) => { const taskEdit = (task: any, emit: any) => {
mode.value = "edit"; mode.value = "edit";
taskOpen(task, emit); taskOpen(task, emit);
}; };
const taskView = (task, emit) => { const taskView = (task: any, emit: any) => {
mode.value = "view"; mode.value = "view";
taskOpen(task, emit); taskOpen(task, emit);
}; };
const taskSave = async (e) => { const taskSave = async (e: any) => {
console.log("currentTaskSave", currentTask.value); console.log("currentTaskSave", currentTask.value);
try { try {
await taskFormRef.value.validate(); await taskFormRef.value.validate();

41
packages/ui/certd-client/src/views/certd/pipeline/pipeline/index.vue
View File

@ -113,18 +113,7 @@
<div class="task"> <div class="task">
<a-button shape="round" type="dashed" @click="stageAdd()"> <a-button shape="round" type="dashed" @click="stageAdd()">
<fs-icon icon="ion:add-circle-outline"></fs-icon> <fs-icon icon="ion:add-circle-outline"></fs-icon>
新任务 添加任务
</a-button>
</div>
</div>
<div v-for="(item, ii) of pipeline.notifications" :key="ii" class="task-container">
<div class="line">
<div class="flow-line"></div>
</div>
<div class="task">
<a-button shape="round" @click="notificationEdit(item, ii as number)">
<fs-icon icon="ion:notifications"></fs-icon>
【通知】 {{ item.type }}
</a-button> </a-button>
</div> </div>
</div> </div>
@ -140,13 +129,24 @@
</a-button> </a-button>
</div> </div>
</div> </div>
<div v-for="(item, ii) of pipeline.notifications" :key="ii" class="task-container">
<div class="line">
<div class="flow-line"></div>
</div>
<div class="task">
<a-button shape="round" @click="notificationEdit(item, ii as number)">
<fs-icon icon="ion:notifications"></fs-icon>
【通知】 {{ item.type }}
</a-button>
</div>
</div>
</div> </div>
</div> </div>
<div v-else class="stage last-stage"> <div v-else class="stage last-stage">
<div class="title"> <div class="title">
<pi-editable model-value="结束" :disabled="true" /> <pi-editable model-value="结束" :disabled="true" />
</div> </div>
<div class="tasks"> <div v-if="pipeline.notifications?.length > 0" class="tasks">
<div v-for="(item, index) of pipeline.notifications" :key="index" class="task-container" :class="{ 'first-task': index == 0 }"> <div v-for="(item, index) of pipeline.notifications" :key="index" class="task-container" :class="{ 'first-task': index == 0 }">
<div class="line"> <div class="line">
<div class="flow-line"></div> <div class="flow-line"></div>
@ -160,6 +160,19 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else class="tasks">
<div class="task-container first-task">
<div class="line">
<div class="flow-line"></div>
</div>
<div class="task">
<a-button shape="round" type="dashed">
<fs-icon icon="ion:notifications"></fs-icon>
通知未设置
</a-button>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -414,7 +427,7 @@ export default defineComponent({
}; };
function isLastStage(index: number) { function isLastStage(index: number) {
return !props.editMode && index === pipeline.value.stages.length - 1 && pipeline.value.notifications?.length < 1; return false;
} }
return { return {
stageAdd, stageAdd,