运检站管理模块调试完成

src/api/basicManage/businessType.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 业务类型管理 - 查询列表
+export function listBusinessTypeAPI(query) {
+    return request({
+        url: '/basic/businessType/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 业务类型管理 - 查询详情
+export function getBusinessTypeAPI(id) {
+    return request({
+        url: `/basic/businessType/${id}`,
+        method: 'get',
+    })
+}
+
+// 业务类型管理 - 新增
+export function addBusinessTypeAPI(data) {
+    return request({
+        url: '/basic/businessType',
+        method: 'post',
+        data,
+    })
+}
+
+// 业务类型管理 - 修改
+export function updateBusinessTypeAPI(data) {
+    return request({
+        url: '/basic/businessType',
+        method: 'put',
+        data,
+    })
+}
+
+// 业务类型管理 - 删除
+export function delBusinessTypeAPI(id) {
+    return request({
+        url: `/basic/businessType/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/inspectionStation.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+// 运检站管理 - 查询列表
+export function listInspectionStationAPI(query) {
+    return request({
+        url: '/inspectionStation/getInspectionStationList',
+        method: 'GET',
+        params: query,
+    })
+}
+
+// 运检站管理 - 新增
+export function addInspectionStationAPI(data) {
+    return request({
+        url: '/inspectionStation/addInspectionStation',
+        method: 'POST',
+        data,
+    })
+}
+
+// 运检站管理 - 修改
+export function updateInspectionStationAPI(data) {
+    return request({
+        url: '/inspectionStation/updateInspectionStation',
+        method: 'POST',
+        data,
+    })
+}
+
+// 运检站管理 - 删除
+export function delInspectionStationAPI(data) {
+    return request({
+        url: `/inspectionStation/delInspectionStation`,
+        method: 'POST',
+        data,
+    })
+}

src/api/basicManage/personCategory.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 人员分类管理 - 查询列表
+export function listPersonCategoryAPI(query) {
+    return request({
+        url: '/basic/personCategory/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 人员分类管理 - 查询详情
+export function getPersonCategoryAPI(id) {
+    return request({
+        url: `/basic/personCategory/${id}`,
+        method: 'get',
+    })
+}
+
+// 人员分类管理 - 新增
+export function addPersonCategoryAPI(data) {
+    return request({
+        url: '/basic/personCategory',
+        method: 'post',
+        data,
+    })
+}
+
+// 人员分类管理 - 修改
+export function updatePersonCategoryAPI(data) {
+    return request({
+        url: '/basic/personCategory',
+        method: 'put',
+        data,
+    })
+}
+
+// 人员分类管理 - 删除
+export function delPersonCategoryAPI(id) {
+    return request({
+        url: `/basic/personCategory/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/personNature.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 人员性质管理 - 查询列表
+export function listPersonNatureAPI(query) {
+    return request({
+        url: '/basic/personNature/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 人员性质管理 - 查询详情
+export function getPersonNatureAPI(id) {
+    return request({
+        url: `/basic/personNature/${id}`,
+        method: 'get',
+    })
+}
+
+// 人员性质管理 - 新增
+export function addPersonNatureAPI(data) {
+    return request({
+        url: '/basic/personNature',
+        method: 'post',
+        data,
+    })
+}
+
+// 人员性质管理 - 修改
+export function updatePersonNatureAPI(data) {
+    return request({
+        url: '/basic/personNature',
+        method: 'put',
+        data,
+    })
+}
+
+// 人员性质管理 - 删除
+export function delPersonNatureAPI(id) {
+    return request({
+        url: `/basic/personNature/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/planCategory.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 计划类别管理 - 查询列表
+export function listPlanCategoryAPI(query) {
+    return request({
+        url: '/basic/planCategory/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 计划类别管理 - 查询详情
+export function getPlanCategoryAPI(id) {
+    return request({
+        url: `/basic/planCategory/${id}`,
+        method: 'get',
+    })
+}
+
+// 计划类别管理 - 新增
+export function addPlanCategoryAPI(data) {
+    return request({
+        url: '/basic/planCategory',
+        method: 'post',
+        data,
+    })
+}
+
+// 计划类别管理 - 修改
+export function updatePlanCategoryAPI(data) {
+    return request({
+        url: '/basic/planCategory',
+        method: 'put',
+        data,
+    })
+}
+
+// 计划类别管理 - 删除
+export function delPlanCategoryAPI(id) {
+    return request({
+        url: `/basic/planCategory/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/planProfessional.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 计划专业管理 - 查询列表
+export function listPlanProfessionalAPI(query) {
+    return request({
+        url: '/basic/planProfessional/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 计划专业管理 - 查询详情
+export function getPlanProfessionalAPI(id) {
+    return request({
+        url: `/basic/planProfessional/${id}`,
+        method: 'get',
+    })
+}
+
+// 计划专业管理 - 新增
+export function addPlanProfessionalAPI(data) {
+    return request({
+        url: '/basic/planProfessional',
+        method: 'post',
+        data,
+    })
+}
+
+// 计划专业管理 - 修改
+export function updatePlanProfessionalAPI(data) {
+    return request({
+        url: '/basic/planProfessional',
+        method: 'put',
+        data,
+    })
+}
+
+// 计划专业管理 - 删除
+export function delPlanProfessionalAPI(id) {
+    return request({
+        url: `/basic/planProfessional/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/position.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 岗位管理 - 查询列表
+export function listPositionAPI(query) {
+    return request({
+        url: '/basic/position/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 岗位管理 - 查询详情
+export function getPositionAPI(id) {
+    return request({
+        url: `/basic/position/${id}`,
+        method: 'get',
+    })
+}
+
+// 岗位管理 - 新增
+export function addPositionAPI(data) {
+    return request({
+        url: '/basic/position',
+        method: 'post',
+        data,
+    })
+}
+
+// 岗位管理 - 修改
+export function updatePositionAPI(data) {
+    return request({
+        url: '/basic/position',
+        method: 'put',
+        data,
+    })
+}
+
+// 岗位管理 - 删除
+export function delPositionAPI(id) {
+    return request({
+        url: `/basic/position/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/projectDept.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 项目部管理 - 查询列表
+export function listProjectDeptAPI(query) {
+    return request({
+        url: '/basic/projectDept/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 项目部管理 - 查询详情
+export function getProjectDeptAPI(id) {
+    return request({
+        url: `/basic/projectDept/${id}`,
+        method: 'get',
+    })
+}
+
+// 项目部管理 - 新增
+export function addProjectDeptAPI(data) {
+    return request({
+        url: '/basic/projectDept',
+        method: 'post',
+        data,
+    })
+}
+
+// 项目部管理 - 修改
+export function updateProjectDeptAPI(data) {
+    return request({
+        url: '/basic/projectDept',
+        method: 'put',
+        data,
+    })
+}
+
+// 项目部管理 - 删除
+export function delProjectDeptAPI(id) {
+    return request({
+        url: `/basic/projectDept/${id}`,
+        method: 'delete',
+    })
+}

src/api/basicManage/workloadCategory.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 工作量类别管理 - 查询列表
+export function listWorkloadCategoryAPI(query) {
+    return request({
+        url: '/basic/workloadCategory/list',
+        method: 'get',
+        params: query,
+    })
+}
+
+// 工作量类别管理 - 查询详情
+export function getWorkloadCategoryAPI(id) {
+    return request({
+        url: `/basic/workloadCategory/${id}`,
+        method: 'get',
+    })
+}
+
+// 工作量类别管理 - 新增
+export function addWorkloadCategoryAPI(data) {
+    return request({
+        url: '/basic/workloadCategory',
+        method: 'post',
+        data,
+    })
+}
+
+// 工作量类别管理 - 修改
+export function updateWorkloadCategoryAPI(data) {
+    return request({
+        url: '/basic/workloadCategory',
+        method: 'put',
+        data,
+    })
+}
+
+// 工作量类别管理 - 删除
+export function delWorkloadCategoryAPI(id) {
+    return request({
+        url: `/basic/workloadCategory/${id}`,
+        method: 'delete',
+    })
+}

src/assets/styles/index.scss

@@ -6,175 +6,190 @@
 @use './ruoyi.scss';
 
 body {
-  height: 100%;
-  margin: 0;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+    height: 100%;
+    margin: 0;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial,
+        sans-serif;
 }
 
 label {
-  font-weight: 700;
+    font-weight: 700;
 }
 
 html {
-  height: 100%;
-  box-sizing: border-box;
+    height: 100%;
+    box-sizing: border-box;
 }
 
 #app {
-  height: 100%;
+    height: 100%;
 }
 
 *,
 *:before,
 *:after {
-  box-sizing: inherit;
+    box-sizing: inherit;
 }
 
 .no-padding {
-  padding: 0px !important;
+    padding: 0px !important;
 }
 
 .padding-content {
-  padding: 4px 0;
+    padding: 4px 0;
 }
 
 a:focus,
 a:active {
-  outline: none;
+    outline: none;
 }
 
 a,
 a:focus,
 a:hover {
-  cursor: pointer;
-  color: inherit;
-  text-decoration: none;
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
 }
 
 div:focus {
-  outline: none;
+    outline: none;
 }
 
 .fr {
-  float: right;
+    float: right;
 }
 
 .fl {
-  float: left;
+    float: left;
 }
 
 .pr-5 {
-  padding-right: 5px;
+    padding-right: 5px;
 }
 
 .pl-5 {
-  padding-left: 5px;
+    padding-left: 5px;
 }
 
 .block {
-  display: block;
+    display: block;
 }
 
 .pointer {
-  cursor: pointer;
+    cursor: pointer;
 }
 
 .inlineBlock {
-  display: block;
+    display: block;
 }
 
 .clearfix {
-  &:after {
-    visibility: hidden;
-    display: block;
-    font-size: 0;
-    content: " ";
-    clear: both;
-    height: 0;
-  }
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: ' ';
+        clear: both;
+        height: 0;
+    }
 }
 
 aside {
-  background: #eef1f6;
-  padding: 8px 24px;
-  margin-bottom: 20px;
-  border-radius: 2px;
-  display: block;
-  line-height: 32px;
-  font-size: 16px;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  color: #2c3e50;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
+    background: #eef1f6;
+    padding: 8px 24px;
+    margin-bottom: 20px;
+    border-radius: 2px;
+    display: block;
+    line-height: 32px;
+    font-size: 16px;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
+        'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+    color: #2c3e50;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
 
-  a {
-    color: #337ab7;
-    cursor: pointer;
+    a {
+        color: #337ab7;
+        cursor: pointer;
 
-    &:hover {
-      color: rgb(32, 160, 255);
+        &:hover {
+            color: rgb(32, 160, 255);
+        }
     }
-  }
 }
 
 //main-container全局样式
 .app-container {
-  padding: 20px;
+    padding: 20px;
 }
 
 .components-container {
-  margin: 30px 50px;
-  position: relative;
+    margin: 30px 50px;
+    position: relative;
 }
 
 .text-center {
-  text-align: center
+    text-align: center;
 }
 
 .sub-navbar {
-  height: 50px;
-  line-height: 50px;
-  position: relative;
-  width: 100%;
-  text-align: right;
-  padding-right: 20px;
-  transition: 600ms ease position;
-  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+    height: 50px;
+    line-height: 50px;
+    position: relative;
+    width: 100%;
+    text-align: right;
+    padding-right: 20px;
+    transition: 600ms ease position;
+    background: linear-gradient(
+        90deg,
+        rgba(32, 182, 249, 1) 0%,
+        rgba(32, 182, 249, 1) 0%,
+        rgba(33, 120, 241, 1) 100%,
+        rgba(33, 120, 241, 1) 100%
+    );
 
-  .subtitle {
-    font-size: 20px;
-    color: #fff;
-  }
+    .subtitle {
+        font-size: 20px;
+        color: #fff;
+    }
 
-  &.draft {
-    background: #d0d0d0;
-  }
+    &.draft {
+        background: #d0d0d0;
+    }
 
-  &.deleted {
-    background: #d0d0d0;
-  }
+    &.deleted {
+        background: #d0d0d0;
+    }
 }
 
 .link-type,
 .link-type:focus {
-  color: #1677ff;
-  cursor: pointer;
-  transition: color 0.3s ease;
+    color: #1677ff;
+    cursor: pointer;
+    transition: color 0.3s ease;
 
-  &:hover {
-    color: #4096ff;
-  }
+    &:hover {
+        color: #4096ff;
+    }
 }
 
 .filter-container {
-  padding-bottom: 10px;
+    padding-bottom: 10px;
 
-  .filter-item {
-    display: inline-block;
-    vertical-align: middle;
-    margin-bottom: 10px;
-  }
+    .filter-item {
+        display: inline-block;
+        vertical-align: middle;
+        margin-bottom: 10px;
+    }
+}
+
+.common-btn-row {
+    padding-top: 10px;
+    display: flex;
+    justify-content: flex-end;
+    border-top: 1px solid #f0f0f0;
 }

src/components/ComDataTable/index.vue

@@ -137,7 +137,7 @@
                 v-bind="$attrs"
             >
                 <!-- 选择列 -->
-                <el-table-column type="selection" width="55" align="center" />
+                <el-table-column v-if="showSelection" type="selection" width="55" align="center" />
                 <!-- 索引列 -->
                 <el-table-column
                     v-if="showIndex"
@@ -155,7 +155,7 @@
                     :width="column.width"
                     :min-width="column.minWidth"
                     :fixed="column.fixed"
-                    :align="column.align || 'left'"
+                    :align="column.align || 'center'"
                     :show-overflow-tooltip="column.showOverflowTooltip !== false"
                 >
                     <template #default="{ row, $index }" v-if="column.slot || column.formatter">
@@ -291,7 +291,7 @@ const props = defineProps({
     // 功能开关
     showSelection: {
         type: Boolean,
-        default: true,
+        default: false,
     },
     showIndex: {
         type: Boolean,

src/components/ComDialog/index.vue

@@ -0,0 +1,154 @@
+<template>
+    <!-- 通用弹框组件（支持外层 + 内层） -->
+    <div class="com-dialog">
+        <!-- 外层弹框 -->
+        <el-dialog
+            v-if="dialogConfig.outerVisible"
+            v-model="dialogConfig.outerVisible"
+            :title="dialogConfig.outerTitle"
+            :width="dialogConfig.outerWidth || '720px'"
+            :before-close="handleCloseOuter"
+            :append-to-body="true"
+            :close-on-click-modal="false"
+            :style="{
+                '--com-dialog-min-height': dialogConfig.minHeight || '320px',
+                '--com-dialog-max-height': dialogConfig.maxHeight || '80vh',
+            }"
+            class="com-dialog__outer"
+        >
+            <!-- 外层弹框内容插槽 -->
+            <slot name="outerContent" />
+
+            <!-- 内层弹框 -->
+            <el-dialog
+                v-if="dialogConfig.innerVisible"
+                v-model="dialogConfig.innerVisible"
+                :title="dialogConfig.innerTitle"
+                :width="dialogConfig.innerWidth || '640px'"
+                :before-close="handleCloseInner"
+                :append-to-body="true"
+                :close-on-click-modal="false"
+                :style="{
+                    '--com-dialog-min-height': dialogConfig.innerMinHeight || '260px',
+                    '--com-dialog-max-height': dialogConfig.innerMaxHeight || '70vh',
+                }"
+                class="com-dialog__inner"
+            >
+                <!-- 内层弹框内容插槽 -->
+                <slot name="innerContent" />
+            </el-dialog>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup>
+const props = defineProps({
+    // 弹框配置对象
+    dialogConfig: {
+        type: Object,
+        default: () => ({}),
+    },
+})
+
+const emit = defineEmits(['closeDialogOuter', 'closeDialogInner'])
+
+// 右上角关闭外层
+const handleCloseOuter = () => {
+    emit('closeDialogOuter', false)
+}
+
+// 右上角关闭内层
+const handleCloseInner = () => {
+    emit('closeDialogInner', false)
+}
+</script>
+
+<style lang="scss">
+/* 全局样式：仅作用于带 com-dialog__outer / com-dialog__inner 类名的弹框 */
+
+/* 外层 + 内层弹框通用外观 */
+.com-dialog__outer,
+.com-dialog__inner {
+    display: flex;
+    flex-direction: column;
+    margin: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -75%);
+    min-height: var(--com-dialog-min-height);
+    max-height: var(--com-dialog-max-height);
+    border-radius: 16px;
+    overflow: hidden;
+    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.35);
+    background: #ffffff;
+}
+
+/* 头部区域：浅色背景 + 左侧色条 */
+.com-dialog__outer .el-dialog__header,
+.com-dialog__inner .el-dialog__header {
+    position: relative;
+    padding: 12px 18px;
+    margin: 0;
+    border-bottom: 1px solid #edf0f5;
+    background: #f8f9fd;
+    color: #1f2937;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.com-dialog__outer .el-dialog__header::before,
+.com-dialog__inner .el-dialog__header::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    width: 3px;
+    border-radius: 0 4px 4px 0;
+    background: linear-gradient(180deg, #1677ff 0%, #69b1ff 100%);
+}
+
+.com-dialog__outer .el-dialog__title,
+.com-dialog__inner .el-dialog__title {
+    font-size: 15px;
+    font-weight: 600;
+    letter-spacing: 0.02em;
+    color: #111827;
+}
+
+.com-dialog__outer .el-dialog__headerbtn,
+.com-dialog__inner .el-dialog__headerbtn {
+    top: 14px;
+    right: 16px;
+
+    .el-dialog__close {
+        color: #4b5563; /* 默认深灰，保证在浅色标题背景下清晰可见 */
+        transition: transform 0.2s ease, color 0.2s ease;
+    }
+
+    &:hover .el-dialog__close {
+        color: #111827;
+        transform: scale(1.05);
+    }
+}
+
+/* 内容区域 */
+.com-dialog__outer .el-dialog__body,
+.com-dialog__inner .el-dialog__body {
+    flex: 1;
+    overflow-y: auto;
+    padding: 18px 20px 20px;
+    box-sizing: border-box;
+    background-color: #fafbff;
+}
+
+/* 底部区域 */
+.com-dialog__outer .el-dialog__footer,
+.com-dialog__inner .el-dialog__footer {
+    padding: 12px 20px 16px;
+    border-top: 1px solid #eef1f6;
+    background-color: #ffffff;
+}
+</style>

src/components/ComTable/index.vue

@@ -52,7 +52,7 @@
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue'
+import { ref, reactive, onMounted } from 'vue'
 import ComSearchForm from '@/components/ComSearchForm/index.vue'
 import ComDataTable from '@/components/ComDataTable/index.vue'
 
@@ -109,6 +109,11 @@ const props = defineProps({
         type: Function,
         default: null,
     },
+    // 初始化默认查询参数
+    defaultQueryParams: {
+        type: Object,
+        default: () => ({}),
+    },
 })
 
 const emit = defineEmits(['search', 'reset', 'selection-change', 'action'])
@@ -172,10 +177,9 @@ const fetchData = async (formData = {}) => {
     try {
         const params = {
             ...formData,
+            ...props.defaultQueryParams,
             pageNum: pagination.page, // 后端可能需要pageNum
             pageSize: pagination.limit, // 后端可能需要pageSize
-            page: pagination.page,
-            limit: pagination.limit,
         }
 
         const response = await props.loadData(params)
@@ -197,6 +201,10 @@ const fetchData = async (formData = {}) => {
     }
 }
 
+onMounted(() => {
+    fetchData()
+})
+
 // 暴露方法
 defineExpose({
     searchFormRef,

src/views/basicManage/inspectionStation/config.js

@@ -1,3 +1,4 @@
+import { reactive } from 'vue'
 export default {
     formColumns: [
         {
@@ -8,12 +9,20 @@ export default {
     ],
     tableColumns: [
         {
-            prop: 'name',
+            prop: 'inspectionStationName',
             label: '运检站名称',
         },
         {
-            prop: 'name',
+            prop: 'remark',
             label: '备注',
         },
     ],
+
+    dialogConfig: reactive({
+        outerVisible: false,
+        outerTitle: '新增运检站',
+        outerWidth: '720px',
+        minHeight: '320px',
+        maxHeight: '80vh',
+    }),
 }

src/views/basicManage/inspectionStation/index.vue

@@ -1,13 +1,156 @@
 <template>
+    <!-- 运检站管理 -->
     <div class="app-container">
-        <ComTable :form-columns="formColumns" :table-columns="tableColumns" />
+        <ComTable
+            ref="comTableRef"
+            :form-columns="formColumns"
+            :table-columns="tableColumns"
+            :load-data="listInspectionStationAPI"
+            :show-toolbar="true"
+            :show-action="true"
+            :action-columns="actionColumns"
+            :default-query-params="{
+                category: 0, // 0: 运检站, 1: 项目部
+            }"
+        >
+            <!-- 工具栏插槽 -->
+            <template #toolbar>
+                <ComButton type="primary" icon="Plus" @click="onHandleAdd">新增</ComButton>
+            </template>
+        </ComTable>
+
+        <ComDialog :dialog-config="dialogConfig" @closeDialogOuter="onCloseDialogOuter">
+            <template #outerContent>
+                <el-form
+                    size="large"
+                    label-width="100px"
+                    :model="addAndEditForm"
+                    ref="addAndEditFormRef"
+                    :rules="addAndEditRules"
+                >
+                    <el-form-item label="运检站名称" prop="inspectionStationName">
+                        <el-input
+                            clearable
+                            placeholder="请输入运检站名称"
+                            v-model.trim="addAndEditForm.inspectionStationName"
+                        />
+                    </el-form-item>
+                    <el-form-item label="备注" prop="remark">
+                        <el-input v-model="addAndEditForm.remark" placeholder="请输入备注" />
+                    </el-form-item>
+                </el-form>
+
+                <el-row class="common-btn-row">
+                    <ComButton plain type="info" @click="onHandleCancel">取消</ComButton>
+                    <ComButton @click="onHandleSave">保存</ComButton>
+                </el-row>
+            </template>
+        </ComDialog>
     </div>
 </template>
 
-<script setup name="InspectionStation">
+<script setup name="inspectionStation">
 import { ref } from 'vue'
+const { proxy } = getCurrentInstance()
+import {
+    listInspectionStationAPI,
+    addInspectionStationAPI,
+    delInspectionStationAPI,
+    updateInspectionStationAPI,
+} from '@/api/basicManage/inspectionStation'
 import config from './config'
 import ComTable from '@/components/ComTable/index.vue'
+import ComButton from '@/components/ComButton/index.vue'
+import ComDialog from '@/components/ComDialog/index.vue'
 
-const { formColumns, tableColumns } = config
+const { formColumns, tableColumns, dialogConfig } = config
+
+const addAndEditFormRef = ref(null)
+const comTableRef = ref(null)
+const editId = ref(null)
+const addAndEditForm = ref({
+    inspectionStationName: '',
+    remark: '',
+    category: 0,
+})
+
+const addAndEditRules = ref({
+    inspectionStationName: [{ required: true, message: '请输入运检站名称', trigger: 'blur' }],
+})
+
+const actionColumns = [
+    {
+        label: '编辑',
+        type: 'primary',
+        link: true,
+        handler: (row) => {
+            const { inspectionStationId, inspectionStationName, remark } = row
+            addAndEditForm.value = {
+                inspectionStationId,
+                inspectionStationName,
+                remark,
+            }
+            editId.value = row.inspectionStationId
+            dialogConfig.outerTitle = '编辑运检站'
+            dialogConfig.outerVisible = true
+        },
+    },
+    {
+        label: '删除',
+        type: 'danger',
+        link: true,
+        handler: (row) => {
+            proxy.$modal.confirm('是否确认删除该运检站？').then(async () => {
+                const result = await delInspectionStationAPI({
+                    inspectionStationId: row.inspectionStationId,
+                })
+                if (result.code === 200) {
+                    proxy.$modal.msgSuccess('删除成功')
+                    comTableRef.value?.refresh() // 刷新表格
+                }
+            })
+        },
+    },
+]
+
+// 新增
+const onHandleAdd = () => {
+    editId.value = null
+    dialogConfig.outerVisible = true
+}
+
+// 取消
+const onHandleCancel = () => {
+    dialogConfig.outerVisible = false
+}
+
+// 保存
+const onHandleSave = async () => {
+    return new Promise((resolve, reject) => {
+        try {
+            addAndEditFormRef.value.validate(async (valid) => {
+                if (valid) {
+                    const API = editId.value ? updateInspectionStationAPI : addInspectionStationAPI
+                    const params = JSON.parse(JSON.stringify(addAndEditForm.value))
+                    editId.value ? (params.inspectionStationId = editId.value) : null
+
+                    const result = await API(params)
+                    if (result.code === 200) {
+                        proxy.$modal.msgSuccess(editId.value ? '编辑成功' : '新增成功')
+                        addAndEditFormRef.value.resetFields() // 重置表单
+                        dialogConfig.outerVisible = false
+                        comTableRef.value?.refresh() // 刷新表格
+                    }
+                    resolve(result)
+                }
+            })
+        } catch (error) {
+            reject()
+        }
+    })
+}
+
+const onCloseDialogOuter = (visible) => {
+    dialogConfig.outerVisible = visible
+}
 </script>