mirrors/woodpecker
1
0
Fork 0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2025-02-18 04:15:15 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'origin/main' into 'next-release/main'

Browse source
This commit is contained in:
oauth 2024-11-19 15:11:33 +00:00
commit 826312d1c6
1 changed files with 27 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
web/src/components/layout/popups/DeployPipelinePopup.vue
View file

@ -13,45 +13,28 @@
</InputField> </InputField>
<InputField v-slot="{ id }" :label="$t('repo.deploy_pipeline.variables.title')"> <InputField v-slot="{ id }" :label="$t('repo.deploy_pipeline.variables.title')">
<span class="text-sm text-wp-text-alt-100 mb-2">{{ $t('repo.deploy_pipeline.variables.desc') }}</span> <span class="text-sm text-wp-text-alt-100 mb-2">{{ $t('repo.deploy_pipeline.variables.desc') }}</span>
<div class="flex flex-col gap-2"> <KeyValueEditor
<div v-for="(_, i) in payload.variables" :key="i" class="flex gap-4"> :id="id"
<TextField v-model="payload.variables"
:id="id" :key-placeholder="$t('repo.deploy_pipeline.variables.name')"
v-model="payload.variables[i].name" :value-placeholder="$t('repo.deploy_pipeline.variables.value')"
:placeholder="$t('repo.deploy_pipeline.variables.name')" :delete-title="$t('repo.deploy_pipeline.variables.delete')"
/> @update:is-valid="isVariablesValid = $event"
<TextField />
:id="id"
v-model="payload.variables[i].value"
:placeholder="$t('repo.deploy_pipeline.variables.value')"
/>
<div class="w-10 flex-shrink-0">
<Button
v-if="i !== payload.variables.length - 1"
color="red"
class="ml-auto"
:title="$t('repo.deploy_pipeline.variables.delete')"
@click="deleteVar(i)"
>
<Icon name="remove" />
</Button>
</div>
</div>
</div>
</InputField> </InputField>
<Button type="submit" :text="$t('repo.deploy_pipeline.trigger')" /> <Button type="submit" :text="$t('repo.deploy_pipeline.trigger')" :disabled="!isFormValid" />
</form> </form>
</Panel> </Panel>
</Popup> </Popup>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onMounted, ref, toRef, watch } from 'vue'; import { computed, onMounted, ref, toRef } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import Button from '~/components/atomic/Button.vue'; import Button from '~/components/atomic/Button.vue';
import Icon from '~/components/atomic/Icon.vue';
import InputField from '~/components/form/InputField.vue'; import InputField from '~/components/form/InputField.vue';
import KeyValueEditor from '~/components/form/KeyValueEditor.vue';
import TextField from '~/components/form/TextField.vue'; import TextField from '~/components/form/TextField.vue';
import Panel from '~/components/layout/Panel.vue'; import Panel from '~/components/layout/Panel.vue';
import Popup from '~/components/layout/Popup.vue'; import Popup from '~/components/layout/Popup.vue';
@ -68,55 +51,37 @@ const emit = defineEmits<{
}>(); }>();
const apiClient = useApiClient(); const apiClient = useApiClient();
const repo = inject('repo'); const repo = inject('repo');
const router = useRouter(); const router = useRouter();
const payload = ref<{ id: string; environment: string; task: string; variables: { name: string; value: string }[] }>({ const payload = ref<{
id: string;
environment: string;
task: string;
variables: Record<string, string>;
}>({
id: '', id: '',
environment: '', environment: '',
task: '', task: '',
variables: [ variables: {},
{
name: '',
value: '',
},
],
}); });
const pipelineOptions = computed(() => { const isVariablesValid = ref(true);
const variables = Object.fromEntries(
payload.value.variables.filter((e) => e.name !== '').map((item) => [item.name, item.value]), const isFormValid = computed(() => {
); return payload.value.environment !== '' && isVariablesValid.value;
return {
...payload.value,
variables,
};
}); });
const pipelineOptions = computed(() => ({
...payload.value,
variables: payload.value.variables,
}));
const loading = ref(true); const loading = ref(true);
onMounted(async () => { onMounted(async () => {
loading.value = false; loading.value = false;
}); });
watch(
payload,
() => {
if (payload.value.variables[payload.value.variables.length - 1].name !== '') {
payload.value.variables.push({
name: '',
value: '',
});
}
},
{ deep: true },
);
function deleteVar(index: number) {
payload.value.variables.splice(index, 1);
}
const pipelineNumber = toRef(props, 'pipelineNumber'); const pipelineNumber = toRef(props, 'pipelineNumber');
async function triggerDeployPipeline() { async function triggerDeployPipeline() {
loading.value = true; loading.value = true;