feat(m6): add CRUD dialogs for environments and product lines

web/delivery-platform-ui/src/api/platform.js

@@ -274,6 +274,18 @@ export function getIntegrationEnvironment(id) {
   return axios.get(`/api/v1/integration/environments/${id}`);
 }
 
+export function createIntegrationEnvironment(body) {
+  return axios.post("/api/v1/integration/environments", body);
+}
+
+export function updateIntegrationEnvironment(id, body) {
+  return axios.put(`/api/v1/integration/environments/${id}`, body);
+}
+
+export function deleteIntegrationEnvironment(id) {
+  return axios.delete(`/api/v1/integration/environments/${id}`);
+}
+
 /**
  * @param {{ page?: number, size?: number }} params
  */
@@ -288,6 +300,18 @@ export function getProductLine(id) {
   return axios.get(`/api/v1/integration/product-lines/${id}`);
 }
 
+export function createProductLine(body) {
+  return axios.post("/api/v1/integration/product-lines", body);
+}
+
+export function updateProductLine(id, body) {
+  return axios.put(`/api/v1/integration/product-lines/${id}`, body);
+}
+
+export function deleteProductLine(id) {
+  return axios.delete(`/api/v1/integration/product-lines/${id}`);
+}
+
 // —— M7 设备管理 ————————————————————————————
 export function listDevices(params) {
   return axios.get('/api/v1/devices', { params });

web/delivery-platform-ui/src/views/IntegrationEnvironmentsView.vue

@@ -3,7 +3,10 @@
     <template #header>
       <div class="toolbar">
         <span class="title">集成环境</span>
-        <el-button type="primary" :loading="loading" @click="load">刷新</el-button>
+        <div class="actions">
+          <el-button type="primary" :loading="loading" @click="load">刷新</el-button>
+          <el-button type="success" @click="openCreate">新建环境</el-button>
+        </div>
       </div>
     </template>
 
@@ -17,6 +20,12 @@
       <el-table-column label="产品线 ID" width="120">
         <template #default="{ row }">{{ row.productLineId ?? row.product_line_id ?? "—" }}</template>
       </el-table-column>
+      <el-table-column label="操作" width="160" fixed="right">
+        <template #default="{ row }">
+          <el-button type="primary" link @click="openEdit(row)">编辑</el-button>
+          <el-button type="danger" link @click="onDelete(row)">删除</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <div class="pager">
@@ -31,23 +40,68 @@
         @size-change="onSizeChange"
       />
     </div>
+
+    <el-dialog v-model="dialogVisible" :title="dialogTitle" width="520px" destroy-on-close @closed="resetForm">
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="140px">
+        <el-form-item label="编码" prop="code">
+          <el-input v-model="form.code" maxlength="64" show-word-limit placeholder="请输入环境编码" />
+        </el-form-item>
+        <el-form-item label="名称" prop="name">
+          <el-input v-model="form.name" maxlength="256" show-word-limit placeholder="请输入环境名称" />
+        </el-form-item>
+        <el-form-item label="比特 URL" prop="bitanswerBaseUrl">
+          <el-input v-model="form.bitanswerBaseUrl" maxlength="512" clearable placeholder="选填" />
+        </el-form-item>
+        <el-form-item label="类型" prop="kind">
+          <el-select v-model="form.kind" placeholder="请选择" style="width: 100%">
+            <el-option label="DEV" value="DEV" />
+            <el-option label="TEST" value="TEST" />
+            <el-option label="PROD" value="PROD" />
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" :loading="saving" @click="submit">保存</el-button>
+      </template>
+    </el-dialog>
   </el-card>
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
-import { ElMessage } from "element-plus";
+import { ref, reactive, computed, onMounted } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
 import { useAuthStore } from "../stores/auth";
-import { listIntegrationEnvironments } from "../api/platform";
+import { listIntegrationEnvironments, createIntegrationEnvironment, updateIntegrationEnvironment, deleteIntegrationEnvironment } from "../api/platform";
 import { apiErrorMessage } from "../utils/apiErrorMessage";
 
 const auth = useAuthStore();
+
 const loading = ref(false);
+const saving = ref(false);
 const rows = ref([]);
 const total = ref(0);
 const page = ref(1);
 const pageSize = ref(20);
 
+const dialogVisible = ref(false);
+const editingId = ref(null);
+const formRef = ref(null);
+const form = reactive({
+  code: "",
+  name: "",
+  bitanswerBaseUrl: "",
+  kind: "",
+});
+
+const rules = {
+  code: [{ required: true, message: "请输入环境编码", trigger: "blur" }],
+  name: [{ required: true, message: "请输入环境名称", trigger: "blur" }],
+  kind: [{ required: true, message: "请选择类型", trigger: "change" }],
+};
+
+const dialogTitle = computed(() => (editingId.value ? "编辑环境" : "新建环境"));
+
 onMounted(async () => {
   auth.restoreAxiosAuth();
   await load();
@@ -76,6 +130,79 @@ async function load() {
     loading.value = false;
   }
 }
+
+function openCreate() {
+  editingId.value = null;
+  resetForm();
+  dialogVisible.value = true;
+}
+
+function openEdit(row) {
+  editingId.value = row.id;
+  form.code = row.code ?? "";
+  form.name = row.name ?? "";
+  form.bitanswerBaseUrl = row.bitanswerBaseUrl ?? row.bitanswer_base_url ?? "";
+  form.kind = row.kind ?? "";
+  dialogVisible.value = true;
+}
+
+function resetForm() {
+  form.code = "";
+  form.name = "";
+  form.bitanswerBaseUrl = "";
+  form.kind = "";
+  formRef.value?.resetFields?.();
+}
+
+async function submit() {
+  const f = formRef.value;
+  if (!f) return;
+  try {
+    await f.validate();
+  } catch {
+    return;
+  }
+  saving.value = true;
+  const payload = {
+    code: form.code.trim(),
+    name: form.name.trim(),
+    bitanswerBaseUrl: form.bitanswerBaseUrl?.trim() || undefined,
+    kind: form.kind,
+  };
+  try {
+    if (editingId.value != null) {
+      await updateIntegrationEnvironment(editingId.value, payload);
+      ElMessage.success("已保存");
+    } else {
+      await createIntegrationEnvironment(payload);
+      ElMessage.success("已创建");
+    }
+    dialogVisible.value = false;
+    await load();
+  } catch (e) {
+    ElMessage.error(apiErrorMessage(e, "保存失败"));
+  } finally {
+    saving.value = false;
+  }
+}
+
+function onDelete(row) {
+  ElMessageBox.confirm(`确定删除环境「${row.name || row.code || row.id}」吗？`, "提示", {
+    type: "warning",
+    confirmButtonText: "删除",
+    cancelButtonText: "取消",
+  })
+    .then(async () => {
+      try {
+        await deleteIntegrationEnvironment(row.id);
+        ElMessage.success("已删除");
+        await load();
+      } catch (e) {
+        ElMessage.error(apiErrorMessage(e, "删除失败"));
+      }
+    })
+    .catch(() => {});
+}
 </script>
 
 <style scoped>
@@ -90,6 +217,12 @@ async function load() {
   font-weight: 600;
   font-size: 16px;
 }
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+}
 .pager {
   margin-top: 16px;
   display: flex;

web/delivery-platform-ui/src/views/IntegrationProductLinesView.vue

@@ -3,7 +3,10 @@
     <template #header>
       <div class="toolbar">
         <span class="title">产品线</span>
-        <el-button type="primary" :loading="loading" @click="load">刷新</el-button>
+        <div class="actions">
+          <el-button type="primary" :loading="loading" @click="load">刷新</el-button>
+          <el-button type="success" @click="openCreate">新建产品线</el-button>
+        </div>
       </div>
     </template>
 
@@ -19,6 +22,12 @@
           <el-tag v-else type="success" size="small">是</el-tag>
         </template>
       </el-table-column>
+      <el-table-column label="操作" width="160" fixed="right">
+        <template #default="{ row }">
+          <el-button type="primary" link @click="openEdit(row)">编辑</el-button>
+          <el-button type="danger" link @click="onDelete(row)">删除</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <div class="pager">
@@ -33,23 +42,63 @@
         @size-change="onSizeChange"
       />
     </div>
+
+    <el-dialog v-model="dialogVisible" :title="dialogTitle" width="520px" destroy-on-close @closed="resetForm">
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="编码" prop="code">
+          <el-input v-model="form.code" maxlength="64" show-word-limit placeholder="请输入产品线编码" />
+        </el-form-item>
+        <el-form-item label="名称" prop="name">
+          <el-input v-model="form.name" maxlength="256" show-word-limit placeholder="请输入产品线名称" />
+        </el-form-item>
+        <el-form-item label="描述" prop="description">
+          <el-input v-model="form.description" maxlength="1024" type="textarea" :rows="3" clearable placeholder="选填" />
+        </el-form-item>
+        <el-form-item label="启用" prop="enabled">
+          <el-switch v-model="form.enabled" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" :loading="saving" @click="submit">保存</el-button>
+      </template>
+    </el-dialog>
   </el-card>
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
-import { ElMessage } from "element-plus";
+import { ref, reactive, computed, onMounted } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
 import { useAuthStore } from "../stores/auth";
-import { listProductLines } from "../api/platform";
+import { listProductLines, createProductLine, updateProductLine, deleteProductLine } from "../api/platform";
 import { apiErrorMessage } from "../utils/apiErrorMessage";
 
 const auth = useAuthStore();
+
 const loading = ref(false);
+const saving = ref(false);
 const rows = ref([]);
 const total = ref(0);
 const page = ref(1);
 const pageSize = ref(20);
 
+const dialogVisible = ref(false);
+const editingId = ref(null);
+const formRef = ref(null);
+const form = reactive({
+  code: "",
+  name: "",
+  description: "",
+  enabled: true,
+});
+
+const rules = {
+  code: [{ required: true, message: "请输入产品线编码", trigger: "blur" }],
+  name: [{ required: true, message: "请输入产品线名称", trigger: "blur" }],
+};
+
+const dialogTitle = computed(() => (editingId.value ? "编辑产品线" : "新建产品线"));
+
 onMounted(async () => {
   auth.restoreAxiosAuth();
   await load();
@@ -78,6 +127,79 @@ async function load() {
     loading.value = false;
   }
 }
+
+function openCreate() {
+  editingId.value = null;
+  resetForm();
+  dialogVisible.value = true;
+}
+
+function openEdit(row) {
+  editingId.value = row.id;
+  form.code = row.code ?? "";
+  form.name = row.name ?? "";
+  form.description = row.description ?? "";
+  form.enabled = row.enabled !== false;
+  dialogVisible.value = true;
+}
+
+function resetForm() {
+  form.code = "";
+  form.name = "";
+  form.description = "";
+  form.enabled = true;
+  formRef.value?.resetFields?.();
+}
+
+async function submit() {
+  const f = formRef.value;
+  if (!f) return;
+  try {
+    await f.validate();
+  } catch {
+    return;
+  }
+  saving.value = true;
+  const payload = {
+    code: form.code.trim(),
+    name: form.name.trim(),
+    description: form.description?.trim() || undefined,
+    enabled: form.enabled,
+  };
+  try {
+    if (editingId.value != null) {
+      await updateProductLine(editingId.value, payload);
+      ElMessage.success("已保存");
+    } else {
+      await createProductLine(payload);
+      ElMessage.success("已创建");
+    }
+    dialogVisible.value = false;
+    await load();
+  } catch (e) {
+    ElMessage.error(apiErrorMessage(e, "保存失败"));
+  } finally {
+    saving.value = false;
+  }
+}
+
+function onDelete(row) {
+  ElMessageBox.confirm(`确定删除产品线「${row.name || row.code || row.id}」吗？`, "提示", {
+    type: "warning",
+    confirmButtonText: "删除",
+    cancelButtonText: "取消",
+  })
+    .then(async () => {
+      try {
+        await deleteProductLine(row.id);
+        ElMessage.success("已删除");
+        await load();
+      } catch (e) {
+        ElMessage.error(apiErrorMessage(e, "删除失败"));
+      }
+    })
+    .catch(() => {});
+}
 </script>
 
 <style scoped>
@@ -92,6 +214,12 @@ async function load() {
   font-weight: 600;
   font-size: 16px;
 }
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+}
 .pager {
   margin-top: 16px;
   display: flex;