除机场信息假数据

src/components/tableTemp/index.vue

@@ -1,14 +1,94 @@
 <template>
-  <el-table v-el-table-infinite-scroll="load" :row-key="props.tableProperty.rowKey?props.tableProperty.rowKey:tablePropertyDefault.rowKey" :row-style="rowStyle" :data="props.tableData" :height="props.tableProperty.height?props.tableProperty.height:tablePropertyDefault.height" :max-height="props.tableProperty.maxHeight?props.tableProperty.maxHeight:tablePropertyDefault.maxHeight" :stripe="props.tableProperty.stripe?props.tableProperty.stripe:tablePropertyDefault.stripe" :border="props.tableProperty.border?props.tableProperty.border:tablePropertyDefault.border" :highlight-current-row="props.tableProperty.highlightCurrentRow?props.tableProperty.highlightCurrentRow:tablePropertyDefault.highlightCurrentRow" :header-cell-class-name="props.tableProperty.headerRowClassName?props.tableProperty.headerRowClassName:tablePropertyDefault.headerRowClassName" :tooltip-effect="props.tableProperty.tooltipEffect?props.tableProperty.tooltipEffect:tablePropertyDefault.tooltipEffect" :show-summary="props.tableProperty.showSummary?props.tableProperty.showSummary:tablePropertyDefault.showSummary" :row-class-name="tableRowClassName" :cell-class-name="cellClassName">
+  <el-table
+    v-el-table-infinite-scroll="load"
+    :row-key="
+      props.tableProperty.rowKey
+        ? props.tableProperty.rowKey
+        : tablePropertyDefault.rowKey
+    "
+    :row-style="rowStyle"
+    :data="props.tableData"
+    :height="
+      props.tableProperty.height
+        ? props.tableProperty.height
+        : tablePropertyDefault.height
+    "
+    :max-height="
+      props.tableProperty.maxHeight
+        ? props.tableProperty.maxHeight
+        : tablePropertyDefault.maxHeight
+    "
+    :stripe="
+      props.tableProperty.stripe
+        ? props.tableProperty.stripe
+        : tablePropertyDefault.stripe
+    "
+    :border="
+      props.tableProperty.border
+        ? props.tableProperty.border
+        : tablePropertyDefault.border
+    "
+    :highlight-current-row="
+      props.tableProperty.highlightCurrentRow
+        ? props.tableProperty.highlightCurrentRow
+        : tablePropertyDefault.highlightCurrentRow
+    "
+    :header-cell-class-name="
+      props.tableProperty.headerRowClassName
+        ? props.tableProperty.headerRowClassName
+        : tablePropertyDefault.headerRowClassName
+    "
+    :tooltip-effect="
+      props.tableProperty.tooltipEffect
+        ? props.tableProperty.tooltipEffect
+        : tablePropertyDefault.tooltipEffect
+    "
+    :show-summary="
+      props.tableProperty.showSummary
+        ? props.tableProperty.showSummary
+        : tablePropertyDefault.showSummary
+    "
+    :row-class-name="tableRowClassName"
+    :cell-class-name="cellClassName"
+  >
     <!-- label-class-name  可通过 tableHeader中传入class来修改某一个或某一类表头的样式-->
-    <el-table-column class="infinite-list-item" v-for="(items, index) in props.tableHeader" :key="index" :label="items.label" :prop="items.key" :width="props.tableColumnProperty.width" :sortable="items.sortable ? items.sortable : props.tableColumnProperty.sortable" :show-overflow-tooltip="props.tableColumnProperty.showOverflowTooltip" :align="items.align ? items.align : props.tableColumnProperty.align" :header-align="items.headerAlign ? items.headerAlign : props.tableColumnProperty.headerAlign" :label-class-name="items.lableClass?items.lableClass:''">
+    <el-table-column
+      class="infinite-list-item"
+      v-for="(items, index) in props.tableHeader"
+      :key="index"
+      :label="items.label"
+      :prop="items.key"
+      :width="props.tableColumnProperty.width"
+      :sortable="
+        items.sortable ? items.sortable : props.tableColumnProperty.sortable
+      "
+      :show-overflow-tooltip="props.tableColumnProperty.showOverflowTooltip"
+      :align="items.align ? items.align : props.tableColumnProperty.align"
+      :header-align="
+        items.headerAlign
+          ? items.headerAlign
+          : props.tableColumnProperty.headerAlign
+      "
+      :label-class-name="items.lableClass ? items.lableClass : ''"
+    >
       <template #default="scope">
         {{ scope.row[items.key] }}
       </template>
     </el-table-column>
-    <el-table-column v-if="props.tableBtnGroup.length" label="操作" :align="props.tableColumnProperty.align">
+    <el-table-column
+      v-if="props.tableBtnGroup.length"
+      label="操作"
+      :align="props.tableColumnProperty.align"
+    >
       <template #default="scope">
-        <el-button v-for="(btn, index) in props.tableBtnGroup" :key="index" size="small" @click="handleClick(scope.$index, scope.row, btn.param)" :class="btn.className">{{btn.name}}</el-button>
+        <el-button
+          v-for="(btn, index) in props.tableBtnGroup"
+          :key="index"
+          size="small"
+          @click="handleClick(scope.$index, scope.row, btn.param)"
+          :class="btn.className"
+          >{{ btn.name }}</el-button
+        >
       </template>
     </el-table-column>
   </el-table>

src/router/routes/routes-file-three.ts

@@ -54,6 +54,13 @@ const HomeRoutes = {
       meta: { title: "机型维护", elSvgIcon: "Fold", icon: "table" },
       component: () => import("@/views/BasicsData/modelMaintenance/index.vue"),
     },
+    {
+      path: "/BasicsData/shippingSpace",
+      name: "ShippingSpace",
+      hidden: true,
+      meta: { title: "舱位管理", elSvgIcon: "Fold", icon: "table" },
+      component: () => import("@/views/BasicsData/shippingSpace/index.vue"),
+    },
     {
       path: "/BasicsData/containerMaintenance",
       name: "ContainerMaintenance",

src/views/BasicsData/airlineCompany/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -83,7 +88,7 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增航司信息维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
@@ -91,6 +96,45 @@ const tableForm = reactive<Object>({
   three: "",
   text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "中国国际航空",
+    china: "国航",
+    englin: "AIRCHINA",
+    two: "CA",
+    three: "CCA",
+    text: "CA国航",
+  },
+  {
+    name: "中国国际航空",
+    china: "国航",
+    englin: "AIRCHINA",
+    two: "CA",
+    three: "CCA",
+    text: "CA国航",
+  },
+  {
+    name: "中国国际航空",
+    china: "国航",
+    englin: "AIRCHINA",
+    two: "CA",
+    three: "CCA",
+    text: "CA国航",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "名称", key: "name" },
+    { label: "中文简称", key: "china" },
+    { label: "英文简称", key: "englin" },
+    { label: "航司二字码", key: "two" },
+    { label: "航司三字码", key: "three" },
+    { label: "备注", key: "text" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增航司信息维护";
@@ -100,12 +144,24 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
+  tableForm.two = "";
+  tableForm.three = "";
+  tableForm.text = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑航司信息维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
+  tableForm.two = data.two;
+  tableForm.three = data.three;
+  tableForm.text = data.text;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/airportCompany/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -54,7 +59,7 @@
                 <el-form-item label="公司描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.englin"
                     placeholder="请输入公司描述"
                   />
                 </el-form-item>
@@ -75,14 +80,38 @@ const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增机场公司维护"); //弹窗标题
 const tableOptionser = ref<Array>([]); //弹窗下拉
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
-  two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "中国国际航空",
+    china: "中国国际航空",
+    englin: "",
+  },
+  {
+    name: "中国国际航空",
+    china: "中国国际航空",
+    englin: "",
+  },
+  {
+    name: "中国国际航空",
+    china: "中国国际航空",
+    englin: "",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "公司名称", key: "name" },
+    { label: "公司描述", key: "china" },
+    { label: "上级公司", key: "englin" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增机场公司维护";
@@ -92,12 +121,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑机场公司维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/cargoInformation/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -39,7 +44,7 @@
                 <el-form-item label="货代描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.two"
                     placeholder="请输入货代描述"
                   />
                 </el-form-item>
@@ -59,14 +64,42 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增货代管理"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
-  englin: "",
   two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "货代名称", key: "name" },
+    { label: "货代编码", key: "china" },
+    { label: "货代等级", key: "englin" },
+    { label: "货代描述", key: "two" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增货代管理";
@@ -76,12 +109,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.two = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑货代管理";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.two = data.two;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/containerMaintenance/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -39,7 +44,7 @@
                 <el-form-item label="容器描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.englin"
                     placeholder="请输入容器描述"
                   />
                 </el-form-item>
@@ -59,14 +64,38 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增容器维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
-  two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "容器名称", key: "name" },
+    { label: "容器标识符", key: "china" },
+    { label: "容器描述", key: "englin" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增容器维护";
@@ -76,12 +105,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑容器维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/deployNode/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -36,7 +41,7 @@
                 <el-form-item label="描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.englin"
                     placeholder="请输入机场三字码"
                   />
                 </el-form-item>
@@ -56,14 +61,42 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增节点信息维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
-  two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "名称", key: "name" },
+    { label: "编码", key: "china" },
+    { label: "描述", key: "englin" },
+    { label: "排序", key: "two" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增节点信息维护";
@@ -73,12 +106,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑节点信息维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/equipmentMaintenance/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -30,7 +35,7 @@
               <el-col>
                 <el-form-item label="设备类型">
                   <el-input
-                    v-model="tableForm.china"
+                    v-model="tableForm.englin"
                     placeholder="请输入设备类型"
                   />
                 </el-form-item>
@@ -39,7 +44,7 @@
                 <el-form-item label="设备IP">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.two"
                     placeholder="请输入设备IP"
                   />
                 </el-form-item>
@@ -59,14 +64,50 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增设备维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
-  china: "",
   englin: "",
   two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+    three: "测试",
+    text: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+    three: "测试",
+    text: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+    two: "测试",
+    three: "测试",
+    text: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "设备名称", key: "name" },
+    { label: "所在位置", key: "china" },
+    { label: "设备类型", key: "englin" },
+    { label: "设备IP", key: "two" },
+    { label: "在离线状态", key: "three" },
+    { label: "忙碌空闲", key: "text" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增设备维护";
@@ -76,12 +117,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.englin = "";
+  tableForm.two = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑设备维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.englin = data.englin;
+  tableForm.two = data.two;
 };
 //删除
 const eleDialog = () => {

src/views/BasicsData/modelMaintenance/index.vue

@@ -8,7 +8,14 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :tableBtnGroup="tableBtnGroup"
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+        @aloneDialog="aloneDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -39,7 +46,7 @@
                 <el-form-item label="机型描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.englin"
                     placeholder="请输入机型描述"
                   />
                 </el-form-item>
@@ -55,11 +62,29 @@
 import DataTable from "@/views/table/index.vue";
 import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
+const router = useRouter();
 const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增机型维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableBtnGroup = ref<Array>([
+  {
+    name: "编辑",
+    className: "editBtn",
+    param: 2,
+  },
+  {
+    name: "舱位编辑",
+    className: "editBtn",
+    param: 4,
+  },
+  {
+    name: "删除",
+    className: "delBtn",
+    param: 3,
+  },
+]); //单独的编辑
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
@@ -67,6 +92,33 @@ const tableForm = reactive<Object>({
   three: "",
   text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "机型名称", key: "name" },
+    { label: "机型标识符", key: "china" },
+    { label: "机型描述", key: "englin" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增机型维护";
@@ -76,12 +128,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑机型维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
 };
 //删除
 const eleDialog = () => {
@@ -93,6 +151,10 @@ const eleDialog = () => {
 const delRest = () => {
   flag.value = false;
 };
+//舱位跳转
+const aloneDialog = () => {
+  router.push({ path: "/BasicsData/shippingSpace" });
+};
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {

src/views/BasicsData/shippingSpace/index.vue

@@ -0,0 +1,133 @@
+<template>
+  <div class="airportInfo">
+    <div class="wrap">
+      <Minheader :is-auth="true" :is-statuser="true" @addForm="addForm">
+        <template #header>
+          <div class="status flex-wrap">
+            <div class="manageTitle">舱位管理</div>
+          </div>
+        </template></Minheader
+      >
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
+      <Dialog
+        :flag="flag"
+        :type="type"
+        :msgTitle="msgTitle"
+        @resetForm="resetForm"
+        @delRest="delRest"
+      >
+        <div class="diacont">
+          <el-form :model="tableForm">
+            <el-row :gutter="24">
+              <el-col>
+                <el-form-item label="舱位名称">
+                  <el-input v-model="tableForm.name" placeholder="请输入ID" />
+                </el-form-item>
+              </el-col>
+              <el-col>
+                <el-form-item label="舱位编码">
+                  <el-input
+                    v-model="tableForm.china"
+                    placeholder="请输入航站名称"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col>
+                <el-form-item label="舱位描述">
+                  <el-input
+                    type="textarea"
+                    v-model="tableForm.englin"
+                    placeholder="请输入机场三字码"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </Dialog>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
+import Dialog from "@/components/dialog/index.vue";
+const flag = ref<Boolean>(false); //弹窗开关
+const type = ref<String>(""); //判断是否删除
+const msgTitle = ref<String>("新增舱位管理"); //弹窗标题
+const tableColsCopys = reactive<Object>({}); //弹窗
+const tableForm = reactive({
+  name: "",
+  china: "",
+  englin: "",
+}); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "舱位名称", key: "name" },
+    { label: "舱位编码", key: "china" },
+    { label: "舱位描述", key: "englin" },
+  ],
+  listLoading: true,
+});
+//新增
+const addForm = () => {
+  msgTitle.value = "新增舱位管理";
+  flag.value = true;
+  type.value = "";
+};
+//取消
+const resetForm = () => {
+  flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
+};
+//编辑
+const editDialog = (data) => {
+  msgTitle.value = "编辑舱位管理";
+  flag.value = true;
+  type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
+};
+//删除
+const eleDialog = () => {
+  msgTitle.value = "删除舱位管理";
+  flag.value = true;
+  type.value = "del";
+};
+//删除
+const delRest = () => {
+  flag.value = false;
+};
+</script>
+<style lang="scss" scoped>
+::v-deep .el-form-item__label {
+  width: 80px;
+}
+</style>

src/views/BasicsData/specialCargoMaintenance/index.vue

@@ -8,7 +8,12 @@
           </div>
         </template></Minheader
       >
-      <DataTable @editDialog="editDialog" @eleDialog="eleDialog" />
+      <DataTable
+        :state="state"
+        :tableData="tableData"
+        @editDialog="editDialog"
+        @eleDialog="eleDialog"
+      />
       <Dialog
         :flag="flag"
         :type="type"
@@ -39,7 +44,7 @@
                 <el-form-item label="描述">
                   <el-input
                     type="textarea"
-                    v-model="tableForm.text"
+                    v-model="tableForm.englin"
                     placeholder="请输入描述"
                   />
                 </el-form-item>
@@ -59,14 +64,38 @@ const flag = ref<Boolean>(false); //弹窗开关
 const type = ref<String>(""); //判断是否删除
 const msgTitle = ref<String>("新增特殊货物类型维护"); //弹窗标题
 const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive<Object>({
+const tableForm = reactive({
   name: "",
   china: "",
   englin: "",
-  two: "",
-  three: "",
-  text: "",
 }); //弹窗内容
+//列表
+const tableData = ref([
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+  {
+    name: "测试",
+    china: "测试",
+    englin: "测试",
+  },
+]);
+//表头
+const state = reactive({
+  list: [
+    { label: "类型名称", key: "name" },
+    { label: "类型编码", key: "china" },
+    { label: "描述", key: "englin" },
+  ],
+  listLoading: true,
+});
 //新增
 const addForm = () => {
   msgTitle.value = "新增特殊货物类型维护";
@@ -76,12 +105,18 @@ const addForm = () => {
 //取消
 const resetForm = () => {
   flag.value = false;
+  tableForm.name = "";
+  tableForm.china = "";
+  tableForm.englin = "";
 };
 //编辑
-const editDialog = () => {
+const editDialog = (data) => {
   msgTitle.value = "编辑特殊货物类型维护";
   flag.value = true;
   type.value = "";
+  tableForm.name = data.name;
+  tableForm.china = data.china;
+  tableForm.englin = data.englin;
 };
 //删除
 const eleDialog = () => {

src/views/table/index.vue

@@ -31,135 +31,145 @@ const props = defineProps({
       },
     ],
   },
-});
-const state = reactive({
-  list: [
-    { label: "序号", key: "ID", sortable: true },
-    { label: "姓名", key: "NAME" },
-    { label: "成绩", key: "score", sortable: true, lableClass: "scoreColumn" },
-  ],
-  listLoading: true,
-});
-const tableData = ref([
-  {
-    ID: 0,
-    NAME: "张三",
-    score: "100",
-    children: [
-      {
-        ID: 2,
-        NAME: "王麻子",
-        score: "50",
-        rowClass: "warning-row",
-      },
-    ],
-  },
-  {
-    ID: 1,
-    NAME: "李四三",
-    score: "80",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
-  },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
+  //列表
+  tableData: {
+    type: Array,
+    default: () => [],
   },
-  {
-    ID: 2,
-    NAME: "王麻子",
-    score: "50",
-    rowClass: "warning-row",
+  //表头
+  state: {
+    type: Object,
+    default: () => [],
   },
-]);
+});
+// const state = reactive({
+//   list: [
+//     { label: "序号", key: "ID", sortable: true },
+//     { label: "姓名", key: "NAME" },
+//     { label: "成绩", key: "score", sortable: true, lableClass: "scoreColumn" },
+//   ],
+//   listLoading: true,
+// });
+// const tableData = ref([
+//   {
+//     ID: 0,
+//     NAME: "张三",
+//     score: "100",
+//     children: [
+//       {
+//         ID: 2,
+//         NAME: "王麻子",
+//         score: "50",
+//         rowClass: "warning-row",
+//       },
+//     ],
+//   },
+//   {
+//     ID: 1,
+//     NAME: "李四三",
+//     score: "80",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+//   {
+//     ID: 2,
+//     NAME: "王麻子",
+//     score: "50",
+//     rowClass: "warning-row",
+//   },
+// ]);
 // if () {
 
 // }
@@ -179,14 +189,14 @@ const emits = defineEmits(["editDialog", "eleDialog", "aloneDialog"]);
 //编辑-删除
 const btnClick = (row, index, param) => {
   if (param === 2) {
-    emits("editDialog");
+    emits("editDialog", index); //编辑
   } else if (param === 3) {
-    emits("eleDialog");
+    emits("eleDialog"); //删除
   } else if (param === 4) {
     emits("aloneDialog"); //单独项
   }
-  console.log(row);
-  console.log(index);
+  // console.log(row);
+  // console.log(index);
 };
 
 const loadMore = (type) => {