fix：海信互通立交页面

src/views/xj/hisense/inter-change/components/add-inter.vue

@@ -2,12 +2,51 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 16:44:44
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-13 11:16:16
+ * @LastEditTime: 2025-02-14 10:13:56
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
  * @Description: 海信-互通立交-新增/编辑
 -->
 <template>
-  <div class="dialog-content"></div>
+  <div class="dialog-content">
+    <el-form class="addForm" ref="addInterForm" :model="addInterForm" :rules="rules" label-width="8rem">
+      <el-row :gutter="24">
+        <el-col :span="24">
+          <el-form-item label="互通立交名称：" prop="name">
+            <el-input v-model="addInterForm.name" placeholder="请填写名称" style="width: 100%" clearable>
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="24">
+        <el-col :span="24">
+          <el-form-item label="互通立交Id：" prop="crossId">
+            <el-input v-model="addInterForm.crossId" placeholder="请填写code" style="width: 100%" clearable>
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="24">
+        <el-col :span="24">
+          <el-form-item label="code：" prop="code">
+            <el-input v-model="addInterForm.code" placeholder="请填写code" style="width: 100%" clearable>
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="24">
+        <el-col :span="24">
+          <el-form-item label="桩号：" prop="stake">
+            <el-input v-model="addInterForm.stake" placeholder="请填写桩号" style="width: 100%" clearable>
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -15,23 +54,97 @@ import { add, updata } from '@/api/xj/hisense/inter-change'
 
 export default {
   name: "AddInter",
+  props: {
+    // 接收父组件传过来的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
   data() {
     return {
-
+      // 新增表单
+      addInterForm: {
+        name: "",
+        crossId: "",
+        code: "",
+        stake: "",
+        type: 0,
+      },
+      // 表单校验规则
+      rules: {
+        name: [{ required: true, message: "请填写名称", trigger: "blur" }],
+        crossId: [{ required: true, message: "请填写互通立交id", trigger: "blur" }],
+        code: [{ required: true, message: "请填写code", trigger: "blur" }],
+        stake: [{ required: true, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+      }
     }
   },
-  methods: {
+  watch: {
-
+    dialogItem: {
+      handler(val) {
+        if (val) {
+          this.addInterForm = val
+        }
+      }, immediate: true, deep: true
+    }
   },
   mounted() {
 
+  },
+  methods: {
+    /**
+     * @description: 点击确定事件
+     * @return {*}
+     */
+    submitForm() {
+      this.$refs.addInterForm.validate((valid) => {
+        if (valid) {
+          const data = {
+            ...this.addInterForm,
+          };
+          if (this.addInterForm.id) {
+            updata(data).then(({ code }) => {
+              if (code === 200) {
+                this.$modal.msgSuccess("更新成功");
+                this.$emit("cancel");
               }
+            });
+          } else {
+            add(data).then(({ code }) => {
+              if (code === 200) {
+                this.$modal.msgSuccess("新增成功");
+                this.$emit("cancel");
+              }
+            });
+          }
+        }
+      });
+    },
+
+    /**
+     * @description: 点击取消事件
+     * @return {*}
+     */
+    cancel() {
+      this.$emit("cancel");
+    },
+  },
 }
 </script>
 
 <style lang="scss" scoped>
 .dialog-content {
   width: 100%;
-  height: 40rem;
+  // height: 20rem;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
 }
 </style>

src/views/xj/hisense/inter-change/index.vue

@@ -2,24 +2,24 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 13:49:47
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-13 11:30:18
+ * @LastEditTime: 2025-02-14 10:21:09
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\index.vue
  * @Description: 海信-互通立交
 -->
 <template>
   <div class="content">
-    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="5rem">
+    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="7rem">
-      <el-form-item label="道路名称" prop="segmentId">
+      <el-form-item label="互通立交名称" prop="segmentId">
-        <el-select v-model="interForm.segmentId" placeholder="请输入企业名称" filterable remote clearable reserve-keyword
+        <el-select v-model="interForm.segmentId" placeholder="请输入互通立交名称" filterable remote clearable reserve-keyword
-          :filter-method="handleRemoteMethod">
+          :filter-method="handleRemoteMethod" @change="handleRemoteMethod">
           <el-option v-for="(item, index) in segmentList" :key="`enterprise-name-${index}`" :label="item.label"
-            :value="item.value"></el-option> </el-select>
+            :value="item.label"></el-option> </el-select>
       </el-form-item>
-      <el-form-item label="病害类型" prop="defectType">
+      <!-- <el-form-item label="病害类型" prop="defectType">
         <el-select v-model="interForm.defectType" placeholder="请选择病害" clearable>
           <el-option v-for="item in tableDefect" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
-      </el-form-item>
+      </el-form-item> -->
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -30,11 +30,11 @@
         <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
         </el-button>
       </el-col>
-      <el-col :span="1.5">
+      <!-- <el-col :span="1.5">
         <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
           @click="handleDelete(null)">删除
         </el-button>
-      </el-col>
+      </el-col> -->
     </el-row>
     <!-- 表格 -->
     <el-table ref="setupTable" :data="interList" v-loading="loading" @selection-change="handleSelectionChange"
@@ -42,7 +42,7 @@
       <!-- <el-table-column type="selection" width="55" align="center" /> -->
       <el-table-column type="index" label="序号"> </el-table-column>
       <el-table-column label="名称" align="center" prop="name" />
-      <el-table-column label="互通立交Id" align="center" prop="crossId">
+      <el-table-column label="互通立交Id(海信)" align="center" prop="crossId">
       </el-table-column>
       <el-table-column label="桩号" align="center" prop="stake" />
       <el-table-column label="code" align="center" prop="code" />
@@ -57,14 +57,14 @@
     </el-table>
     <!-- 分页组件 -->
     <div class="pagination-part">
-      <el-pagination background :current-page.sync="pagination.page" @current-change="handleCurrentChange"
+      <el-pagination background :current-page.sync="pagination.pageNum" @current-change="handleCurrentChange"
-        :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.size" @size-change="handleSizeChange"
+        :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.pageSize" @size-change="handleSizeChange"
         layout="total, sizes, prev, pager, next, jumper" :total="tableTotal">
       </el-pagination>
     </div>
 
     <!-- 新增弹窗 -->
-    <el-dialog title="预警设置" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
+    <el-dialog :title="title" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
       destroy-on-close>
       <add-inter v-if="addVisible" :tableDefect="tableDefect" :segmentList="segmentList" :dialogItem="dialogItem"
         @cancel="addCancel"></add-inter>
@@ -73,7 +73,7 @@
 </template>
 
 <script>
-import { getList, getDropDown } from "@/api/xj/hisense/inter-change"
+import { getList, getDropDown, delData } from "@/api/xj/hisense/inter-change"
 import AddInter from "./components/add-inter.vue"
 
 export default {
@@ -106,10 +106,12 @@ export default {
       tableTotal: 0,
       // 分页-页数页码
       pagination: {
-        page: 1,
+        pageNum: 1,
-        size: 10,
+        pageSize: 10,
       },
 
+      // 弹窗标题
+      title: "新增",
       // 新增弹窗显隐控制
       addVisible: false,
       // 传弹窗数据
@@ -136,7 +138,7 @@ export default {
      * @return {*}
      */
     getDownList() {
-      getDropDown({ name: "" }).then(({ code, data }) => {
+      getDropDown({ name: this.interForm.segmentId }).then(({ code, data }) => {
         if (code === 200) {
           this.segmentList = data
         }
@@ -149,7 +151,7 @@ export default {
      */
     handleQuery() {
       this.searchForm = JSON.parse(JSON.stringify(this.interForm));
-      this.pagination.page = 1;
+      this.pagination.pageNum = 1;
       this.getTableData();
     },
 
@@ -189,7 +191,7 @@ export default {
       getList(dataItem).then(({ rows, code, total }) => {
         if (code === 200) {
           this.interList = rows;
-          this.total = total;
+          this.tableTotal = total;
         }
       })
     },
@@ -208,8 +210,9 @@ export default {
      * @param {*}
      * @return {*}
      */
-    handleUpdate() {
+    handleUpdate(value) {
-
+      this.addVisible = true;
+      this.dialogItem = value;
     },
 
     /**
@@ -218,7 +221,7 @@ export default {
      * @return {*}
      */
     handleDelete(row) {
-      const checkIds = row ? row.id : this.checkIds;
+      // const checkIds = row ? row.id : this.checkIds;
       // if (!checkIds.length) {
       //   this.$modal.msgWarning("请选择要删除的记录");
       //   return;
@@ -226,7 +229,7 @@ export default {
       this.$modal
         .confirm(`是否确认删除选中的1条记录？`)
         .then(() => {
-          return delWarnSetup(checkIds);
+          return delData(row.id);
         })
         .then(() => {
           this.getTableData();
@@ -242,7 +245,7 @@ export default {
      * @return {*}
      */
     handleCurrentChange(arg) {
-      this.pagination.page = arg;
+      this.pagination.pageNum = arg;
       this.getTableData();
     },
 
@@ -252,9 +255,19 @@ export default {
      * @return {*}
      */
     handleSizeChange(arg) {
-      this.pagination.size = arg;
+      this.pagination.pageSize = arg;
       this.getTableData();
     },
+
+    /**
+   * @description: 关闭弹窗事件
+   * @param {*}
+   * @return {*}
+   */
+    addCancel() {
+      this.addVisible = false;
+      this.dialogItem = {};
+    }
   },
 }
 </script>