From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/components/bpmnProcessDesigner/package/penal/task/task-components/HttpHeaderEditor.vue | 178 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 178 insertions(+), 0 deletions(-)
diff --git a/src/components/bpmnProcessDesigner/package/penal/task/task-components/HttpHeaderEditor.vue b/src/components/bpmnProcessDesigner/package/penal/task/task-components/HttpHeaderEditor.vue
new file mode 100644
index 0000000..5d0a133
--- /dev/null
+++ b/src/components/bpmnProcessDesigner/package/penal/task/task-components/HttpHeaderEditor.vue
@@ -0,0 +1,178 @@
+<template>
+ <el-dialog
+ v-model="dialogVisible"
+ title="缂栬緫璇锋眰澶�"
+ width="600px"
+ :close-on-click-modal="false"
+ @close="handleClose"
+ >
+ <div class="header-editor">
+ <div class="header-list">
+ <div v-for="(item, index) in headerList" :key="index" class="header-item">
+ <el-input v-model="item.key" placeholder="璇疯緭鍏ュ弬鏁板悕" class="header-key" clearable />
+ <span class="separator">:</span>
+ <el-input
+ v-model="item.value"
+ placeholder="璇疯緭鍏ュ弬鏁板�� (鏀寔琛ㄨ揪寮� ${鍙橀噺鍚峿)"
+ class="header-value"
+ clearable
+ />
+ <el-button
+ type="danger"
+ :icon="Delete"
+ circle
+ size="small"
+ @click="removeHeader(index)"
+ />
+ </div>
+ </div>
+ <el-button type="primary" :icon="Plus" class="add-btn" @click="addHeader">
+ 娣诲姞璇锋眰澶�
+ </el-button>
+ </div>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="handleClose">鍙栨秷</el-button>
+ <el-button type="primary" @click="handleSave">淇濆瓨</el-button>
+ </span>
+ </template>
+ </el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { Delete, Plus } from '@element-plus/icons-vue'
+
+defineOptions({ name: 'HttpHeaderEditor' })
+
+const props = defineProps({
+ modelValue: {
+ type: Boolean,
+ default: false
+ },
+ headers: {
+ type: String,
+ default: ''
+ }
+})
+
+const emit = defineEmits(['update:modelValue', 'save'])
+
+interface HeaderItem {
+ key: string
+ value: string
+}
+
+const dialogVisible = computed({
+ get: () => props.modelValue,
+ set: (val) => emit('update:modelValue', val)
+})
+
+const headerList = ref<HeaderItem[]>([])
+
+// 瑙f瀽璇锋眰澶村瓧绗︿覆涓哄垪琛�
+const parseHeaders = (headersStr: string): HeaderItem[] => {
+ if (!headersStr || !headersStr.trim()) {
+ return [{ key: '', value: '' }]
+ }
+
+ const lines = headersStr.split('\n').filter((line) => line.trim())
+ const parsed = lines.map((line) => {
+ const colonIndex = line.indexOf(':')
+ if (colonIndex > 0) {
+ return {
+ key: line.substring(0, colonIndex).trim(),
+ value: line.substring(colonIndex + 1).trim()
+ }
+ }
+ return { key: line.trim(), value: '' }
+ })
+
+ return parsed.length > 0 ? parsed : [{ key: '', value: '' }]
+}
+
+// 灏嗗垪琛ㄨ浆鎹负璇锋眰澶村瓧绗︿覆
+const stringifyHeaders = (headers: HeaderItem[]): string => {
+ return headers
+ .filter((item) => item.key.trim())
+ .map((item) => `${item.key}: ${item.value}`)
+ .join('\n')
+}
+
+// 娣诲姞璇锋眰澶�
+const addHeader = () => {
+ headerList.value.push({ key: '', value: '' })
+}
+
+// 绉婚櫎璇锋眰澶�
+const removeHeader = (index: number) => {
+ if (headerList.value.length === 1) {
+ // 鑷冲皯淇濈暀涓�琛�
+ headerList.value = [{ key: '', value: '' }]
+ } else {
+ headerList.value.splice(index, 1)
+ }
+}
+
+// 淇濆瓨
+const handleSave = () => {
+ const headersStr = stringifyHeaders(headerList.value)
+ emit('save', headersStr)
+ dialogVisible.value = false
+}
+
+// 鍏抽棴
+const handleClose = () => {
+ dialogVisible.value = false
+}
+
+// 鐩戝惉瀵硅瘽妗嗘墦寮�锛屽垵濮嬪寲鏁版嵁
+watch(
+ () => props.modelValue,
+ (val) => {
+ if (val) {
+ headerList.value = parseHeaders(props.headers)
+ }
+ },
+ { immediate: true }
+)
+</script>
+
+<style lang="scss" scoped>
+.header-editor {
+ .header-list {
+ max-height: 400px;
+ overflow-y: auto;
+ margin-bottom: 16px;
+ }
+
+ .header-item {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ margin-bottom: 12px;
+
+ .header-key {
+ flex: 0 0 180px;
+ }
+
+ .separator {
+ color: #606266;
+ font-weight: 500;
+ }
+
+ .header-value {
+ flex: 1;
+ }
+ }
+
+ .add-btn {
+ width: 100%;
+ }
+}
+
+.dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+}
+</style>
--
Gitblit v1.8.0