From fdfe6d2bc82ee09d56b7e6e2aa841db39c6ab014 Mon Sep 17 00:00:00 2001
From: SunTao <328867980@qq.com>
Date: Tue, 18 Feb 2025 09:04:07 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=A1=A5=E6=A2=81=20=E9=81=93?=
 =?UTF-8?q?=E8=B7=AF=20=E5=B7=A5=E5=8C=BA=20=E5=B7=A5=E4=BD=9C=E7=AB=99=20?=
 =?UTF-8?q?=E9=9A=A7=E9=81=93=E6=96=B0=E5=A2=9E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/xj/hisense/bridge.js                  |  53 ++++
 src/api/xj/hisense/route.js                   |  53 ++++
 src/api/xj/hisense/station.js                 |  53 ++++
 src/api/xj/hisense/task-area.js               |   4 +-
 src/api/xj/hisense/tunnel.js                  |  53 ++++
 .../hisense/bridge/components/add-bridge.vue  | 178 ++++++++++++
 src/views/xj/hisense/bridge/index.vue         | 262 +++++++++++++++++-
 .../components/add-route.vue                  | 162 +++++++++++
 .../xj/hisense/route-information/index.vue    | 258 ++++++++++++++++-
 .../station/components/add-station.vue        | 152 ++++++++++
 src/views/xj/hisense/station/index.vue        | 258 ++++++++++++++++-
 .../hisense/tunnel/components/add-tunnel.vue  | 152 ++++++++++
 src/views/xj/hisense/tunnel/index.vue         | 258 ++++++++++++++++-
 13 files changed, 1885 insertions(+), 11 deletions(-)
 create mode 100644 src/api/xj/hisense/bridge.js
 create mode 100644 src/api/xj/hisense/route.js
 create mode 100644 src/api/xj/hisense/station.js
 create mode 100644 src/api/xj/hisense/tunnel.js
 create mode 100644 src/views/xj/hisense/bridge/components/add-bridge.vue
 create mode 100644 src/views/xj/hisense/route-information/components/add-route.vue
 create mode 100644 src/views/xj/hisense/station/components/add-station.vue
 create mode 100644 src/views/xj/hisense/tunnel/components/add-tunnel.vue

diff --git a/src/api/xj/hisense/bridge.js b/src/api/xj/hisense/bridge.js
new file mode 100644
index 0000000..3a53cfc
--- /dev/null
+++ b/src/api/xj/hisense/bridge.js
@@ -0,0 +1,53 @@
+/*
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-13 09:11:50
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 15:52:12
+ * @FilePath: \znxjxt-ui\src\api\xj\hisense\inter-change.js
+ * @Description: 海信-桥梁
+ */
+import request from "@/utils/request";
+
+// 获取列表数据
+export function getList(query) {
+  return request({
+    url: "/hxBridge/page",
+    method: "get",
+    params: query,
+  });
+}
+
+// 新增数据
+export function add(data) {
+  return request({
+    url: "/hxBridge",
+    method: "post",
+    data,
+  });
+}
+
+// 更新数据
+export function updata(data) {
+  return request({
+    url: "/hxBridge",
+    method: "put",
+    data,
+  });
+}
+
+// 删除数据
+export function delData(id) {
+  return request({
+    url: `/hxBridge/${id}`,
+    method: "delete",
+  });
+}
+
+// 获取互通立交下拉数据
+export function getDropDown(params) {
+  return request({
+    url: "/hxBridge/dropDown",
+    method: "get",
+    params,
+  });
+}
diff --git a/src/api/xj/hisense/route.js b/src/api/xj/hisense/route.js
new file mode 100644
index 0000000..3befb07
--- /dev/null
+++ b/src/api/xj/hisense/route.js
@@ -0,0 +1,53 @@
+/*
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-13 09:11:50
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 16:30:45
+ * @FilePath: \znxjxt-ui\src\api\xj\hisense\inter-change.js
+ * @Description: 海信-收费站
+ */
+import request from "@/utils/request";
+
+// 获取列表数据
+export function getList(query) {
+  return request({
+    url: "/hxroad/page",
+    method: "get",
+    params: query,
+  });
+}
+
+// 新增数据
+export function add(data) {
+  return request({
+    url: "/hxroad",
+    method: "post",
+    data,
+  });
+}
+
+// 更新数据
+export function updata(data) {
+  return request({
+    url: "/hxroad",
+    method: "put",
+    data,
+  });
+}
+
+// 删除数据
+export function delData(id) {
+  return request({
+    url: `/hxroad/${id}`,
+    method: "delete",
+  });
+}
+
+// 获取互通立交下拉数据
+export function getDropDown(params) {
+  return request({
+    url: "/hxroad/dropDown",
+    method: "get",
+    params,
+  });
+}
diff --git a/src/api/xj/hisense/station.js b/src/api/xj/hisense/station.js
new file mode 100644
index 0000000..6549d7f
--- /dev/null
+++ b/src/api/xj/hisense/station.js
@@ -0,0 +1,53 @@
+/*
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-13 09:11:50
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-14 15:35:33
+ * @FilePath: \znxjxt-ui\src\api\xj\hisense\inter-change.js
+ * @Description: 海信-收费站
+ */
+import request from "@/utils/request";
+
+// 获取列表数据
+export function getList(query) {
+  return request({
+    url: "/hxstation/page",
+    method: "get",
+    params: query,
+  });
+}
+
+// 新增数据
+export function add(data) {
+  return request({
+    url: "/hxstation",
+    method: "post",
+    data,
+  });
+}
+
+// 更新数据
+export function updata(data) {
+  return request({
+    url: "/hxstation",
+    method: "put",
+    data,
+  });
+}
+
+// 删除数据
+export function delData(id) {
+  return request({
+    url: `/hxstation/${id}`,
+    method: "delete",
+  });
+}
+
+// 获取互通立交下拉数据
+export function getDropDown(params) {
+  return request({
+    url: "/hxstation/dropDown",
+    method: "get",
+    params,
+  });
+}
diff --git a/src/api/xj/hisense/task-area.js b/src/api/xj/hisense/task-area.js
index 84b6543..aab1196 100644
--- a/src/api/xj/hisense/task-area.js
+++ b/src/api/xj/hisense/task-area.js
@@ -2,9 +2,9 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-13 09:11:50
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-14 15:35:33
+ * @LastEditTime: 2025-02-17 14:25:08
  * @FilePath: \znxjxt-ui\src\api\xj\hisense\inter-change.js
- * @Description: 海信-工作站
+ * @Description: 海信-工区
  */
 import request from "@/utils/request";
 
diff --git a/src/api/xj/hisense/tunnel.js b/src/api/xj/hisense/tunnel.js
new file mode 100644
index 0000000..fcc1089
--- /dev/null
+++ b/src/api/xj/hisense/tunnel.js
@@ -0,0 +1,53 @@
+/*
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-13 09:11:50
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-14 15:35:33
+ * @FilePath: \znxjxt-ui\src\api\xj\hisense\inter-change.js
+ * @Description: 海信-收费站
+ */
+import request from "@/utils/request";
+
+// 获取列表数据
+export function getList(query) {
+  return request({
+    url: "/hxtunnel/page",
+    method: "get",
+    params: query,
+  });
+}
+
+// 新增数据
+export function add(data) {
+  return request({
+    url: "/hxtunnel",
+    method: "post",
+    data,
+  });
+}
+
+// 更新数据
+export function updata(data) {
+  return request({
+    url: "/hxtunnel",
+    method: "put",
+    data,
+  });
+}
+
+// 删除数据
+export function delData(id) {
+  return request({
+    url: `/hxtunnel/${id}`,
+    method: "delete",
+  });
+}
+
+// 获取互通立交下拉数据
+export function getDropDown(params) {
+  return request({
+    url: "/hxtunnel/dropDown",
+    method: "get",
+    params,
+  });
+}
diff --git a/src/views/xj/hisense/bridge/components/add-bridge.vue b/src/views/xj/hisense/bridge/components/add-bridge.vue
new file mode 100644
index 0000000..043c512
--- /dev/null
+++ b/src/views/xj/hisense/bridge/components/add-bridge.vue
@@ -0,0 +1,178 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-12 16:44:44
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 16:19:52
+ * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
+ * @Description: 海信-收费站-新增/编辑
+-->
+<template>
+  <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="bridgeName">
+            <el-input v-model="addInterForm.bridgeName" 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="bridgeId">
+            <el-input v-model="addInterForm.bridgeId" 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="bridgeCode">
+            <el-input v-model="addInterForm.bridgeCode" 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="bridgeStartStake">
+            <el-input v-model="addInterForm.bridgeStartStake" 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="终止桩号：" prop="bridgeEndStake">
+            <el-input v-model="addInterForm.bridgeEndStake" 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="桩号：" prop="bridgeStake">
+            <el-input v-model="addInterForm.bridgeStake" 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>
+import { add, updata } from '@/api/xj/hisense/bridge'
+
+export default {
+  name: "AddBridge",
+  props: {
+    // 接收父组件传过来的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 新增表单
+      addInterForm: {
+        bridgeName: "",
+        bridgeId: "",
+        bridgeCode: "",
+        bridgeStartStake: "",
+        bridgeEndStake: "",
+        bridgeStake: "",
+      },
+      // 表单校验规则
+      rules: {
+        bridgeName: [{ required: true, message: "请填写名称", trigger: "blur" }],
+        bridgeId: [{ required: true, message: "请填写桥梁id", trigger: "blur" }, {
+          pattern: /^[1-9]\d*$/,
+          message: "请输入正整数",
+        }],
+        bridgeCode: [{ required: true, message: "请填写code", trigger: "blur" }],
+        bridgeStartStake: [{ required: false, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+        bridgeEndStake: [{ required: false, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+        bridgeStake: [{ required: false, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+      }
+    }
+  },
+  watch: {
+    dialogItem: {
+      handler(val) {
+        if (val) {
+          this.addInterForm = JSON.parse(JSON.stringify(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: 20rem;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/xj/hisense/bridge/index.vue b/src/views/xj/hisense/bridge/index.vue
index 46b0057..f6b6d06 100644
--- a/src/views/xj/hisense/bridge/index.vue
+++ b/src/views/xj/hisense/bridge/index.vue
@@ -2,24 +2,272 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 14:35:34
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-12 14:38:15
+ * @LastEditTime: 2025-02-17 16:01:33
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\bridge\index.vue
  * @Description: 海信-桥梁
 -->
 <template>
-  <div class="content">海信桥梁</div>
+  <div class="content">
+    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="7rem">
+      <el-form-item label="桥梁名称" prop="name">
+        <el-select v-model="interForm.name" placeholder="请输入桥梁名称" filterable remote clearable reserve-keyword
+          :filter-method="handleRemoteMethod" @change="handleRemoteMethod">
+          <el-option v-for="(item, index) in segmentList" :key="`enterprise-name-${index}`" :label="item.label"
+            :value="item.label"></el-option> </el-select>
+      </el-form-item>
+      <!-- <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-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>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
+        </el-button>
+      </el-col>
+      <!-- <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-row>
+    <!-- 表格 -->
+    <el-table ref="setupTable" :data="interList" v-loading="loading" @selection-change="handleSelectionChange"
+      style="width: 100%">
+      <!-- <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="bridgeName" />
+      <el-table-column label="桥梁Id(海信)" align="center" prop="bridgeId">
+      </el-table-column>
+      <el-table-column label="桥梁code" align="center" prop="bridgeCode" />
+      <el-table-column label="起始桩号" align="center" prop="bridgeStartStake" />
+      <el-table-column label="桩号" align="center" prop="bridgeStake" />
+      <el-table-column label="终止桩号" align="center" prop="bridgeEndStake" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页组件 -->
+    <div class="pagination-part">
+      <el-pagination background :current-page.sync="pagination.pageNum" @current-change="handleCurrentChange"
+        :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="title" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
+      destroy-on-close>
+      <add-bridge v-if="addVisible" :segmentList="segmentList" :dialogItem="dialogItem"
+        @cancel="addCancel"></add-bridge>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
+import { getList, getDropDown, delData } from "@/api/xj/hisense/bridge"
+import AddBridge from "./components/add-bridge.vue"
+
 export default {
-  name: "Bridge",
+  name: "Station",
+  components: {
+    AddBridge,
+  },
   data() {
     return {
+      // 搜索绑定菜单
+      interForm: {
+        name: "",
+      },
+      searchForm: {},
+      // 路段下拉数据
+      segmentList: [],
+
+      // 列表数据
+      interList: [],
+      // 列表加载状态
+      loading: false,
+      // 列表勾选框数据
+      checkIds: [],
+      // 非多个禁用
+      multiple: true,
+      // 分页-列表总数
+      tableTotal: 0,
+      // 分页-页数页码
+      pagination: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      // 弹窗标题
+      title: "新增",
+      // 新增弹窗显隐控制
+      addVisible: false,
+      // 传弹窗数据
+      dialogItem: {},
     }
   },
   mounted() {
+    this.getTableData()
+    this.getDownList()
   },
   methods: {
+    /**
+     * @description: 模糊搜索
+     * @param {*} str 模糊搜索字段
+     * @return {*}
+     */
+    handleRemoteMethod(str) {
+      this.interForm.name = str;
+      this.getDownList();
+    },
+    /**
+     * @description: 获取下拉数据
+     * @param {*}
+     * @return {*}
+     */
+    getDownList() {
+      getDropDown({ name: this.interForm.name }).then(({ code, data }) => {
+        if (code === 200) {
+          this.segmentList = data
+        }
+      })
+    },
+    /**
+     * @description: 点击搜索
+     * @param {*}
+     * @return {*}
+     */
+    handleQuery() {
+      this.searchForm = JSON.parse(JSON.stringify(this.interForm));
+      this.pagination.pageNum = 1;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 点击重置
+     * @param {*}
+     * @return {*}
+     */
+    resetQuery() {
+      this.interForm = {
+        name: "",
+        defectType: "",
+      }
+      this.searchForm = {}
+    },
+
+    /**
+     * @description: 点击新增事件
+     * @param {*}
+     * @return {*}
+     */
+    handleAdd() {
+      this.addVisible = true;
+      this.dialogItem = {};
+    },
+
+    /**
+     * @description: 获取列表数据
+     * @param {*}
+     * @return {*}
+     */
+    getTableData() {
+      const dataItem = {
+        ...this.searchForm,
+        ...this.pagination,
+      }
+      getList(dataItem).then(({ rows, code, total }) => {
+        if (code === 200) {
+          this.interList = rows;
+          this.tableTotal = total;
+        }
+      })
+    },
+    /**
+ * @description: 列表选择改变事件
+ * @param {*}
+ * @return {*}
+ */
+    handleSelectionChange(selection) {
+      this.checkIds = selection.map((item) => item.id);
+      this.multiple = !selection.length;
+    },
+
+    /**
+     * @description: 点击编辑事件
+     * @param {*}
+     * @return {*}
+     */
+    handleUpdate(value) {
+      this.addVisible = true;
+      this.dialogItem = value;
+    },
+
+    /**
+     * @description: 点击删除事件
+     * @param {*}
+     * @return {*}
+     */
+    handleDelete(row) {
+      // const checkIds = row ? row.id : this.checkIds;
+      // if (!checkIds.length) {
+      //   this.$modal.msgWarning("请选择要删除的记录");
+      //   return;
+      // }
+      this.$modal
+        .confirm(`是否确认删除选中的1条记录？`)
+        .then(() => {
+          return delData(row.id);
+        })
+        .then(() => {
+          this.getTableData();
+          // this.$refs.defectTable.clearSelection();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => { });
+    },
+
+    /**
+     * @description: 切换分页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleCurrentChange(arg) {
+      this.pagination.pageNum = arg;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 切换每条/页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleSizeChange(arg) {
+      this.pagination.pageSize = arg;
+      this.getTableData();
+    },
+
+    /**
+   * @description: 关闭弹窗事件
+   * @param {*}
+   * @return {*}
+   */
+    addCancel() {
+      this.addVisible = false;
+      this.dialogItem = {};
+      this.getTableData();
+    }
   },
 }
 </script>
@@ -31,4 +279,12 @@ export default {
   padding: 1rem;
   overflow-y: auto;
 }
+
+/* 分页样式 */
+.pagination-part {
+  width: 100%;
+  display: flex;
+  padding-top: 1rem;
+  justify-content: flex-end;
+}
 </style>
diff --git a/src/views/xj/hisense/route-information/components/add-route.vue b/src/views/xj/hisense/route-information/components/add-route.vue
new file mode 100644
index 0000000..393f9ae
--- /dev/null
+++ b/src/views/xj/hisense/route-information/components/add-route.vue
@@ -0,0 +1,162 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-12 16:44:44
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 17:11:16
+ * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
+ * @Description: 海信-收费站-新增/编辑
+-->
+<template>
+  <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="roadName">
+            <el-input v-model="addInterForm.roadName" 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="roadId">
+            <el-input v-model="addInterForm.roadId" placeholder="请填写id" 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="roadCode">
+            <el-input v-model="addInterForm.roadCode" 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="roadStartStake">
+            <el-input v-model="addInterForm.roadStartStake" 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="终止桩号：" prop="roadEndStake">
+            <el-input v-model="addInterForm.roadEndStake" 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>
+import { add, updata } from '@/api/xj/hisense/route'
+
+export default {
+  name: "AddRoute",
+  props: {
+    // 接收父组件传过来的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 新增表单
+      addInterForm: {
+        roadName: "",
+        roadId: "",
+        roadCode: "",
+        roadStartStake: "",
+        roadEndStake: "",
+      },
+      // 表单校验规则
+      rules: {
+        roadName: [{ required: true, message: "请填写名称", trigger: "blur" }],
+        roadCode: [{ required: true, message: "请填写code", trigger: "blur" }],
+        roadId: [{ required: true, message: "请填写道路线id", trigger: "blur" }],
+        roadStartStake: [{ required: true, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+        roadEndStake: [{ required: true, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+      }
+    }
+  },
+  watch: {
+    dialogItem: {
+      handler(val) {
+        if (val) {
+          this.addInterForm = JSON.parse(JSON.stringify(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: 20rem;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/xj/hisense/route-information/index.vue b/src/views/xj/hisense/route-information/index.vue
index 3c20e28..64a6c91 100644
--- a/src/views/xj/hisense/route-information/index.vue
+++ b/src/views/xj/hisense/route-information/index.vue
@@ -2,24 +2,270 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 14:40:41
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-12 14:40:50
+ * @LastEditTime: 2025-02-17 16:50:12
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\route-information\index.vue
  * @Description: 海信-道路信息
 -->
 <template>
-  <div class="content">海信道路信息</div>
+  <div class="content">
+    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="7rem">
+      <el-form-item label="收费站名称" prop="name">
+        <el-select v-model="interForm.name" placeholder="请输入收费站名称" filterable remote clearable reserve-keyword
+          :filter-method="handleRemoteMethod" @change="handleRemoteMethod">
+          <el-option v-for="(item, index) in segmentList" :key="`enterprise-name-${index}`" :label="item.label"
+            :value="item.label"></el-option> </el-select>
+      </el-form-item>
+      <!-- <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-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>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
+        </el-button>
+      </el-col>
+      <!-- <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-row>
+    <!-- 表格 -->
+    <el-table ref="setupTable" :data="interList" v-loading="loading" @selection-change="handleSelectionChange"
+      style="width: 100%">
+      <!-- <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="roadName" />
+      <el-table-column label="道路线Id(海信)" align="center" prop="roadId">
+      </el-table-column>
+      <el-table-column label="道路线code" align="center" prop="roadCode" />
+      <el-table-column label="起始桩号" align="center" prop="roadStartStake" />
+      <el-table-column label="终止桩号" align="center" prop="roadEndStake" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页组件 -->
+    <div class="pagination-part">
+      <el-pagination background :current-page.sync="pagination.pageNum" @current-change="handleCurrentChange"
+        :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="title" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
+      destroy-on-close>
+      <add-route v-if="addVisible" :segmentList="segmentList" :dialogItem="dialogItem" @cancel="addCancel"></add-route>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
+import { getList, getDropDown, delData } from "@/api/xj/hisense/route"
+import AddRoute from "./components/add-route.vue"
+
 export default {
   name: "RouteInformation",
+  components: {
+    AddRoute,
+  },
   data() {
     return {
+      // 搜索绑定菜单
+      interForm: {
+        name: "",
+      },
+      searchForm: {},
+      // 路段下拉数据
+      segmentList: [],
+
+      // 列表数据
+      interList: [],
+      // 列表加载状态
+      loading: false,
+      // 列表勾选框数据
+      checkIds: [],
+      // 非多个禁用
+      multiple: true,
+      // 分页-列表总数
+      tableTotal: 0,
+      // 分页-页数页码
+      pagination: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      // 弹窗标题
+      title: "新增",
+      // 新增弹窗显隐控制
+      addVisible: false,
+      // 传弹窗数据
+      dialogItem: {},
     }
   },
   mounted() {
+    this.getTableData()
+    this.getDownList()
   },
   methods: {
+    /**
+     * @description: 模糊搜索
+     * @param {*} str 模糊搜索字段
+     * @return {*}
+     */
+    handleRemoteMethod(str) {
+      this.interForm.name = str;
+      this.getDownList();
+    },
+    /**
+     * @description: 获取下拉数据
+     * @param {*}
+     * @return {*}
+     */
+    getDownList() {
+      getDropDown({ name: this.interForm.name }).then(({ code, data }) => {
+        if (code === 200) {
+          this.segmentList = data
+        }
+      })
+    },
+    /**
+     * @description: 点击搜索
+     * @param {*}
+     * @return {*}
+     */
+    handleQuery() {
+      this.searchForm = JSON.parse(JSON.stringify(this.interForm));
+      this.pagination.pageNum = 1;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 点击重置
+     * @param {*}
+     * @return {*}
+     */
+    resetQuery() {
+      this.interForm = {
+        name: "",
+        defectType: "",
+      }
+      this.searchForm = {}
+    },
+
+    /**
+     * @description: 点击新增事件
+     * @param {*}
+     * @return {*}
+     */
+    handleAdd() {
+      this.addVisible = true;
+      this.dialogItem = {};
+    },
+
+    /**
+     * @description: 获取列表数据
+     * @param {*}
+     * @return {*}
+     */
+    getTableData() {
+      const dataItem = {
+        ...this.searchForm,
+        ...this.pagination,
+      }
+      getList(dataItem).then(({ rows, code, total }) => {
+        if (code === 200) {
+          this.interList = rows;
+          this.tableTotal = total;
+        }
+      })
+    },
+    /**
+ * @description: 列表选择改变事件
+ * @param {*}
+ * @return {*}
+ */
+    handleSelectionChange(selection) {
+      this.checkIds = selection.map((item) => item.id);
+      this.multiple = !selection.length;
+    },
+
+    /**
+     * @description: 点击编辑事件
+     * @param {*}
+     * @return {*}
+     */
+    handleUpdate(value) {
+      this.addVisible = true;
+      this.dialogItem = value;
+    },
+
+    /**
+     * @description: 点击删除事件
+     * @param {*}
+     * @return {*}
+     */
+    handleDelete(row) {
+      // const checkIds = row ? row.id : this.checkIds;
+      // if (!checkIds.length) {
+      //   this.$modal.msgWarning("请选择要删除的记录");
+      //   return;
+      // }
+      this.$modal
+        .confirm(`是否确认删除选中的1条记录？`)
+        .then(() => {
+          return delData(row.id);
+        })
+        .then(() => {
+          this.getTableData();
+          // this.$refs.defectTable.clearSelection();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => { });
+    },
+
+    /**
+     * @description: 切换分页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleCurrentChange(arg) {
+      this.pagination.pageNum = arg;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 切换每条/页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleSizeChange(arg) {
+      this.pagination.pageSize = arg;
+      this.getTableData();
+    },
+
+    /**
+   * @description: 关闭弹窗事件
+   * @param {*}
+   * @return {*}
+   */
+    addCancel() {
+      this.addVisible = false;
+      this.dialogItem = {};
+      this.getTableData();
+    }
   },
 }
 </script>
@@ -31,4 +277,12 @@ export default {
   padding: 1rem;
   overflow-y: auto;
 }
+
+/* 分页样式 */
+.pagination-part {
+  width: 100%;
+  display: flex;
+  padding-top: 1rem;
+  justify-content: flex-end;
+}
 </style>
diff --git a/src/views/xj/hisense/station/components/add-station.vue b/src/views/xj/hisense/station/components/add-station.vue
new file mode 100644
index 0000000..5521203
--- /dev/null
+++ b/src/views/xj/hisense/station/components/add-station.vue
@@ -0,0 +1,152 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-12 16:44:44
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 16:18:20
+ * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
+ * @Description: 海信-收费站-新增/编辑
+-->
+<template>
+  <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="stationName">
+            <el-input v-model="addInterForm.stationName" 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="stationId">
+            <el-input v-model="addInterForm.stationId" placeholder="请填写id" 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="stationCode">
+            <el-input v-model="addInterForm.stationCode" 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>
+import { add, updata } from '@/api/xj/hisense/station'
+
+export default {
+  name: "AddStation",
+  props: {
+    // 接收父组件传过来的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 新增表单
+      addInterForm: {
+        stationName: "",
+        stationId: "",
+        stationCode: "",
+        stake: "",
+      },
+      // 表单校验规则
+      rules: {
+        stationName: [{ required: true, message: "请填写名称", trigger: "blur" }],
+        stationCode: [{ required: true, message: "请填写code", trigger: "blur" }],
+        stationId: [{ required: true, message: "请填写工作站id", trigger: "blur" }, {
+          pattern: /^[1-9]\d*$/,
+          message: "请输入正整数",
+        }],
+        stake: [{ required: true, message: "请填写桩号", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+      }
+    }
+  },
+  watch: {
+    dialogItem: {
+      handler(val) {
+        if (val) {
+          this.addInterForm = JSON.parse(JSON.stringify(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: 20rem;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/xj/hisense/station/index.vue b/src/views/xj/hisense/station/index.vue
index 29600f0..f92e894 100644
--- a/src/views/xj/hisense/station/index.vue
+++ b/src/views/xj/hisense/station/index.vue
@@ -2,24 +2,270 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 14:30:43
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-12 14:30:52
+ * @LastEditTime: 2025-02-17 14:58:21
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\station\index.vue
  * @Description: 海信-收费站
 -->
 <template>
-  <div class="content">海信收费站</div>
+  <div class="content">
+    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="7rem">
+      <el-form-item label="收费站名称" prop="name">
+        <el-select v-model="interForm.name" placeholder="请输入收费站名称" filterable remote clearable reserve-keyword
+          :filter-method="handleRemoteMethod" @change="handleRemoteMethod">
+          <el-option v-for="(item, index) in segmentList" :key="`enterprise-name-${index}`" :label="item.label"
+            :value="item.label"></el-option> </el-select>
+      </el-form-item>
+      <!-- <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-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>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
+        </el-button>
+      </el-col>
+      <!-- <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-row>
+    <!-- 表格 -->
+    <el-table ref="setupTable" :data="interList" v-loading="loading" @selection-change="handleSelectionChange"
+      style="width: 100%">
+      <!-- <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="stationName" />
+      <el-table-column label="收费站Id(海信)" align="center" prop="stationId">
+      </el-table-column>
+      <el-table-column label="收费站code" align="center" prop="stationCode" />
+      <el-table-column label="桩号" align="center" prop="stake" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页组件 -->
+    <div class="pagination-part">
+      <el-pagination background :current-page.sync="pagination.pageNum" @current-change="handleCurrentChange"
+        :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="title" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
+      destroy-on-close>
+      <add-station v-if="addVisible" :segmentList="segmentList" :dialogItem="dialogItem"
+        @cancel="addCancel"></add-station>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
+import { getList, getDropDown, delData } from "@/api/xj/hisense/station"
+import AddStation from "./components/add-station.vue"
+
 export default {
   name: "Station",
+  components: {
+    AddStation,
+  },
   data() {
     return {
+      // 搜索绑定菜单
+      interForm: {
+        name: "",
+      },
+      searchForm: {},
+      // 路段下拉数据
+      segmentList: [],
+
+      // 列表数据
+      interList: [],
+      // 列表加载状态
+      loading: false,
+      // 列表勾选框数据
+      checkIds: [],
+      // 非多个禁用
+      multiple: true,
+      // 分页-列表总数
+      tableTotal: 0,
+      // 分页-页数页码
+      pagination: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      // 弹窗标题
+      title: "新增",
+      // 新增弹窗显隐控制
+      addVisible: false,
+      // 传弹窗数据
+      dialogItem: {},
     }
   },
   mounted() {
+    this.getTableData()
+    this.getDownList()
   },
   methods: {
+    /**
+     * @description: 模糊搜索
+     * @param {*} str 模糊搜索字段
+     * @return {*}
+     */
+    handleRemoteMethod(str) {
+      this.interForm.name = str;
+      this.getDownList();
+    },
+    /**
+     * @description: 获取下拉数据
+     * @param {*}
+     * @return {*}
+     */
+    getDownList() {
+      getDropDown({ name: this.interForm.name }).then(({ code, data }) => {
+        if (code === 200) {
+          this.segmentList = data
+        }
+      })
+    },
+    /**
+     * @description: 点击搜索
+     * @param {*}
+     * @return {*}
+     */
+    handleQuery() {
+      this.searchForm = JSON.parse(JSON.stringify(this.interForm));
+      this.pagination.pageNum = 1;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 点击重置
+     * @param {*}
+     * @return {*}
+     */
+    resetQuery() {
+      this.interForm = {
+        name: "",
+        defectType: "",
+      }
+      this.searchForm = {}
+    },
+
+    /**
+     * @description: 点击新增事件
+     * @param {*}
+     * @return {*}
+     */
+    handleAdd() {
+      this.addVisible = true;
+      this.dialogItem = {};
+    },
+
+    /**
+     * @description: 获取列表数据
+     * @param {*}
+     * @return {*}
+     */
+    getTableData() {
+      const dataItem = {
+        ...this.searchForm,
+        ...this.pagination,
+      }
+      getList(dataItem).then(({ rows, code, total }) => {
+        if (code === 200) {
+          this.interList = rows;
+          this.tableTotal = total;
+        }
+      })
+    },
+    /**
+ * @description: 列表选择改变事件
+ * @param {*}
+ * @return {*}
+ */
+    handleSelectionChange(selection) {
+      this.checkIds = selection.map((item) => item.id);
+      this.multiple = !selection.length;
+    },
+
+    /**
+     * @description: 点击编辑事件
+     * @param {*}
+     * @return {*}
+     */
+    handleUpdate(value) {
+      this.addVisible = true;
+      this.dialogItem = value;
+    },
+
+    /**
+     * @description: 点击删除事件
+     * @param {*}
+     * @return {*}
+     */
+    handleDelete(row) {
+      // const checkIds = row ? row.id : this.checkIds;
+      // if (!checkIds.length) {
+      //   this.$modal.msgWarning("请选择要删除的记录");
+      //   return;
+      // }
+      this.$modal
+        .confirm(`是否确认删除选中的1条记录？`)
+        .then(() => {
+          return delData(row.id);
+        })
+        .then(() => {
+          this.getTableData();
+          // this.$refs.defectTable.clearSelection();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => { });
+    },
+
+    /**
+     * @description: 切换分页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleCurrentChange(arg) {
+      this.pagination.pageNum = arg;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 切换每条/页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleSizeChange(arg) {
+      this.pagination.pageSize = arg;
+      this.getTableData();
+    },
+
+    /**
+   * @description: 关闭弹窗事件
+   * @param {*}
+   * @return {*}
+   */
+    addCancel() {
+      this.addVisible = false;
+      this.dialogItem = {};
+      this.getTableData();
+    }
   },
 }
 </script>
@@ -31,4 +277,12 @@ export default {
   padding: 1rem;
   overflow-y: auto;
 }
+
+/* 分页样式 */
+.pagination-part {
+  width: 100%;
+  display: flex;
+  padding-top: 1rem;
+  justify-content: flex-end;
+}
 </style>
diff --git a/src/views/xj/hisense/tunnel/components/add-tunnel.vue b/src/views/xj/hisense/tunnel/components/add-tunnel.vue
new file mode 100644
index 0000000..2a80995
--- /dev/null
+++ b/src/views/xj/hisense/tunnel/components/add-tunnel.vue
@@ -0,0 +1,152 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-02-12 16:44:44
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-02-17 17:29:23
+ * @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
+ * @Description: 海信-收费站-新增/编辑
+-->
+<template>
+  <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="tunnelName">
+            <el-input v-model="addInterForm.tunnelName" 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="tunnelId">
+            <el-input v-model="addInterForm.tunnelId" placeholder="请填写id" 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="tunnelCode">
+            <el-input v-model="addInterForm.tunnelCode" 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="tunnellCenStake">
+            <el-input v-model="addInterForm.tunnellCenStake" 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>
+import { add, updata } from '@/api/xj/hisense/tunnel'
+
+export default {
+  name: "AddTunnel",
+  props: {
+    // 接收父组件传过来的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 新增表单
+      addInterForm: {
+        tunnelName: "",
+        tunnelId: "",
+        tunnelCode: "",
+        tunnellCenStake: "",
+      },
+      // 表单校验规则
+      rules: {
+        tunnelName: [{ required: true, message: "请填写名称", trigger: "blur" }],
+        tunnelCode: [{ required: true, message: "请填写code", trigger: "blur" }],
+        tunnelId: [{ required: true, message: "请填写隧道id", trigger: "blur" }, {
+          pattern: /^[1-9]\d*$/,
+          message: "请输入正整数",
+        }],
+        tunnellCenStake: [{ required: true, message: "请填写里程", trigger: "blur" }, {
+          pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
+          message: "请输入非负数",
+        },],
+      }
+    }
+  },
+  watch: {
+    dialogItem: {
+      handler(val) {
+        if (val) {
+          this.addInterForm = JSON.parse(JSON.stringify(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: 20rem;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/xj/hisense/tunnel/index.vue b/src/views/xj/hisense/tunnel/index.vue
index db8a2e7..17352f0 100644
--- a/src/views/xj/hisense/tunnel/index.vue
+++ b/src/views/xj/hisense/tunnel/index.vue
@@ -2,24 +2,270 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2025-02-12 15:10:59
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-02-12 15:11:05
+ * @LastEditTime: 2025-02-17 17:19:21
  * @FilePath: \znxjxt-ui\src\views\xj\hisense\tunnel\index.vue
  * @Description: 海信-隧道
 -->
 <template>
-  <div class="content">海信匝道</div>
+  <div class="content">
+    <el-form :model="interForm" ref="interForm" size="small" :inline="true" label-width="7rem">
+      <el-form-item label="收费站名称" prop="name">
+        <el-select v-model="interForm.name" placeholder="请输入收费站名称" filterable remote clearable reserve-keyword
+          :filter-method="handleRemoteMethod" @change="handleRemoteMethod">
+          <el-option v-for="(item, index) in segmentList" :key="`enterprise-name-${index}`" :label="item.label"
+            :value="item.label"></el-option> </el-select>
+      </el-form-item>
+      <!-- <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-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>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
+        </el-button>
+      </el-col>
+      <!-- <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-row>
+    <!-- 表格 -->
+    <el-table ref="setupTable" :data="interList" v-loading="loading" @selection-change="handleSelectionChange"
+      style="width: 100%">
+      <!-- <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="tunnelName" />
+      <el-table-column label="隧道Id(海信)" align="center" prop="tunnelId">
+      </el-table-column>
+      <el-table-column label="隧道code" align="center" prop="tunnelCode" />
+      <el-table-column label="隧道里程" align="center" prop="tunnellCenStake" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
+          </el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页组件 -->
+    <div class="pagination-part">
+      <el-pagination background :current-page.sync="pagination.pageNum" @current-change="handleCurrentChange"
+        :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="title" :visible.sync="addVisible" width="50rem" append-to-body :close-on-click-modal="false"
+      destroy-on-close>
+      <add-tunnel v-if="addVisible" :segmentList="segmentList" :dialogItem="dialogItem"
+        @cancel="addCancel"></add-tunnel>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
+import { getList, getDropDown, delData } from "@/api/xj/hisense/tunnel"
+import AddTunnel from "./components/add-tunnel.vue"
+
 export default {
   name: "Tunnel",
+  components: {
+    AddTunnel,
+  },
   data() {
     return {
+      // 搜索绑定菜单
+      interForm: {
+        name: "",
+      },
+      searchForm: {},
+      // 路段下拉数据
+      segmentList: [],
+
+      // 列表数据
+      interList: [],
+      // 列表加载状态
+      loading: false,
+      // 列表勾选框数据
+      checkIds: [],
+      // 非多个禁用
+      multiple: true,
+      // 分页-列表总数
+      tableTotal: 0,
+      // 分页-页数页码
+      pagination: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      // 弹窗标题
+      title: "新增",
+      // 新增弹窗显隐控制
+      addVisible: false,
+      // 传弹窗数据
+      dialogItem: {},
     }
   },
   mounted() {
+    this.getTableData()
+    this.getDownList()
   },
   methods: {
+    /**
+     * @description: 模糊搜索
+     * @param {*} str 模糊搜索字段
+     * @return {*}
+     */
+    handleRemoteMethod(str) {
+      this.interForm.name = str;
+      this.getDownList();
+    },
+    /**
+     * @description: 获取下拉数据
+     * @param {*}
+     * @return {*}
+     */
+    getDownList() {
+      getDropDown({ name: this.interForm.name }).then(({ code, data }) => {
+        if (code === 200) {
+          this.segmentList = data
+        }
+      })
+    },
+    /**
+     * @description: 点击搜索
+     * @param {*}
+     * @return {*}
+     */
+    handleQuery() {
+      this.searchForm = JSON.parse(JSON.stringify(this.interForm));
+      this.pagination.pageNum = 1;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 点击重置
+     * @param {*}
+     * @return {*}
+     */
+    resetQuery() {
+      this.interForm = {
+        name: "",
+        defectType: "",
+      }
+      this.searchForm = {}
+    },
+
+    /**
+     * @description: 点击新增事件
+     * @param {*}
+     * @return {*}
+     */
+    handleAdd() {
+      this.addVisible = true;
+      this.dialogItem = {};
+    },
+
+    /**
+     * @description: 获取列表数据
+     * @param {*}
+     * @return {*}
+     */
+    getTableData() {
+      const dataItem = {
+        ...this.searchForm,
+        ...this.pagination,
+      }
+      getList(dataItem).then(({ rows, code, total }) => {
+        if (code === 200) {
+          this.interList = rows;
+          this.tableTotal = total;
+        }
+      })
+    },
+    /**
+ * @description: 列表选择改变事件
+ * @param {*}
+ * @return {*}
+ */
+    handleSelectionChange(selection) {
+      this.checkIds = selection.map((item) => item.id);
+      this.multiple = !selection.length;
+    },
+
+    /**
+     * @description: 点击编辑事件
+     * @param {*}
+     * @return {*}
+     */
+    handleUpdate(value) {
+      this.addVisible = true;
+      this.dialogItem = value;
+    },
+
+    /**
+     * @description: 点击删除事件
+     * @param {*}
+     * @return {*}
+     */
+    handleDelete(row) {
+      // const checkIds = row ? row.id : this.checkIds;
+      // if (!checkIds.length) {
+      //   this.$modal.msgWarning("请选择要删除的记录");
+      //   return;
+      // }
+      this.$modal
+        .confirm(`是否确认删除选中的1条记录？`)
+        .then(() => {
+          return delData(row.id);
+        })
+        .then(() => {
+          this.getTableData();
+          // this.$refs.defectTable.clearSelection();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => { });
+    },
+
+    /**
+     * @description: 切换分页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleCurrentChange(arg) {
+      this.pagination.pageNum = arg;
+      this.getTableData();
+    },
+
+    /**
+     * @description: 切换每条/页
+     * @param {*} arg
+     * @return {*}
+     */
+    handleSizeChange(arg) {
+      this.pagination.pageSize = arg;
+      this.getTableData();
+    },
+
+    /**
+   * @description: 关闭弹窗事件
+   * @param {*}
+   * @return {*}
+   */
+    addCancel() {
+      this.addVisible = false;
+      this.dialogItem = {};
+      this.getTableData();
+    }
   },
 }
 </script>
@@ -31,4 +277,12 @@ export default {
   padding: 1rem;
   overflow-y: auto;
 }
+
+/* 分页样式 */
+.pagination-part {
+  width: 100%;
+  display: flex;
+  padding-top: 1rem;
+  justify-content: flex-end;
+}
 </style>