fix: 工单参数修改

src/api/order/index.ts

@@ -3,7 +3,9 @@ import {
   ModifyOrderForm,
   OrderInfoServicePageResult,
   OrderInfoVO,
-  OrderPageResult
+  OrderPageResult,
+  OrderServicePageResult,
+  OrderServiceVO,
 } from "@/api/order/types";
 import request from "@/utils/request";
 
@@ -57,3 +59,27 @@ export function ModifyForm(data: ModifyOrderForm) {
     data,
   });
 }
+export function orderServiceVOPage(
+  orderId: number,
+  service: string,
+  data: PageQuery
+): AxiosPromise<OrderServicePageResult> {
+  return request({
+    url: `/api/order-service/v1/order-service-parameter/${orderId}/${service}`,
+    method: "POST",
+    data,
+  });
+}
+
+export function updateOrderServiceParameter(
+  orderId: number,
+  service: string,
+  serviceFlag: string,
+  data: OrderServiceVO[]
+) {
+  return request({
+    url: `/api/order-service/v1/service-parameter-update/${orderId}/${service}/${serviceFlag}`,
+    method: "POST",
+    data,
+  });
+}

src/api/order/types.ts

@@ -84,3 +84,16 @@ export interface ModifyOrderForm {
 
   orderCustomerKind?: string;
 }
+
+export interface OrderServiceVO {
+  orderId?: number;
+
+  service?: string;
+
+  argsName?: string;
+
+  argsValueNew?: string;
+
+  argsValueOld?: string;
+}
+export type OrderServicePageResult = PageResult<OrderServiceVO[]>;

src/views/family/operate/order/components/ModifyOrder.vue

@@ -107,7 +107,16 @@
         </div>
         <div class="any-table">
           <el-table :data="orderServiceList">
-            <el-table-column label="业务名称" prop="service" align="center" />
+            <el-table-column label="业务名称" prop="service" align="center">
+              <template #default="scope">
+                <el-button
+                  type="primary"
+                  @click="openServiceParameter(scope.row)"
+                  link
+                  >{{ scope.row.service }}</el-button
+                >
+              </template>
+            </el-table-column>
             <el-table-column
               label="业务变更信息"
               prop="serviceFlag"
@@ -124,6 +133,10 @@
         </div>
       </div>
     </el-card>
+    <ModifyServiceParameter
+      ref="modifyServiceRef"
+      @success="getOrderInfoServiceList"
+    />
   </div>
 </template>
 
@@ -136,9 +149,11 @@ import {
 } from "@/api/order";
 import { InfoFilled } from "@element-plus/icons-vue";
 import { FormInstance, FormRules } from "element-plus";
+import ModifyServiceParameter from "@/views/family/operate/order/components/ModifyServiceParameter.vue";
 const loading = ref<boolean>(false);
 const route = useRoute();
 const ruleFormRef = ref<FormInstance>();
+const modifyServiceRef = ref();
 const formData = ref<ModifyOrderForm>({});
 let orderId: number = parseInt(<string>route.params.orderId);
 const queryPage = ref<PageQuery>({
@@ -188,6 +203,9 @@ const submitForm = async (formEl: FormInstance | undefined) => {
     }
   });
 };
+const openServiceParameter = (row: OrderInfoServiceVO) => {
+  modifyServiceRef.value.openModify(row.orderId, row.service, row.serviceFlag);
+};
 onMounted(() => {
   loadModifyForm();
   getOrderInfoServiceList();

src/views/family/operate/order/components/ModifyServiceParameter.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="app-container">
+    <el-dialog
+      class="com-dialog"
+      v-model="modifyServiceFlag"
+      title="业务参数列表"
+      width="1000"
+    >
+      <div style="margin-bottom: 10px">
+        <el-button type="primary" :icon="Plus" @click="addRow">新增</el-button>
+      </div>
+      <div class="any-table">
+        <el-form :model="tableData" ref="ruleFormRef" v-loading="loading">
+          <el-table :data="tableData">
+            <el-table-column
+              label="业务参数名称"
+              prop="argsName"
+              align="center"
+            >
+              <template #default="scope">
+                <el-form-item
+                  :prop="scope.row.argsName"
+                  style="margin-bottom: 0"
+                >
+                  <el-input v-model="scope.row.argsName" />
+                </el-form-item>
+              </template>
+            </el-table-column>
+            <el-table-column
+              label="业务参数新值"
+              prop="argsValueNew"
+              align="center"
+            >
+              <template #default="scope">
+                <el-form-item
+                  :prop="scope.row.argsValueNew"
+                  style="margin-bottom: 0"
+                >
+                  <el-input v-model="scope.row.argsValueNew" />
+                </el-form-item>
+              </template>
+            </el-table-column>
+            <el-table-column
+              label="业务参数旧值"
+              prop="argsValueOld"
+              align="center"
+            >
+              <template #default="scope">
+                <el-form-item
+                  :prop="scope.row.argsValueOld"
+                  style="margin-bottom: 0"
+                >
+                  <el-input v-model="scope.row.argsValueOld" />
+                </el-form-item>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" width="100">
+              <template #default="scope">
+                <el-form-item style="margin-bottom: 0">
+                  <el-button
+                    type="danger"
+                    :icon="Delete"
+                    link
+                    @click="deleteRow(scope.$index)"
+                    >删除
+                  </el-button>
+                </el-form-item>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-form>
+      </div>
+      <template #footer>
+        <el-button type="primary" @click="submitForm">确定 </el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { OrderServiceVO } from "@/api/order/types";
+import { orderServiceVOPage, updateOrderServiceParameter } from "@/api/order";
+import { Delete, Plus } from "@element-plus/icons-vue";
+import { FormInstance, FormRules } from "element-plus";
+
+const ruleFormRef = ref<FormInstance>();
+const modifyServiceFlag = ref<boolean>(false);
+const loading = ref<boolean>(false);
+const tableData = ref<OrderServiceVO[]>([]);
+const total = ref<number>(0);
+const orderId = ref<number>(0);
+const service = ref<string>("");
+const serviceFlag = ref<string>("");
+const queryPage = ref<PageQuery>({
+  pageNum: 1,
+  pageSize: 10,
+});
+
+const openModify = (
+  orderId_?: number,
+  service_?: string,
+  serviceFlag_?: string
+) => {
+  orderId.value = orderId_;
+  service.value = service_;
+  serviceFlag.value = serviceFlag_;
+  modifyServiceFlag.value = true;
+  getOrderServicePage();
+};
+defineExpose({ openModify });
+const getOrderServicePage = () => {
+  loading.value = true;
+  orderServiceVOPage(orderId.value, service.value, queryPage.value)
+    .then(({ data }) => {
+      tableData.value = data.list;
+      total.value = data.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+const addRow = () => {
+  tableData.value.push({ orderId: orderId.value, service: service.value });
+};
+const deleteRow = (index: number) => {
+  if (tableData.value.length === 1) {
+    ElMessage({
+      message: "不能删除所有数据",
+      duration: 1000,
+      type: "error",
+    });
+    return;
+  }
+  tableData.value.splice(index, 1);
+};
+const emit = defineEmits(["success"]);
+const submitForm = () => {
+  let flag = true;
+  for (let i = 0; i < tableData.value.length; i++) {
+    let obj = tableData.value[i];
+    if (obj.argsName === undefined) {
+      ElMessage({
+        message: "请填写参数名称",
+        duration: 1500,
+        type: "error",
+      });
+      flag = false;
+      break;
+    } else if (obj.argsValueNew === undefined) {
+      ElMessage({
+        message: "请填写参数值(新)",
+        duration: 1500,
+        type: "error",
+      });
+      flag = false;
+      break;
+    }
+  }
+  if (flag) {
+    loading.value = true;
+    updateOrderServiceParameter(
+      orderId.value,
+      service.value,
+      serviceFlag.value,
+      tableData.value
+    )
+      .then(() => {
+        ElMessage({
+          message: "操作成功",
+          duration: 1000,
+          type: "success",
+        });
+        emit("success");
+        modifyServiceFlag.value = false;
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+  }
+};
+</script>
+
+<style scoped></style>

src/views/family/operate/order/components/OrderInfoEdit.vue

@@ -307,7 +307,16 @@
           </div>
           <div class="any-table">
             <el-table :data="orderServiceList">
-              <el-table-column label="业务名称" prop="service" align="center" />
+              <el-table-column label="业务名称" prop="service" align="center">
+                <template #default="scope">
+                  <el-button
+                    type="primary"
+                    @click="openServiceList(scope.row.service)"
+                    link
+                    >{{ scope.row.service }}</el-button
+                  >
+                </template>
+              </el-table-column>
               <el-table-column
                 label="业务变更信息"
                 prop="serviceFlag"
@@ -325,6 +334,7 @@
         </div>
       </el-scrollbar>
     </el-card>
+    <order-service-parameter-table ref="serviceParameterRef" />
   </div>
 </template>
 
@@ -337,6 +347,7 @@ import {
   updateOrderStatus,
 } from "@/api/order";
 import { InfoFilled } from "@element-plus/icons-vue";
+import OrderServiceParameterTable from "@/views/family/operate/order/components/OrderServiceParameterTable.vue";
 
 const route = useRoute();
 const router = useRouter();
@@ -350,6 +361,7 @@ const queryPage = ref<PageQuery>({
 });
 const total = ref<number>(0);
 const orderServiceList = ref<OrderInfoServiceVO[]>([]);
+const serviceParameterRef = ref();
 const getData = () => {
   loading.value = true;
   findOrderInfoById(orderId)
@@ -393,6 +405,9 @@ const execute = () => {
 const skipModifyOrder = () => {
   router.push({ path: `/resources/modify-order/${orderId}` });
 };
+const openServiceList = (service: string) => {
+  serviceParameterRef.value.openParameter(orderId, service);
+};
 onMounted(() => {
   getData();
   getOrderInfoServiceList();

src/views/family/operate/order/components/OrderServiceParameterTable.vue

@@ -0,0 +1,69 @@
+<template>
+  <el-dialog
+    class="com-dialog"
+    v-model="parameterFlag"
+    title="业务参数列表"
+    align-center
+    width="900"
+  >
+    <div class="any-table">
+      <el-table :data="tableData" v-loading="loading">
+        <el-table-column label="业务参数名称" prop="argsName" align="center" />
+        <el-table-column
+          label="业务参数新值"
+          prop="argsValueNew"
+          align="center"
+        />
+        <el-table-column
+          label="业务参数旧值"
+          prop="argsValueOld"
+          align="center"
+        />
+      </el-table>
+    </div>
+    <pagination
+      v-if="total > 0"
+      v-model:total="total"
+      v-model:page="queryPage.pageNum"
+      v-model:limit="queryPage.pageSize"
+      @pagination="getOrderServicePage"
+    />
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import { OrderServiceVO } from "@/api/order/types";
+import { orderServiceVOPage } from "@/api/order";
+
+const parameterFlag = ref<boolean>(false);
+const loading = ref<boolean>(false);
+const tableData = ref<OrderServiceVO[]>([]);
+const total = ref<number>(0);
+const orderId = ref<number>(0);
+const service = ref<string>("");
+const queryPage = ref<PageQuery>({
+  pageNum: 1,
+  pageSize: 10,
+});
+const openParameter = (orderId_: number, service_: string) => {
+  orderId.value = orderId_;
+  service.value = service_;
+  parameterFlag.value = true;
+  getOrderServicePage();
+};
+defineExpose({ openParameter });
+
+const getOrderServicePage = () => {
+  loading.value = true;
+  orderServiceVOPage(orderId.value, service.value, queryPage.value)
+    .then(({ data }) => {
+      tableData.value = data.list;
+      total.value = data.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+</script>
+
+<style scoped></style>