基础数据

components.d.ts

@@ -7,6 +7,7 @@ declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     Dialog: typeof import('./src/components/dialog/index.vue')['default']
     ElSvgIcon: typeof import('./src/components/ElSvgIcon.vue')['default']
+    Minheader: typeof import('./src/components/minheader/index.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     Table: typeof import('./src/components/table/index.vue')['default']

src/components/minheader/index.vue

@@ -0,0 +1,45 @@
+<template>
+  <div
+    :class="isStatus || isStatuser ? 'flex' : 'flex-end'"
+    class="data-table-btn"
+  >
+    <div v-if="isStatus || isStatuser" class="vStatus">
+      <slot name="header" />
+    </div>
+    <template v-if="isBtn">
+      <template v-if="isAuth">
+        <el-button size="default" plain class="btn-white br">新增</el-button>
+      </template>
+    </template>
+  </div>
+</template>
+<script setup lang="ts">
+const props = defineProps({
+  //是否显示新增按钮
+  isBtn: {
+    type: Boolean,
+    default: true,
+  },
+  //是否启用权限按钮
+  isAuth: {
+    type: Boolean,
+    default: false,
+  },
+  //是否显示状态
+  isStatus: {
+    type: Boolean,
+    default: false,
+  },
+  //是否显示名称
+  isStatuser: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
+<style lang="scss" scoped>
+.data-table-btn {
+  line-height: 32px;
+  margin-bottom: 20px;
+}
+</style>

src/styles/index.scss

@@ -131,3 +131,10 @@
   justify-content: flex-end;
   align-items: center;
 }
+.br {
+  border: 1px solid #d2d6df;
+  box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.06);
+  border-radius: 4px !important;
+  width: 64px;
+  height: 32px;
+}

src/views/BasicsData/airlineCompany/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">航司信息维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/airportCompany/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">机场公司维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/airportInfo/index.vue

@@ -1,28 +1,391 @@
 <template>
-  <div class="airportInfo">
-    <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
-        <template #header>
-          <div class="status flex-wrap">
-            <div class="manageTitle">机场信息维护</div>
+  <div class="airportInfoDetails">
+    <Minheader :is-auth="true" :is-statuser="true">
+      <template #header>
+        <div class="status flex-wrap">
+          <div class="manageTitle">机场信息维护</div>
+        </div>
+      </template></Minheader
+    >
+    <div class="airportInfo-content">
+      <el-row :gutter="24">
+        <el-col :span="6" style="background: #fff">
+          <div class="tree_left">
+            <el-scrollbar style="height: 100%">
+              <div class="corporate">{{ company }}</div>
+              <el-tree :data="data2"> </el-tree>
+            </el-scrollbar>
           </div>
-        </template>
-      </DataTable>
+        </el-col>
+        <el-col :span="18">
+          <DataTable />
+        </el-col>
+      </el-row>
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
+<script setup lang="ts">
+import Minheader from "@/components/minheader/index.vue";
+import DataTable from "@/views/table/index.vue";
+const company = ref("所属公司");
+const data2 = reactive([
+  {
+    id: 1,
+    label: "Level one 1",
+    children: [
+      {
+        id: 4,
+        label: "Level two 1-1",
+        children: [
+          {
+            id: 9,
+            label: "Level three 1-1-1",
+          },
+          {
+            id: 10,
+            label: "Level three 1-1-2",
+          },
+        ],
+      },
+    ],
+  },
+  {
+    id: 2,
+    label: "Level one 2",
+    children: [
+      {
+        id: 5,
+        label: "Level two 2-1",
+      },
+      {
+        id: 6,
+        label: "Level two 2-2",
+      },
+    ],
+  },
+  {
+    id: 3,
+    label: "Level one 3",
+    children: [
+      {
+        id: 7,
+        label: "Level two 3-1",
+      },
+      {
+        id: 8,
+        label: "Level two 3-2",
+      },
+    ],
   },
-  setup() {},
-});
+]);
 </script>
 <style lang="scss" scoped>
-.airportInfo {
+.airportInfoDetails {
+  .airportInfoDetails-head {
+    padding: 32px 40px 0px 32px;
+    background: #ffffff;
+    box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+    border-radius: 4px;
+    .airportInfoDetails-head-content {
+      margin-top: 30px;
+      .el-input {
+        min-width: 240px;
+      }
+      .el-form--inline .el-form-item {
+        margin-bottom: 24px;
+        margin-right: 50px;
+      }
+    }
+  }
+  .corporate {
+    margin-top: 24px;
+    margin-left: 24px;
+    margin-bottom: 23px;
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    color: #101116;
+  }
+  .log {
+    width: 26px;
+    height: 26px;
+    background: #eb2f3b;
+    border-radius: 50%;
+    margin-right: 15px;
+    background: url("../../../../assets/index/ic_close_hint.png") no-repeat;
+    background-size: 100% 100%;
+  }
+  .airportInfoDialog {
+    ::v-deep .el-form-item__content {
+      margin-left: 120px !important;
+    }
+    ::v-deep .el-form-item__label {
+      width: 120px !important;
+    }
+    ::v-deep .el-form-item {
+      margin-bottom: 20px;
+    }
+  }
+  .airportInfo-content {
+    margin-top: 30px;
+    img {
+      margin: 0 auto;
+      margin-top: 10%;
+      display: -webkit-box;
+      -webkit-box-pack: center;
+      -webkit-box-align: center;
+      -webkit-box-orient: vertical;
+      text-align: center;
+    }
+    .grid-content {
+      padding: 24px;
+      margin-bottom: 24px;
+      height: 144px;
+      .edit_log {
+        position: relative;
+        // top: -2px;
+      }
+      .icon {
+        cursor: pointer;
+      }
+      .desc {
+        margin-top: 60px;
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #afb4bf;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+  ::v-deep .el-input__suffix {
+    right: 30px;
+  }
+  ::v-deep .el-input__inner {
+    height: 32px;
+    border-radius: 2px;
+  }
+  .flxdes {
+    padding: 10px 0px 10px 20px;
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    height: 36px;
+    background: #eb2f3b;
+    color: #ffffff;
+    margin-bottom: 46px;
+    width: 100%;
+  }
+  .airportInfoDetails-content {
+    height: 60vh;
+    overflow-x: hidden;
+    overflow-y: auto;
+    padding: 32px 0x 0 0;
+    // background: #ffffff;
+    // box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+    border-radius: 4px;
+    // margin-top: 24px;
+    .terminal-info {
+      margin-top: 20px;
+      margin-bottom: 20px;
+      .terminal-info-add {
+        width: 216px;
+        height: 120px;
+        background: #f5f7fa;
+        border: 1px dashed #d7dae3;
+        border-radius: 8px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        cursor: pointer;
+        .icon {
+          font-size: 31px;
+          color: #d7dae3;
+        }
+      }
+      .terminal-info-team {
+        .terminal-info-list {
+          width: 216px;
+          height: 120px;
+          margin-bottom: 24px;
+          background: #f5f7fa;
+          box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+          border-radius: 8px;
+          padding: 24px;
+          position: relative;
+          margin-right: 24px;
+          cursor: pointer;
+          .name {
+            font-size: 18px;
+            font-family: Microsoft YaHei;
+            font-weight: bold;
+            color: #303133;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+          }
+          .edit {
+            margin-top: 32px;
+            .round {
+              display: inline-block;
+              width: 28px;
+              height: 28px;
+              background: #6e82a7;
+              border-radius: 50%;
+              line-height: 28px;
+              text-align: center;
+              box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              position: absolute;
+              right: 0;
+              i {
+                color: #fff;
+              }
+            }
+          }
+          .close {
+            width: 24px;
+            height: 24px;
+            background: #000000;
+            opacity: 0.8;
+            border-radius: 50%;
+            position: absolute;
+            right: -12px;
+            line-height: 24px;
+            text-align: center;
+            top: -12px;
+            i {
+              color: #fff;
+            }
+          }
+          &:last-child {
+            margin-right: 0;
+          }
+        }
+        .active {
+          border: 2px solid #9ebbf7;
+          .name {
+            color: #fff;
+          }
+          .edit {
+            .round {
+              background: #fff;
+              i {
+                color: #6e82a7;
+              }
+            }
+          }
+        }
+      }
+    }
+
+    .locationBox {
+      // padding: 0 0 0 32px;
+      // background: #ffffff;
+
+      margin-top: 30px;
+    }
+    .LBox {
+      display: flex;
+      flex-wrap: wrap;
+      width: 100%;
+      margin-top: 40px;
+      margin-bottom: 20px;
+    }
+    .lbox-add {
+      width: 100%;
+      height: 144px;
+      background: #f5f7fa;
+      border: 1px dashed #9ebbf7;
+      border-radius: 8px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      cursor: pointer;
+      .icon {
+        font-size: 31px;
+        color: #9ebbf7;
+      }
+    }
+    .forBox {
+      width: 230px;
+      height: 120px;
+      margin-bottom: 24px;
+      background: #f5f7fa;
+      box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+      border-radius: 8px;
+      padding: 24px;
+      position: relative;
+      margin-right: 24px;
+      cursor: pointer;
+      .name {
+        font-size: 18px;
+        font-family: Microsoft YaHei;
+        font-weight: bold;
+        color: #303133;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .edit {
+        margin-top: 32px;
+        .round {
+          display: inline-block;
+          width: 28px;
+          height: 28px;
+          // background: #f5f7fa;
+          border-radius: 50%;
+          line-height: 28px;
+          text-align: center;
+          // box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          position: absolute;
+          right: 20px;
+          i {
+            color: #fff;
+          }
+        }
+      }
+      .close {
+        width: 24px;
+        height: 24px;
+        background: #000000;
+        opacity: 0.8;
+        border-radius: 50%;
+        position: absolute;
+        right: -12px;
+        line-height: 24px;
+        text-align: center;
+        top: -12px;
+        i {
+          color: #fff;
+        }
+      }
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+    .active {
+      // background: #6e82a7;
+      border: 2px solid #9ebbf7;
+      .name {
+        // color: #fff;
+      }
+      .edit {
+        .round {
+          background: #fff;
+          i {
+            color: #6e82a7;
+          }
+        }
+      }
+    }
+  }
 }
 </style>

src/views/BasicsData/cargoInformation/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">代货信息维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/containerMaintenance/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">容器维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/deployNode/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">节点信息维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/equipmentMaintenance/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">设备维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/modelMaintenance/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">机型维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {

src/views/BasicsData/specialCargoMaintenance/index.vue

@@ -1,26 +1,20 @@
 <template>
   <div class="airportInfo">
     <div class="wrap">
-      <DataTable :is-auth="true" :is-statuser="true">
+      <Minheader :is-auth="true" :is-statuser="true">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">特殊货物类型维护</div>
           </div>
-        </template>
-      </DataTable>
+        </template></Minheader
+      >
+      <DataTable />
     </div>
   </div>
 </template>
-<script lang="ts">
-import { defineComponent } from "vue";
-import DataTable from "@/components/table2/index.vue";
-
-export default defineComponent({
-  components: {
-    DataTable,
-  },
-  setup() {},
-});
+<script setup lang="ts">
+import DataTable from "@/views/table/index.vue";
+import Minheader from "@/components/minheader/index.vue";
 </script>
 <style lang="scss" scoped>
 .airportInfo {