Merge branch 'master' of http://120.26.64.82:3000/BFFE/SZYGM1.0

mock/airlineAbnormalBaggageData.json

@@ -0,0 +1,38 @@
+{
+  "code": 200,
+  "data": {
+    "options": [
+      {
+        "series": [
+          {
+            "data": [
+              93,
+              814,
+              287,
+              1112,
+              559
+            ]
+          },
+          {
+            "data": [
+              445,
+              946,
+              900,
+              523,
+              1039
+            ]
+          },
+          {
+            "data": [
+              419,
+              886,
+              812,
+              934,
+              1196
+            ]
+          }
+        ]
+      }
+    ]
+  }
+}

mock/hourPeakData.json

@@ -0,0 +1,343 @@
+{
+  "code": 200,
+  "data": {
+    "series": [
+      {
+        "data": [
+          1,
+          2,
+          1,
+          1,
+          4,
+          0,
+          6,
+          3,
+          6,
+          4,
+          2,
+          1,
+          4,
+          5,
+          6,
+          1,
+          0,
+          0,
+          1,
+          6,
+          3,
+          4,
+          0,
+          3
+        ]
+      },
+      {
+        "data": [
+          6,
+          0,
+          3,
+          4,
+          1,
+          4,
+          3,
+          5,
+          1,
+          4,
+          6,
+          3,
+          1,
+          2,
+          6,
+          3,
+          4,
+          6,
+          4,
+          6,
+          1,
+          1,
+          5,
+          5
+        ]
+      },
+      {
+        "data": [
+          3,
+          3,
+          1,
+          0,
+          6,
+          2,
+          0,
+          4,
+          5,
+          1,
+          2,
+          6,
+          2,
+          0,
+          1,
+          6,
+          0,
+          0,
+          1,
+          5,
+          6,
+          0,
+          2,
+          5
+        ]
+      },
+      {
+        "data": [
+          3,
+          6,
+          5,
+          2,
+          3,
+          2,
+          0,
+          6,
+          3,
+          1,
+          5,
+          0,
+          4,
+          2,
+          5,
+          1,
+          3,
+          0,
+          6,
+          1,
+          3,
+          0,
+          5,
+          6
+        ]
+      },
+      {
+        "data": [
+          5,
+          4,
+          3,
+          1,
+          0,
+          5,
+          4,
+          3,
+          4,
+          5,
+          4,
+          6,
+          5,
+          6,
+          5,
+          0,
+          4,
+          3,
+          6,
+          3,
+          4,
+          6,
+          6,
+          3
+        ]
+      },
+      {
+        "data": [
+          1,
+          5,
+          5,
+          5,
+          3,
+          2,
+          4,
+          0,
+          6,
+          3,
+          1,
+          2,
+          6,
+          1,
+          6,
+          2,
+          0,
+          0,
+          3,
+          1,
+          3,
+          0,
+          6,
+          2
+        ]
+      },
+      {
+        "data": [
+          3,
+          6,
+          1,
+          4,
+          0,
+          4,
+          2,
+          5,
+          4,
+          4,
+          6,
+          2,
+          0,
+          3,
+          1,
+          6,
+          6,
+          1,
+          0,
+          3,
+          6,
+          3,
+          0,
+          5
+        ]
+      },
+      {
+        "data": [
+          6,
+          5,
+          0,
+          5,
+          3,
+          2,
+          5,
+          0,
+          0,
+          3,
+          6,
+          5,
+          5,
+          1,
+          6,
+          2,
+          4,
+          2,
+          2,
+          0,
+          2,
+          3,
+          5,
+          2
+        ]
+      },
+      {
+        "data": [
+          2,
+          4,
+          2,
+          4,
+          6,
+          1,
+          0,
+          0,
+          3,
+          0,
+          6,
+          2,
+          5,
+          5,
+          5,
+          4,
+          6,
+          0,
+          0,
+          0,
+          3,
+          2,
+          0,
+          0
+        ]
+      },
+      {
+        "data": [
+          3,
+          2,
+          0,
+          5,
+          6,
+          6,
+          2,
+          2,
+          1,
+          6,
+          3,
+          2,
+          6,
+          6,
+          0,
+          1,
+          3,
+          4,
+          6,
+          3,
+          1,
+          6,
+          2,
+          3
+        ]
+      },
+      {
+        "data": [
+          1,
+          4,
+          0,
+          4,
+          2,
+          3,
+          5,
+          3,
+          0,
+          0,
+          3,
+          2,
+          3,
+          0,
+          3,
+          3,
+          5,
+          0,
+          0,
+          3,
+          0,
+          0,
+          2,
+          2
+        ]
+      },
+      {
+        "data": [
+          1,
+          0,
+          3,
+          6,
+          6,
+          0,
+          6,
+          3,
+          4,
+          0,
+          3,
+          5,
+          6,
+          0,
+          3,
+          4,
+          4,
+          0,
+          4,
+          3,
+          3,
+          0,
+          2,
+          5
+        ]
+      }
+    ]
+  }
+}

src/components/Echarts/commonChartsChinaMap.vue

@@ -13,6 +13,8 @@
 <script>
 // 饼图初始数据
 import ChartsChinaMap from '../mixin/commonChartsChinaMap'
+import * as _ from 'lodash'
+import * as echarts from "echarts";
 export default {
   name: 'ChartsChinaMap',
   props: {
@@ -40,7 +42,7 @@ export default {
     // 饼图dom
     const chartDom = document.getElementById(this.id)
     // 饼图初始化
-    this.myChart = this.$echarts.init(chartDom)
+    this.myChart = echarts.init(chartDom)
     // 生成饼图
     this.myChart.setOption(objData)
     // 监听页面缩放 防止dom重复渲染
@@ -64,7 +66,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped>
+<style lang="scss" scoped>
 .ChartsChinaMap {
   height: 100%;
   width: 100%;

src/components/mixin/commonChartsChinaMap.js

@@ -6,7 +6,7 @@
  * @Description: In User Settings Edit
  * @FilePath: \bigDataScreen\src\components\mixin\commonChartsChinaMap.js
  */
-import '../../util/china'
+import '../../utils/china'
 var geoCoordMap = {
   '上海': [121.4648, 31.2891],
   '东莞': [113.8953, 22.901],
@@ -125,16 +125,11 @@ var geoCoordMap = {
 };
 
 var BJData = [
-  [{ name: '北京' }, { name: '上海', value: 95 }],
-  [{ name: '北京' }, { name: '广州', value: 90 }],
-  [{ name: '北京' }, { name: '大连', value: 80 }],
-  [{ name: '北京' }, { name: '南宁', value: 70 }],
-  [{ name: '北京' }, { name: '南昌', value: 60 }],
-  [{ name: '北京' }, { name: '拉萨', value: 50 }],
-  [{ name: '北京' }, { name: '长春', value: 40 }],
-  [{ name: '北京' }, { name: '包头', value: 30 }],
-  [{ name: '北京' }, { name: '重庆', value: 20 }],
-  [{ name: '北京' }, { name: '常州', value: 10 }]
+  [{ name: '北京' }, { name: '深圳', value: 95 }],
+  [{ name: '成都' }, { name: '深圳', value: 95 }],
+  [{ name: '重庆' }, { name: '深圳', value: 95 }],
+  [{ name: '西安' }, { name: '深圳', value: 95 }],
+  [{ name: '太原' }, { name: '深圳', value: 95 }],
 ];
 
 var SHData = [
@@ -151,16 +146,16 @@ var SHData = [
 ];
 
 var GZData = [
-  [{ name: '广州' }, { name: '福州', value: 95 }],
-  [{ name: '广州' }, { name: '太原', value: 90 }],
-  [{ name: '广州' }, { name: '长春', value: 80 }],
-  [{ name: '广州' }, { name: '重庆', value: 70 }],
-  [{ name: '广州' }, { name: '西安', value: 60 }],
-  [{ name: '广州' }, { name: '成都', value: 50 }],
-  [{ name: '广州' }, { name: '常州', value: 40 }],
-  [{ name: '广州' }, { name: '北京', value: 30 }],
-  [{ name: '广州' }, { name: '北海', value: 20 }],
-  [{ name: '广州' }, { name: '海口', value: 10 }]
+  [{ name: '深圳' }, { name: '福州', value: 95 }],
+  [{ name: '深圳' }, { name: '太原', value: 90 }],
+  [{ name: '深圳' }, { name: '长春', value: 80 }],
+  [{ name: '深圳' }, { name: '重庆', value: 70 }],
+  [{ name: '深圳' }, { name: '西安', value: 60 }],
+  [{ name: '深圳' }, { name: '成都', value: 50 }],
+  [{ name: '深圳' }, { name: '常州', value: 40 }],
+  [{ name: '深圳' }, { name: '北京', value: 30 }],
+  [{ name: '深圳' }, { name: '北海', value: 20 }],
+  [{ name: '深圳' }, { name: '海口', value: 10 }]
 ];
 
 var planePath = 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z';
@@ -185,7 +180,8 @@ var convertData = function (data) {
 
 var color = ['#a6c84c', '#ffa022', '#46bee9'];
 var series = [];
-[['北京', BJData], ['上海', SHData], ['广州', GZData]].forEach(function (item, i) {
+//[['北京', BJData], ['上海', SHData], ['广州', GZData]]
+[['北京', BJData], ['深圳', GZData]].forEach(function (item, i) {
   //console.log(item,i);
   series.push({
     name: item[0] + ' Top10',

src/views/BasicsData/cargoInformation/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="cargoInformationForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="货代名称" size="default">
+                <el-form-item
+                  label="货代名称"
+                  size="default"
+                  prop="agentName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.agentName"
                     placeholder="请输入货代名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="货代编码" size="default">
+                <el-form-item
+                  label="货代编码"
+                  size="default"
+                  prop="agentCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.agentCode"
                     placeholder="请输入货代编码"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -207,8 +222,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const cargoInformationForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  cargoInformationForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/containerMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="containerMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="容器名称" size="default">
+                <el-form-item
+                  label="容器名称"
+                  size="default"
+                  prop="containerName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.containerName"
                     placeholder="请输入容器名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="标识符" size="default">
+                <el-form-item
+                  label="标识符"
+                  size="default"
+                  prop="containerCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.containerCode"
                     placeholder="请输入标识符"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -206,8 +221,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const containerMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  containerMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/deployNode/index.vue

@@ -27,10 +27,15 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form :model="tableForm" :rules="formRules" ref="deployNodeForm">
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="名称" size="default">
+                <el-form-item
+                  label="名称"
+                  size="default"
+                  prop="nodeName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.nodeName"
                     placeholder="请输入名称"
@@ -38,7 +43,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="编码" size="default">
+                <el-form-item
+                  label="编码"
+                  size="default"
+                  prop="nodeCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.nodeCode"
                     placeholder="请输入航站名称"
@@ -67,6 +77,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -207,8 +218,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const deployNodeForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  deployNodeForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;
@@ -254,6 +272,6 @@ getQuery();
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {
-  width: 50px;
+  width: 70px;
 }
 </style>

src/views/BasicsData/equipmentMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="equipmentMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="设备名称" size="default">
+                <el-form-item
+                  label="设备名称"
+                  size="default"
+                  prop="deviceName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.deviceName"
                     placeholder="请输入设备名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="设备类型" size="default">
+                <el-form-item
+                  label="设备类型"
+                  size="default"
+                  prop="deviceType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.deviceType"
                     placeholder="请输入设备类型"
@@ -46,7 +60,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="设备IP" size="default">
+                <el-form-item
+                  label="设备IP"
+                  size="default"
+                  prop="deviceIP"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     type="textarea"
                     v-model="tableForm.deviceIP"
@@ -67,6 +86,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -209,8 +229,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const equipmentMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  equipmentMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/modelMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="modelMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="机型名称" size="default">
+                <el-form-item
+                  label="机型名称"
+                  size="default"
+                  prop="modelName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.modelName"
                     placeholder="请输入机型名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="标识符" size="default">
+                <el-form-item
+                  label="标识符"
+                  size="default"
+                  prop="modelType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.modelType"
                     placeholder="请输入标识符"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -222,8 +237,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const modelMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  modelMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/shippingSpace/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="shippingSpaceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="舱位名称" size="default">
+                <el-form-item
+                  label="舱位名称"
+                  size="default"
+                  prop="storingName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.storingName"
                     placeholder="请输入舱位名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="舱位编码" size="default">
+                <el-form-item
+                  label="舱位编码"
+                  size="default"
+                  prop="storingCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.storingCode"
                     placeholder="请输入舱位编码"
@@ -66,6 +80,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const route = useRoute();
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
@@ -208,8 +223,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const shippingSpaceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  shippingSpaceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/specialCargoMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="specialCargoMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="类型名称" size="default">
+                <el-form-item
+                  label="类型名称"
+                  size="default"
+                  prop="specialTypeName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.specialTypeName"
                     placeholder="请输入类型名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="类型编码" size="default">
+                <el-form-item
+                  label="类型编码"
+                  size="default"
+                  prop="specialType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.specialType"
                     placeholder="请输入类型编码"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -206,8 +221,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const specialCargoMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  specialCargoMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/dashboard/index.vue

@@ -3,7 +3,9 @@
     <div class="dashboard-head flex">
       <!-- <div class="dashboard-head-title">{{title}}</div> -->
       <div class="dashboard-head-tabs flex-wrap">
-        <div class="dashboard-head-tabs-list" :class="tabsIndex == index ? 'active' : ''" @click="tabClick(item,index)" v-for="(item,index) in tabs" :key="index">{{item.label}}</div>
+        <div class="dashboard-head-tabs-list" :class="tabsIndex == index ? 'active' : ''" @click="tabClick(item, index)" v-for="(item, index) in tabs" :key="index">
+          {{ item.label }}
+        </div>
       </div>
       <!-- <div class="dashboard-head-zw"></div> -->
     </div>
@@ -12,10 +14,16 @@
         <div class="dashboard-content-top-left">
           <div class="dashboard-content-top-left-item">
             <div class="dashboard-content-top-left-item-top">
-              <div class="dashboard-content-top-left-item-top-title">小时峰值分布</div>
+              <div class="dashboard-content-top-left-item-top-title">
+                小时峰值分布
+              </div>
               <div class="dashboard-content-top-left-item-top-time" @click="showDatePicker">
-                <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-                <el-icon color="#ffffff"><CaretBottom /></el-icon>
+                <el-icon color="#ffffff" size="18">
+                  <Calendar />
+                </el-icon>
+                <el-icon color="#ffffff">
+                  <CaretBottom />
+                </el-icon>
               </div>
             </div>
             <div class="dashboard-content-top-left-item-bottom">
@@ -24,49 +32,99 @@
           </div>
           <div class="dashboard-content-top-left-item">
             <div class="dashboard-content-top-left-item-top">
-              <div class="dashboard-content-top-left-item-top-title">运单趋势分析</div>
+              <div class="dashboard-content-top-left-item-top-title">
+                运单趋势分析
+              </div>
               <div class="dashboard-content-top-left-item-top-time" @click="showDatePicker">
-                <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-                <el-icon color="#ffffff"><CaretBottom /></el-icon>
+                <el-icon color="#ffffff" size="18">
+                  <Calendar />
+                </el-icon>
+                <el-icon color="#ffffff">
+                  <CaretBottom />
+                </el-icon>
               </div>
             </div>
             <div class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww12" :option="optionLeft" />
             </div>
           </div>
-
         </div>
+        <!-- 地图 -->
         <div class="dashboard-content-top-center">
-          <div class="dashboard-content-bottom-center-top">
-
-          </div>
-          <div class="dashboard-content-bottom-center-bottom">
-            <Echarts id="ww2" :option="optionLeft" />
+          <div class="dashboard-content-top-center-top"></div>
+          <div class="dashboard-content-top-center-bottom">
+            <div class="dashboard-content-top-center-bottom-box1">
+              <div class="dashboard-content-top-center-bottom-box1-title">航班数</div>
+              <div class="dashboard-content-top-center-bottom-box1-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+              </div>
+              <div class="dashboard-content-top-center-bottom-box1-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+              </div>
+              <div class="dashboard-content-top-center-bottom-box1-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+              </div>
+            </div>
+            <div class="dashboard-content-top-center-bottom-box2">
+              <div class="dashboard-content-top-center-bottom-box2-title">运单数</div>
+              <div class="dashboard-content-top-center-bottom-box2-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+                <div>重量：1100</div>
+              </div>
+              <div class="dashboard-content-top-center-bottom-box2-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+                <div>重量：1100</div>
+              </div>
+              <div class="dashboard-content-top-center-bottom-box2-info">
+                <div>本年：1000</div>
+                <div>同期：1100</div>
+                <div>重量：1100</div>
+              </div>
+            </div>
+            <EchartsMap id="ww2" />
           </div>
         </div>
         <div class="dashboard-content-top-right">
           <div class="dashboard-content-top-right-item">
             <div class="dashboard-content-top-right-item-top">
-              <div class="dashboard-content-top-right-item-top-title">航班预警报警分析</div>
+              <div class="dashboard-content-top-right-item-top-title">
+                航班预警报警分析
+              </div>
               <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker">
-                <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-                <el-icon color="#ffffff"><CaretBottom /></el-icon>
+                <el-icon color="#ffffff" size="18">
+                  <Calendar />
+                </el-icon>
+                <el-icon color="#ffffff">
+                  <CaretBottom />
+                </el-icon>
               </div>
             </div>
             <div class="dashboard-content-top-right-item-bottom">
-              <Echarts id="ww3" :option="optionLeft" />
+
+              <Echarts id="ww3" :option="airlineAbnormalBaggage.option" />
             </div>
           </div>
           <div class="dashboard-content-top-right-item">
             <div class="dashboard-content-top-right-item-top">
-              <div class="dashboard-content-top-right-item-top-title">航司运量统计</div>
+              <div class="dashboard-content-top-right-item-top-title">
+                航司运量统计
+              </div>
               <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker">
-                <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-                <el-icon color="#ffffff"><CaretBottom /></el-icon>
+                <el-icon color="#ffffff" size="18">
+                  <Calendar />
+                </el-icon>
+                <el-icon color="#ffffff">
+                  <CaretBottom />
+                </el-icon>
               </div>
             </div>
             <div class="dashboard-content-top-left-item-bottom">
-              <Echarts id="ww33" :option="optionLeft" />
+              <Echarts id="ww33" :option="airCompaneBaggage.option" />
             </div>
           </div>
         </div>
@@ -74,34 +132,48 @@
       <div class="dashboard-content-bottom flex">
         <div class="dashboard-content-bottom-left">
           <div class="dashboard-content-bottom-left-top">
-            <div class="dashboard-content-bottom-left-top-title">节点峰值分布</div>
+            <div class="dashboard-content-bottom-left-top-title">
+              节点峰值分布
+            </div>
             <div class="dashboard-content-bottom-left-top-time" @click="showDatePicker">
-              <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-              <el-icon color="#ffffff"><CaretBottom /></el-icon>
+              <el-icon color="#ffffff" size="18">
+                <Calendar />
+              </el-icon>
+              <el-icon color="#ffffff">
+                <CaretBottom />
+              </el-icon>
             </div>
           </div>
           <div class="dashboard-content-bottom-left-bottom">
-            <Echarts id="ww4" :option="optionLeft" />
+            <Echarts id="ww4" :option="hourPeak.option" />
           </div>
         </div>
         <div class="dashboard-content-bottom-center">
           <div class="dashboard-content-bottom-center-top">
-            <div class="dashboard-content-bottom-center-top-title">节点效率分析</div>
+            <div class="dashboard-content-bottom-center-top-title">
+              节点效率分析
+            </div>
             <div class="dashboard-content-bottom-center-top-time" @click="showDatePicker">
-              <el-icon color="#ffffff" size="18"><Calendar /></el-icon>
-              <el-icon color="#ffffff"><CaretBottom /></el-icon>
+              <el-icon color="#ffffff" size="18">
+                <Calendar />
+              </el-icon>
+              <el-icon color="#ffffff">
+                <CaretBottom />
+              </el-icon>
             </div>
           </div>
           <div class="dashboard-content-bottom-center-bottom">
-            <Echarts id="ww5" :option="optionLeft" />
+            <Echarts id="ww5" :option="nodeEfficiency.option" />
           </div>
         </div>
         <div class="dashboard-content-bottom-right">
           <div class="dashboard-content-bottom-right-top">
-            <div class="dashboard-content-bottom-center-top-title">航班动态统计</div>
+            <div class="dashboard-content-bottom-center-top-title">
+              航班动态统计
+            </div>
           </div>
           <div class="dashboard-content-bottom-right-bottom">
-            <Echarts id="ww6" :option="optionLeft" />
+            <Echarts id="ww6" :option="airStutas.option" />
           </div>
         </div>
       </div>
@@ -109,26 +181,10 @@
     <Dialog :flag="flag" @resetForm="resetForm" @submitForm="submitForm">
       <el-form :model="form" label-width="120px">
         <el-form-item label="开始日期">
-          <el-date-picker
-          :disabled-date="disabledStartDate"
-            v-model="form.startDate"
-            type="date"
-            placeholder="请选择开始日期"
-            size="default"
-            format="YYYY/MM/DD"
-            value-format="YYYY-MM-DD"
-          />
+          <el-date-picker :disabled-date="disabledStartDate" v-model="form.startDate" type="date" placeholder="请选择开始日期" size="default" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
         </el-form-item>
         <el-form-item label="结束日期">
-          <el-date-picker
-            :disabled-date="disabledEndDate"
-            v-model="form.endDate"
-            type="date"
-            placeholder="请选择结束日期"
-            size="default"
-            format="YYYY-MM-DD"
-            value-format="YYYY-MM-DD"
-          />
+          <el-date-picker :disabled-date="disabledEndDate" v-model="form.endDate" type="date" placeholder="请选择结束日期" size="default" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
         </el-form-item>
       </el-form>
     </Dialog>
@@ -136,33 +192,35 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import Echarts from "@/components/Echarts/commonChartsBar.vue";
-import {Calendar,CaretBottom} from "@element-plus/icons-vue"
-import  Dialog  from "@/components/dialog/index.vue";
+import EchartsMap from "@/components/Echarts/commonChartsChinaMap.vue";
+import { Calendar, CaretBottom } from "@element-plus/icons-vue";
+import Dialog from "@/components/dialog/index.vue";
+import axios from "axios";
 const title = ref("决策管理驾驶舱");
 const form = ref({
-  startDate:Date.now(),
-  endDate:Date.now()
-})
+  startDate: Date.now(),
+  endDate: Date.now(),
+});
 
 const disabledStartDate = (time: Date) => {
-  let data = new Date(form.value.endDate)
-  return time.getTime() > data.getTime()
-}
+  let data = new Date(form.value.endDate);
+  return time.getTime() > data.getTime();
+};
 const disabledEndDate = (time: Date) => {
-  let data = new Date(form.value.startDate)
-  return  data.getTime() > time.getTime()
-}
+  let data = new Date(form.value.startDate);
+  return data.getTime() > time.getTime();
+};
 
-const flag = ref(false)
+const flag = ref(false);
 const resetForm = () => {
-  flag.value = false
-}
+  flag.value = false;
+};
 
 const submitForm = () => {
-  flag.value = false
-}
+  flag.value = false;
+};
 const tabs = [
   {
     id: 1,
@@ -198,7 +256,7 @@ const optionLeft = {
   // },
   grid: {
     left: "0%",
-    right: "0%",
+    right: "5%",
     bottom: "0%",
     top: "15%",
     containLabel: true,
@@ -221,21 +279,37 @@ const optionLeft = {
       color: "#8897BC",
     },
   },
-  yAxis: {
-    type: "value",
-    axisLabel: {
-      color: "#8897BC",
-      formatter: function (item) {
-        return item / 10000 + "万";
+  yAxis: [
+    {
+      type: "value",
+      name: "运单/件",
+      axisLabel: {
+        color: "#8897BC",
+        formatter: function (item) {
+          return item / 10000 + "万";
+        },
+      },
+      splitLine: {
+        lineStyle: {
+          type: "dashed",
+          color: "rgba(196,194,225, 0.54)",
+        },
       },
     },
-    splitLine: {
-      lineStyle: {
-        type: "dashed",
-        color: "rgba(196,194,225, 0.54)",
+    {
+      type: "value",
+      name: "重量(吨)",
+      axisLabel: {
+        color: "#8897BC",
+      },
+      splitLine: {
+        lineStyle: {
+          type: "dashed",
+          color: "rgba(196,194,225, 0.54)",
+        },
       },
     },
-  },
+  ],
   series: [
     {
       name: "运输总数",
@@ -293,15 +367,341 @@ const optionLeft = {
     },
   ],
 };
+
+const airlineAbnormalBaggage = ref({
+  component: "commonChartsBar",
+  option: {
+    baseOption: {
+      legend: {
+        data: ["报警", "预警"],
+        right: "20",
+        textStyle: {
+          color: "#8897BC",
+        },
+        // top:"-10"
+      },
+      color: ["#EC3B71", "#E5B35C"],
+      grid: {
+        bottom: "10%",
+        left: "5%",
+        right: "1%",
+        top: "15%",
+      },
+      xAxis: {
+        data: ["核单", "安检", "理货", "待运区", "货站", "机下", "装机"],
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: "#8897BC",
+          },
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          color: "#8897BC",
+        },
+      },
+      yAxis: {
+        type: "value",
+        axisLabel: {
+          color: "#8897BC",
+        },
+        splitLine: {
+          lineStyle: {
+            type: "dashed",
+            color: "rgba(196,194,225, 0.54)",
+          },
+        },
+      },
+      series: [
+        {
+          name: "报警",
+          type: "bar",
+          data: [12, 10, 15, 11, 16, 4, 6],
+        },
+        {
+          name: "预警",
+          type: "bar",
+          data: [11, 15, 17, 8, 1, 4, 6],
+        },
+      ],
+    },
+  },
+});
+
+const airCompaneBaggage = ref({
+  component: "commonChartsBar",
+  option: {
+    baseOption: {
+      legend: {
+        data: ["2020年", "2021年"],
+        right: "20",
+        textStyle: {
+          color: "#8897BC",
+        },
+      },
+      color: ["#51DEE9", "#4C88E1"],
+      grid: {
+        bottom: "10%",
+        left: "5%",
+        right: "1%",
+        top: "15%",
+      },
+      xAxis: {
+        data: ["国航", "南航", "深航", "东航", "海航", "国泰", "川航"],
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: "#8897BC",
+          },
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          color: "#8897BC",
+        },
+      },
+      yAxis: {
+        type: "value",
+        axisLabel: {
+          color: "#8897BC",
+        },
+        splitLine: {
+          lineStyle: {
+            type: "dashed",
+            color: "rgba(196,194,225, 0.54)",
+          },
+        },
+      },
+      series: [
+        {
+          name: "2020年",
+          type: "bar",
+          data: [12, 10, 15, 11, 16, 4, 6],
+        },
+        {
+          name: "2021年",
+          type: "bar",
+          data: [11, 15, 17, 8, 1, 4, 6],
+        },
+      ],
+    },
+  },
+});
+
+const airStutas = ref({
+  component: "commonChartsBar",
+  option: {
+    baseOption: {
+      // legend: {
+      //   data: ['2020年', '2021年'],
+      //   right:"20",
+      //   textStyle:{
+      //     color: "#8897BC"
+      //   }
+      //   // top:"-10"
+      // },
+      color: ["#51DEE9", "#4C88E1"],
+      grid: {
+        bottom: "10%",
+        left: "5%",
+        right: "1%",
+        top: "15%",
+      },
+      xAxis: {
+        data: ["机下交接", "货站交接", "理货"],
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: "#8897BC",
+          },
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          color: "#8897BC",
+        },
+      },
+      yAxis: {
+        type: "value",
+        axisLabel: {
+          color: "#8897BC",
+        },
+        splitLine: {
+          lineStyle: {
+            type: "dashed",
+            color: "rgba(196,194,225, 0.54)",
+          },
+        },
+      },
+      series: [
+        {
+          type: "bar",
+          data: [12, 10, 15],
+        },
+      ],
+    },
+  },
+});
+
+const nodeEfficiency = ref({
+  component: "commonChartsLine",
+  option: {
+    legend: {
+      top: "1%",
+      right: "5%",
+      data: ["平均时间", "最长时间", "最短时间"],
+      itemWidth: 25,
+      itemHeight: 14,
+    },
+    grid: {
+      bottom: "10%",
+      left: "1%",
+      right: "1%",
+      top: "15%",
+    },
+    color: ["#3ca4fc", "#f1ce7c", "#36ccba"],
+    xAxis: {
+      axisLabel: {
+        interval: 0,
+      },
+      data: [
+        "收货核单",
+        "安检",
+        "理货",
+        "待运区",
+        "货站交接",
+        "机下交接",
+        "装机",
+      ],
+    },
+    series: [
+      {
+        name: "平均时间",
+        type: "line",
+        smooth: true,
+        stack: "",
+        areaStyle: {
+          opacity: 0,
+        },
+        data: [
+          4016, 4652, 1570, 6334, 12052, 3115, 10604, 12733, 14533, 2464, 4168,
+          3844,
+        ],
+      },
+      {
+        name: "最长时间",
+        type: "line",
+        smooth: true,
+        stack: "",
+        areaStyle: {
+          opacity: 0,
+        },
+        data: [
+          4558, 770, 11745, 2699, 11205, 6497, 1544, 1555, 4181, 447, 60, 9804,
+        ],
+      },
+      {
+        name: "最短时间",
+        type: "line",
+        smooth: true,
+        stack: "",
+        areaStyle: {
+          opacity: 0,
+        },
+        data: [
+          14240, 3190, 1699, 14446, 11349, 11182, 14829, 11740, 2418, 4824,
+          9707, 8126,
+        ],
+      },
+    ],
+  },
+});
+
+const node = [
+  "收货核单",
+  "安检",
+  "理货",
+  "待运区",
+  "货站交接",
+  "机下交接",
+  "装机",
+];
+
+const hours = Array.from({ length: 24 }, (v, i) => i + 1);
+
+const hourPeak = ref({
+  component: "commonChartsScatter",
+  option: {
+    title: node.map((month, index) => ({
+      top: ((index + 0.5) * 100) / 7 - 3 + "%",
+      text: month,
+      textStyle: {
+        fontSize: 12,
+        fontWeight: "normal",
+        color: "#698dc3",
+      },
+    })),
+    singleAxis: node.map((month, index) => ({
+      type: "category",
+      data: hours,
+      top: ((index + 0.5) * 100) / 7 - 3 + "%",
+      height: 100 / 7 - 5 + "%",
+      left: "12%",
+      right: "1%",
+      axisTick: {
+        show: false,
+      },
+      splitLine: {
+        show: false,
+      },
+    })),
+    series: node.map((month, index) => ({
+      singleAxisIndex: index,
+      coordinateSystem: "singleAxis",
+      type: "scatter",
+      data: [
+        3, 6, 1, 4, 0, 4, 2, 5, 4, 4, 6, 2, 0, 3, 1, 6, 6, 1, 0, 3, 6, 3, 0, 5,
+      ],
+      symbolSize: function (dataItem) {
+        return dataItem * 3;
+      },
+    })),
+  },
+});
+
+const getHourPeakData = () => {
+  axios
+    .get("./mock/hourPeakData.json")
+    .then((res) => {
+      if (res.data.code === 200 || res.data.code === "200") {
+        res.data.data.series.forEach((item, index) => {
+          hourPeak.value.option.series[index].data = item.data;
+        });
+      } else {
+        // this.$message.error('小时高峰量统计分析-初始化数据失败')
+      }
+    })
+    .catch((err) => {
+      // this.$message.error(err)
+    });
+};
+
 const tabClick = (item, index) => {
   tabsIndex.value = index;
   console.log(item, index);
 };
 
-const showDatePicker = () =>{
+const showDatePicker = () => {
   flag.value = true;
-}
+};
 
+onMounted(() => {
+  // getHourPeakData()
+});
 </script>
 
 <style lang="scss" scoped>
@@ -359,7 +759,7 @@ const showDatePicker = () =>{
     }
   }
   &-content {
-    padding:0 20px;
+    padding: 0 20px;
     height: calc(100% - 40px);
     box-sizing: border-box;
     display: flex;
@@ -370,7 +770,7 @@ const showDatePicker = () =>{
       &-left,
       &-right {
         width: calc(30% - 20px);
-        &-item{
+        &-item {
           width: 100%;
           height: calc(50% - 20px);
           margin: 20px 0;
@@ -381,32 +781,32 @@ const showDatePicker = () =>{
           background-size: 100% 100%;
           padding: 13px;
           box-sizing: border-box;
-        &-top{
-          width: 100%;
-          height: 45px;
-          display: flex;
-          padding-top: 15px;
-          box-sizing: border-box;
-          &-title{
-            font-size: 16px;
-            font-weight: bold;
-            color: #75CEE1;
-            line-height: 1.8;
-            margin-right: 10px;
-          }
-          &-time{
+          &-top {
+            width: 100%;
+            height: 45px;
             display: flex;
-            justify-content: flex-start;
-            align-items: center;
-            cursor: pointer;
+            padding-top: 15px;
+            box-sizing: border-box;
+            &-title {
+              font-size: 16px;
+              font-weight: bold;
+              color: #75cee1;
+              line-height: 1.8;
+              margin-right: 10px;
+            }
+            &-time {
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              cursor: pointer;
+            }
+          }
+          &-bottom {
+            width: 100%;
+            flex: 1;
+            position: relative;
+            // margin-top: 10px;
           }
-        }
-        &-bottom{
-          width: 100%;
-          flex: 1;
-          position: relative;
-          // margin-top: 10px;
-        }
         }
       }
       &-center {
@@ -414,31 +814,82 @@ const showDatePicker = () =>{
         box-sizing: border-box;
         display: flex;
         flex-direction: column;
-        &-top{
+        &-top {
           width: 100%;
-          height: 55px;
+          height: 32px;
           display: flex;
           padding-top: 15px;
           box-sizing: border-box;
-          &-title{
+          &-title {
             font-size: 16px;
             font-weight: bold;
-            color: #75CEE1;
+            color: #75cee1;
             line-height: 1.8;
             margin-right: 10px;
           }
-          &-time{
+          &-time {
             display: flex;
             justify-content: flex-start;
             align-items: center;
             cursor: pointer;
           }
         }
-        &-bottom{
+        &-bottom {
           width: 100%;
           flex: 1;
           position: relative;
-          // margin-top: 10px;
+          &-box1 {
+            z-index: 10;
+            width: 205px;
+            height: 120px;
+            border: 2px solid #468fc3;
+            position: absolute;
+            left: 50px;
+            display: flex;
+            flex-direction: column;
+            padding: 15px 0 15px 15px;
+            &-title {
+              font-size: 16px;
+              font-weight: bold;
+              color: #ffffff;
+              margin-bottom: 10px;
+            }
+            &-info {
+              font-size: 14px;
+              font-weight: 400;
+              color: #c0cbe4;
+              display: flex;
+              div {
+                margin-right: 10px;
+              }
+            }
+          }
+          &-box2 {
+            z-index: 10;
+            width: 284px;
+            height: 120px;
+            border: 2px solid #468fc3;
+            position: absolute;
+            right: 60px;
+            display: flex;
+            flex-direction: column;
+            padding: 15px 0 15px 15px;
+            &-title {
+              font-size: 16px;
+              font-weight: bold;
+              color: #ffffff;
+              margin-bottom: 10px;
+            }
+            &-info {
+              font-size: 14px;
+              font-weight: 400;
+              color: #c0cbe4;
+              display: flex;
+              div {
+                margin-right: 10px;
+              }
+            }
+          }
         }
       }
     }
@@ -458,27 +909,27 @@ const showDatePicker = () =>{
         box-sizing: border-box;
         margin-top: 20px;
         margin-bottom: 20px;
-        &-top{
+        &-top {
           width: 100%;
           height: 45px;
           display: flex;
           padding-top: 15px;
           box-sizing: border-box;
-          &-title{
+          &-title {
             font-size: 16px;
             font-weight: bold;
-            color: #75CEE1;
+            color: #75cee1;
             line-height: 1.8;
             margin-right: 10px;
           }
-          &-time{
+          &-time {
             display: flex;
             justify-content: flex-start;
             align-items: center;
             cursor: pointer;
           }
         }
-        &-bottom{
+        &-bottom {
           width: 100%;
           flex: 1;
           position: relative;
@@ -498,27 +949,27 @@ const showDatePicker = () =>{
         background-size: 100% 100%;
         background-position: center center;
         box-sizing: border-box;
-        &-top{
+        &-top {
           width: 100%;
           height: 45px;
           display: flex;
           padding-top: 15px;
           box-sizing: border-box;
-          &-title{
+          &-title {
             font-size: 16px;
             font-weight: bold;
-            color: #75CEE1;
+            color: #75cee1;
             line-height: 1.8;
             margin-right: 10px;
           }
-          &-time{
+          &-time {
             display: flex;
             justify-content: flex-start;
             align-items: center;
             cursor: pointer;
           }
         }
-        &-bottom{
+        &-bottom {
           width: 100%;
           flex: 1;
           position: relative;

src/views/systemSettings/datastructure/datastructureTerm.vue

@@ -28,10 +28,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="datastructureTermForm"
+          >
             <el-row :gutter="24">
               <el-col :span="12">
-                <el-form-item label="数据项名称" size="default">
+                <el-form-item
+                  label="数据项名称"
+                  size="default"
+                  prop="ItemName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.ItemName"
                     placeholder="请输入数据项名称"
@@ -40,11 +49,11 @@
               </el-col>
               <el-col :span="12">
                 <el-form-item label="数据项类型" size="default">
-                  <el-input
+                  <!-- <el-input
                     v-model="tableForm.dataType"
                     placeholder="请输入数据项类型"
-                  />
-                  <!-- <el-select
+                  /> -->
+                  <el-select
                     style="width: 100%"
                     v-model="tableForm.dataType"
                     class="input-shadow"
@@ -60,11 +69,16 @@
                       :value="item.v ? item.v : item.planDepartureApt"
                     >
                     </el-option>
-                  </el-select> -->
+                  </el-select>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="输出标识符" size="default">
+                <el-form-item
+                  label="输出标识符"
+                  size="default"
+                  prop="outputIdentifier"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.outputIdentifier"
                     placeholder="请输入输出标识符"
@@ -77,7 +91,12 @@
                 </el-form-item> -->
               </el-col>
               <el-col :span="8">
-                <el-form-item label="唯一项" size="default">
+                <el-form-item
+                  label="唯一项"
+                  size="default"
+                  prop="isKey"
+                  :rules="formRules.isNotNull"
+                >
                   <el-select
                     style="width: 100%"
                     v-model="tableForm.isKey"
@@ -98,7 +117,12 @@
                 </el-form-item>
               </el-col>
               <el-col :span="8">
-                <el-form-item label="必填项" size="default">
+                <el-form-item
+                  label="必填项"
+                  size="default"
+                  prop="isMust"
+                  :rules="formRules.isNotNull"
+                >
                   <el-select
                     style="width: 100%"
                     v-model="tableForm.isMust"
@@ -119,7 +143,12 @@
                 </el-form-item>
               </el-col>
               <el-col :span="8">
-                <el-form-item label="多条拆分" size="default">
+                <el-form-item
+                  label="多条拆分"
+                  size="default"
+                  prop="isSplite"
+                  :rules="formRules.isNotNull"
+                >
                   <el-select
                     style="width: 100%"
                     v-model="tableForm.isSplite"
@@ -174,7 +203,12 @@
                 </el-form-item>
               </el-col> -->
               <el-col :span="12">
-                <el-form-item label="计算数据源" size="default">
+                <el-form-item
+                  label="计算数据源"
+                  size="default"
+                  prop="dataSourceName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-select
                     style="width: 100%"
                     v-model="tableForm.dataSourceName"
@@ -207,6 +241,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const router = useRouter();
 const route = useRoute();
 const page = ref<number>(0); //分页参数
@@ -382,8 +417,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const datastructureTermForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  datastructureTermForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/systemSettings/datastructure/index.vue

@@ -28,10 +28,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="datastructureForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="结构名称" size="default">
+                <el-form-item
+                  label="结构名称"
+                  size="default"
+                  prop="structureName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.structureName"
                     placeholder="请输入结构名称"
@@ -40,11 +49,7 @@
               </el-col>
               <el-col>
                 <el-form-item label="数据格式" size="default">
-                  <el-input
-                    v-model="tableForm.datatype"
-                    placeholder="请输入数据格式"
-                  />
-                  <!-- <el-select
+                  <el-select
                     style="width: 100%"
                     v-model="tableForm.datatype"
                     class="input-shadow"
@@ -60,11 +65,16 @@
                       :value="item.v ? item.v : item.planDepartureApt"
                     >
                     </el-option>
-                  </el-select> -->
+                  </el-select>
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="事件标识" size="default">
+                <el-form-item
+                  label="事件标识"
+                  size="default"
+                  prop="eventID"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.eventID"
                     placeholder="请输入事件标识"
@@ -93,6 +103,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -253,8 +264,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const datastructureForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  datastructureForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/systemSettings/messageTemplate/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="messageTemplateForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="消息标题" size="default">
+                <el-form-item
+                  label="消息标题"
+                  size="default"
+                  prop="newsTitle"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.newsTitle"
                     placeholder="请输入名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="消息内容" size="default">
+                <el-form-item
+                  label="消息内容"
+                  size="default"
+                  prop="newContent"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     type="textarea"
                     v-model="tableForm.newContent"
@@ -59,6 +73,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -196,8 +211,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const messageTemplateForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  messageTemplateForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/systemSettings/protocolManagement/index.vue

@@ -28,10 +28,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="protocolManagement"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="协议名称" size="default">
+                <el-form-item
+                  label="协议名称"
+                  size="default"
+                  prop="protocolName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.protocolName"
                     placeholder="请输入协议名称"
@@ -39,7 +48,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="类名" size="default">
+                <el-form-item
+                  label="类名"
+                  size="default"
+                  prop="className"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     type="textarea"
                     v-model="tableForm.className"
@@ -56,7 +70,12 @@
                 </el-form-item>
               </el-col> -->
               <el-col>
-                <el-form-item label="读方法名" size="default">
+                <el-form-item
+                  label="读方法名"
+                  size="default"
+                  prop="rmethodName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.rmethodName"
                     placeholder="请输入读方法名"
@@ -64,7 +83,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="写方法名" size="default">
+                <el-form-item
+                  label="写方法名"
+                  size="default"
+                  prop="smethodName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.smethodName"
                     placeholder="请输入写方法名"
@@ -72,7 +96,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="文件名及路径" size="default">
+                <el-form-item
+                  label="文件名及路径"
+                  size="default"
+                  prop="filePath"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     type="textarea"
                     v-model="tableForm.filePath"
@@ -93,6 +122,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -237,8 +267,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const protocolManagement: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  protocolManagement.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;
@@ -284,6 +321,6 @@ getQuery();
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {
-  width: 100px;
+  width: 110px;
 }
 </style>

src/views/systemSettings/queryTemplate/queryTemplateAdd.vue

@@ -13,10 +13,15 @@
       </template></Minheader
     >
     <div class="app-container">
-      <el-form :model="ruleForm">
+      <el-form :model="ruleForm" :rules="formRules" ref="queryTemplateAddForm">
         <el-row :gutter="24">
           <el-col :span="6">
-            <el-form-item label="查询模板名称" size="default">
+            <el-form-item
+              label="查询模板名称"
+              size="default"
+              prop="queryTemplateName"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="ruleForm.queryTemplateName"
                 placeholder="请输入查询模板名称"
@@ -24,7 +29,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="数据源" prop="dataSourceID" size="default">
+            <el-form-item
+              label="数据源"
+              prop="dataSourceID"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-select
                 v-model="ruleForm.dataSourceID"
                 placeholder="请选择"
@@ -40,7 +50,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="服务名称" prop="submitID" size="default">
+            <el-form-item
+              label="服务名称"
+              prop="serviceID"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-select
                 v-model="ruleForm.serviceID"
                 placeholder="请选择"
@@ -56,7 +71,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="每页显示" prop="pageRows" size="default">
+            <el-form-item
+              label="每页显示"
+              prop="pageRows"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="ruleForm.pageRows"
                 size="medium"
@@ -75,7 +95,12 @@
             </el-form-item>
           </el-col>
           <el-col>
-            <el-form-item label="查询语句" size="default">
+            <el-form-item
+              label="查询语句"
+              size="default"
+              prop="queryTemplate"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 :autosize="{ minRows: 24, maxRows: 24 }"
                 type="textarea"
@@ -94,6 +119,7 @@
 import Minheader from "@/components/minheader/index.vue";
 import { Query, myQuery, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const router = useRouter();
 const asShOW = ref<boolean>(false);
 const dataSourceList = ref<Array>([]); //下拉
@@ -109,8 +135,19 @@ const ruleForm = reactive({
   serviceID: "",
   event: 1,
 }); //内容
+//确认提交
+const queryTemplateAddForm: any = ref(null);
+const preserForm = () => {
+  queryTemplateAddForm.value.validate((valid: any) => {
+    if (valid) {
+      preserFormer();
+    } else {
+      return false;
+    }
+  });
+};
 //保存
-const preserForm = async () => {
+const preserFormer = async () => {
   const params = {
     ...ruleForm,
     submitID: ruleForm.serviceID,
@@ -153,7 +190,7 @@ const getSelectOption = async (ID) => {
   }
 };
 const queryServiceList = async (ID) => {
-  const serviceLists = await getSelectOption(DATACONTENT_ID.sysServiceTabId);
+  const serviceLists = await getSelectOption(DATACONTENT_ID.sysServiceTable);
   serviceList.value = serviceLists.map((item) => {
     item[item.setlabel] = item.k;
     item[item.setvalue] = item.v;

src/views/systemSettings/queryTemplate/queryTemplateEdit.vue

@@ -13,10 +13,15 @@
       </template></Minheader
     >
     <div class="app-container">
-      <el-form :model="ruleForm">
+      <el-form :model="ruleForm" :rules="formRules" ref="queryTemplateEditForm">
         <el-row :gutter="24">
           <el-col :span="6">
-            <el-form-item label="查询模板名称" size="default">
+            <el-form-item
+              label="查询模板名称"
+              size="default"
+              prop="queryTemplateName"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="ruleForm.queryTemplateName"
                 placeholder="请输入查询模板名称"
@@ -24,7 +29,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="数据源" prop="dataSourceID" size="default">
+            <el-form-item
+              label="数据源"
+              prop="dataSourceID"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-select
                 v-model="ruleForm.dataSourceID"
                 placeholder="请选择"
@@ -40,7 +50,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="服务名称" prop="submitID" size="default">
+            <el-form-item
+              label="服务名称"
+              prop="serviceID"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-select
                 v-model="ruleForm.serviceID"
                 placeholder="请选择"
@@ -56,7 +71,12 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="每页显示" prop="pageRows" size="default">
+            <el-form-item
+              label="每页显示"
+              prop="pageRows"
+              size="default"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="ruleForm.pageRows"
                 size="medium"
@@ -75,7 +95,12 @@
             </el-form-item>
           </el-col>
           <el-col>
-            <el-form-item label="查询语句" size="default">
+            <el-form-item
+              label="查询语句"
+              size="default"
+              prop="queryTemplate"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 :autosize="{ minRows: 24, maxRows: 24 }"
                 type="textarea"
@@ -94,6 +119,7 @@
 import Minheader from "@/components/minheader/index.vue";
 import { Query, myQuery, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const router = useRouter();
 const route = useRoute();
 const asShOW = ref<boolean>(false);
@@ -112,8 +138,19 @@ const ruleForm = reactive({
   event: 2,
 }); //内容
 queryTemplateID.value = route.query.queryTemplateID;
+//确认提交
+const queryTemplateEditForm: any = ref(null);
+const preserForm = () => {
+  queryTemplateEditForm.value.validate((valid: any) => {
+    if (valid) {
+      preserFormer();
+    } else {
+      return false;
+    }
+  });
+};
 //保存
-const preserForm = async () => {
+const preserFormer = async () => {
   const params = {
     ...ruleForm,
     submitID: ruleForm.serviceID,
@@ -156,7 +193,7 @@ const getSelectOption = async (ID) => {
   }
 };
 const queryServiceList = async (ID) => {
-  const serviceLists = await getSelectOption(DATACONTENT_ID.sysServiceTabId);
+  const serviceLists = await getSelectOption(DATACONTENT_ID.sysServiceTable);
   serviceList.value = serviceLists.map((item) => {
     item[item.setlabel] = item.k;
     item[item.setvalue] = item.v;

src/views/systemSettings/sourceTube/index.vue

@@ -27,10 +27,15 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form :model="tableForm" :rules="formRules" ref="sourceTubeForm">
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="数据源名称" size="default">
+                <el-form-item
+                  label="数据源名称"
+                  size="default"
+                  prop="dataSourceName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.dataSourceName"
                     placeholder="请输入数据源名称"
@@ -59,7 +64,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="连接参数" size="default">
+                <el-form-item
+                  label="连接参数"
+                  size="default"
+                  prop="connectConfig"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     :autosize="{ minRows: 10, maxRows: 10 }"
                     type="textarea"
@@ -81,6 +91,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -228,8 +239,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const sourceTubeForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  sourceTubeForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/systemSettings/warningEdit/index.vue

@@ -9,14 +9,24 @@
         </template></Minheader
       >
       <div class="diacont">
-        <el-form :model="tableForm" class="w100 fw">
+        <el-form
+          :model="tableForm"
+          class="w100 fw"
+          :rules="formRules"
+          ref="warningEditsForm"
+        >
           <!-- <div class="outersurface pd30">
             <el-form-item label="策略名称" size="default">
               <el-input v-model="tableForm.name" placeholder="请输入策略名称" />
             </el-form-item>
           </div> -->
           <div class="outersurface pd30">
-            <el-form-item label="航司二字码" size="default">
+            <el-form-item
+              label="航司二字码"
+              size="default"
+              prop="IATACode"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="tableForm.IATACode"
                 placeholder="请输入航司二字码"
@@ -66,7 +76,12 @@
             </el-form-item>
           </div>
           <div class="outersurface">
-            <el-form-item label="航班号" size="default">
+            <el-form-item
+              label="航班号"
+              size="default"
+              prop="flightNo"
+              :rules="formRules.isNotNull"
+            >
               <el-input
                 v-model="tableForm.flightNo"
                 placeholder="请输入航班号"
@@ -74,7 +89,12 @@
             </el-form-item>
           </div>
           <div class="outersurface pd30">
-            <el-form-item label="生效时间" size="default">
+            <el-form-item
+              label="生效时间"
+              size="default"
+              prop="startDate"
+              :rules="formRules.isNotNull"
+            >
               <el-date-picker
                 v-model="tableForm.startDate"
                 :rows="1"
@@ -87,7 +107,12 @@
             </el-form-item>
           </div>
           <div class="outersurface pd30">
-            <el-form-item label="失效时间" size="default">
+            <el-form-item
+              label="失效时间"
+              size="default"
+              prop="endDate"
+              :rules="formRules.isNotNull"
+            >
               <el-date-picker
                 format="YYYY-MM-DD HH:mm:ss"
                 value-format="YYYY-MM-DD HH:mm:ss"
@@ -137,10 +162,15 @@
       @delRemove="delRemove"
     >
       <div class="diacont">
-        <el-form :model="tableForms">
+        <el-form :model="tableForms" :rules="formRules" ref="warningEditForm">
           <el-row :gutter="24">
             <el-col :span="12">
-              <el-form-item label="策略名称" size="default">
+              <el-form-item
+                label="策略名称"
+                size="default"
+                prop="StrategyName"
+                :rules="formRules.isNotNull"
+              >
                 <el-input
                   v-model="tableForms.StrategyName"
                   placeholder="请输入策略名称"
@@ -169,7 +199,12 @@
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="预警时长" size="default">
+              <el-form-item
+                label="预警时长"
+                size="default"
+                prop="warningDuration"
+                :rules="formRules.isNotNull"
+              >
                 <el-input
                   v-model="tableForms.warningDuration"
                   placeholder="请输入预警时长"
@@ -177,7 +212,12 @@
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="报警时长" size="default">
+              <el-form-item
+                label="报警时长"
+                size="default"
+                prop="alarmDuration"
+                :rules="formRules.isNotNull"
+              >
                 <el-input
                   v-model="tableForms.alarmDuration"
                   placeholder="请输入报警时长"
@@ -281,6 +321,7 @@ import DataTable from "@/components/tableTemp/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const router = useRouter();
 const route = useRoute();
 const page = ref<number>(0); //分页参数
@@ -481,8 +522,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const warningEditForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForms);
+  warningEditForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForms);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;
@@ -529,9 +577,15 @@ const generalDataReception = async (data) => {
   }
 };
 //编辑数据
+const warningEditsForm: any = ref(null);
 const preserForm = async () => {
-  tableForm.event = 2;
-  generalDataReceptions(tableForm);
+  warningEditsForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReceptions(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 //表格-增/删/改
 const generalDataReceptions = async (data) => {
@@ -595,6 +649,6 @@ getQuery();
   }
 }
 ::v-deep .el-form-item__label {
-  width: 90px;
+  width: 100px;
 }
 </style>

src/views/systemSettings/warningSet/index.vue

@@ -33,7 +33,7 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form :model="tableForm" :rules="formRules" ref="warningSetForm">
             <el-row :gutter="24">
               <!-- <el-col :span="12">
                 <el-form-item label="策略名称" size="default">
@@ -44,7 +44,12 @@
                 </el-form-item>
               </el-col> -->
               <el-col :span="12">
-                <el-form-item label="航司二字码" size="default">
+                <el-form-item
+                  label="航司二字码"
+                  size="default"
+                  prop="IATACode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.IATACode"
                     placeholder="请输入航司二字码"
@@ -94,7 +99,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="航班号" size="default">
+                <el-form-item
+                  label="航班号"
+                  size="default"
+                  prop="flightNo"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.flightNo"
                     placeholder="请输入航班号"
@@ -102,7 +112,12 @@
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="生效时间" size="default">
+                <el-form-item
+                  label="生效时间"
+                  size="default"
+                  prop="startDate"
+                  :rules="formRules.isNotNull"
+                >
                   <el-date-picker
                     v-model="tableForm.startDate"
                     :rows="1"
@@ -115,7 +130,12 @@
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="失效时间" size="default">
+                <el-form-item
+                  label="失效时间"
+                  size="default"
+                  prop="endDate"
+                  :rules="formRules.isNotNull"
+                >
                   <el-date-picker
                     format="YYYY-MM-DD HH:mm:ss"
                     value-format="YYYY-MM-DD HH:mm:ss"
@@ -149,6 +169,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -317,8 +338,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const warningSetForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  warningSetForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;
@@ -364,6 +392,6 @@ getQuery();
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {
-  width: 90px;
+  width: 100px;
 }
 </style>

src/views/userManagement/account/auth.vue

@@ -6,22 +6,22 @@
           <div class="manageTitle">账号信息</div>
           <div class="role-info-content t30">
             <el-form ref="ruleFormRef" :model="ruleForm" class="demo-ruleForm">
-              <el-form-item label="角色名称" prop="roleName">
-                <el-input disabled v-model="ruleForm.roleName" size="default" placeholder="请输入角色名称" />
+              <el-form-item label="角色名称" prop="user_name">
+                <el-input disabled v-model="ruleForm.user_name" size="default" placeholder="请输入角色名称" />
               </el-form-item>
-              <el-form-item label="角色描述" prop="roleDesc">
-                <el-input disabled v-model="ruleForm.roleDesc" size="default" type="textarea" :rows="3" placeholder="请输入角色描述" />
+              <el-form-item label="角色描述" prop="user_comment">
+                <el-input disabled v-model="ruleForm.user_comment" size="default" type="textarea" :rows="3" placeholder="请输入角色描述" />
               </el-form-item>
-              <el-form-item label="是否启用" prop="roleStatus">
-                <el-radio-group disabled v-model="ruleForm.roleStatus">
-                  <el-radio label="1">启用</el-radio>
-                  <el-radio label="2"> 禁用</el-radio>
+              <el-form-item label="是否启用" prop="user_status">
+                <el-radio-group disabled v-model="ruleForm.user_status">
+                  <el-radio :label="1">启用</el-radio>
+                  <el-radio :label="2"> 禁用</el-radio>
                 </el-radio-group>
               </el-form-item>
             </el-form>
           </div>
         </div>
-        <div class="box strategy-bottom strategy">
+        <!-- <div class="box strategy-bottom strategy">
           <div class="manageTitle">登录策略</div>
           <div class="strategy-content">
             <el-scrollbar>
@@ -39,31 +39,36 @@
               </el-checkbox-group>
             </el-scrollbar>
           </div>
-        </div>
+        </div> -->
       </div>
       <div class="box auth-list">
         <div class="manageTitle">角色</div>
         <div class="strategy auth-tree">
           <div class="strategy-content">
-            <el-scrollbar>
-              <el-checkbox-group v-model="roleGroup" size="default">
-                <el-row :gutter="16">
-                  <el-col :span="8" v-for="item in roleData" :key="item.id">
-                    <div class="strategy-content-list">
-                      <el-checkbox class="ck" :title="item.label" :label="item.value">
-                        {{ item.label }}
-                      </el-checkbox>
-                    </div>
-                  </el-col>
-                </el-row>
-              </el-checkbox-group>
-            </el-scrollbar>
+            <template v-if="roleData.length">
+              <el-scrollbar>
+                <el-checkbox-group @change="checkChange" v-model="roleGroup" size="default">
+                  <el-row :gutter="16">
+                    <el-col :span="8" v-for="(item,index) in roleData" :key="index">
+                      <div @click="handleClick(item,index)" :class="index == roleIndex ? 'active' : ''" class="strategy-content-list">
+                        <el-checkbox class="ck" :title="item.role_name" :label="item.role_id">
+                          {{ item.role_name }}
+                        </el-checkbox>
+                      </div>
+                    </el-col>
+                  </el-row>
+                </el-checkbox-group>
+              </el-scrollbar>
+            </template>
+            <template v-else>
+              <el-empty description="暂无数据" />
+            </template>
           </div>
         </div>
       </div>
       <div class="box auth-list">
         <div class="manageTitle">权限名称</div>
-        <div class="auth-name flex-wrap">
+        <div v-if="groupData.length" class="auth-name flex-wrap">
           <span class="auth-name-list"> <span class="icon icon-time"></span> 时效规则有</span>
           <span class="auth-name-list"> <span class="icon icon-date"></span> 数据规则有</span>
           <span class="auth-name-list"> <span class="icon icon-ic_display_edit"></span> 显示及编辑权限</span>
@@ -71,67 +76,219 @@
         </div>
         <div class="auth-box">
           <div class="strategy-content">
-            <el-scrollbar>
-              <el-row :gutter="16">
-                <el-col :span="8" v-for="item in roleData" :key="item.id">
-                  <div class="strategy-content-list">
-                    <div class="flex info">
-                      <div class="name">{{item.label}}</div>
-                      <el-button size="default" type="primary" link>查看</el-button>
-                    </div>
-                    <div class="auth-name flex-wrap">
-                      <span class="auth-name-list"> <span class="icon icon-time"></span></span>
-                      <span class="auth-name-list"> <span class="icon icon-date"></span></span>
-                      <span class="auth-name-list"> <span class="icon icon-ic_display_edit"></span></span>
-                      <span class="auth-name-list"> <span class="icon icon-ic_display"></span> </span>
+            <template v-if="groupData.length">
+              <el-scrollbar>
+                <el-row :gutter="16">
+                  <el-col :span="8" v-for="item in groupData" :key="item.id">
+                    <div class="strategy-content-list">
+                      <div class="flex info">
+                        <div class="name">{{item.auth_name}}</div>
+                        <el-button @click="handleCk(item)" size="default" type="primary" link>查看</el-button>
+                      </div>
+                      <div v-if="item.edit_col_condition ||
+                          item.delete_row_condition ||
+                          item.edit_row_condition ||
+                          item.new_col_condition ||
+                          item.query_col_conditon ||
+                          item.query_row_condition" class="auth-name flex-wrap">
+                        <span class="auth-name-list"> <span class="icon icon-time"></span></span>
+                        <span class="auth-name-list"> <span class="icon icon-date"></span></span>
+                        <span class="auth-name-list"> <span class="icon icon-ic_display_edit"></span></span>
+                        <span class="auth-name-list"> <span class="icon icon-ic_display"></span> </span>
+                      </div>
                     </div>
-                  </div>
-                </el-col>
-              </el-row>
-            </el-scrollbar>
+                  </el-col>
+                </el-row>
+              </el-scrollbar>
+            </template>
+            <template v-else>
+              <el-empty description="暂无数据" />
+            </template>
           </div>
         </div>
       </div>
     </div>
+    <!--新增/编辑-->
+    <Dialog :flag="editDialogVisible" :msgTitle="editDialogTitle" @submitForm="submitForm()" @resetForm="resetForm()" :show-flag="true">
+      <el-form ref="ruleFormRef" :model="ruleNewForm" label-width="110px" class="demo-ruleForm">
+        <el-form-item label="许可查询行">
+          <el-input size="default" disabled v-model="ruleNewForm.query_row_condition" placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="许可查询列">
+          <el-input size="default" disabled v-model="ruleNewForm.query_col_conditon" placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="许可删除行">
+          <el-input size="default" disabled v-model="ruleNewForm.delete_row_condition" placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="许可新增列">
+          <el-input size="default" disabled v-model="ruleNewForm.new_col_condition" placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="许可编辑行">
+          <el-input size="default" disabled v-model="ruleNewForm.edit_row_condition" placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="许可编辑列">
+          <el-input size="default" disabled v-model="ruleNewForm.edit_col_condition" placeholder="请输入内容"></el-input>
+        </el-form-item>
+      </el-form>
+    </Dialog>
   </div>
 </template>
 
 <script setup lang="ts">
 import { ref, reactive, onBeforeMount } from "vue";
-const ruleForm = reactive({
-  roleName: "11",
-  roleDesc: "22",
-  roleStatus: "2",
+import { GeneralDataReception, Query } from "@/api/dataIntegration";
+import { ElMessage } from "element-plus";
+import Dialog from "@/components/dialog/index.vue";
+const route = useRoute();
+const role_id = route.query.id;
+const ruleForm = ref<any>({
+  user_name: "",
+  user_comment: "",
+  user_status: "",
+});
+const ruleNewForm = ref<any>({
+  delete_row_condition: "",
+  edit_col_condition: "",
+  edit_row_condition: "",
+  new_col_condition: "",
+  query_col_conditon: "",
+  query_row_condition: "",
 });
 const checkboxGroup = ref([1, 2]);
-const roleGroup = ref([1, 2]);
-const groupData = [
-  {
-    label: "策略名称",
-    value: 1,
-    id: 1,
-  },
-];
-const roleData = [
-  {
-    label: "系统开发工程师",
-    value: 1,
-    id: 1,
-  },
-];
-onBeforeMount(() => {
-  for (let i = 0; i < 50; i++) {
-    groupData.push({
-      label: "策略名称",
-      value: i + 2,
-      id: i + 2,
+const roleGroup = ref<any>([]);
+const groupData = ref<any>([]);
+const roleData = ref<any>([]);
+const pageNum = ref(1);
+const checkedKeys = ref<any>([]);
+const roleIndex = ref(null);
+const editDialogVisible = ref(false);
+const editDialogTitle = ref("查看规则");
+// 获取当前账号信息
+const getAccountInfo = async () => {
+  const res = await Query({
+    id: DATACONTENT_ID.accountDetailsId,
+    dataContent: [role_id],
+  });
+  if (res.code == 0) {
+    const { listValues } = res.returnData;
+    const obj = listValues[0];
+    ruleForm.value = obj;
+  } else {
+    ElMessage.error(res.message);
+  }
+};
+//获取列表
+const getRoleData = async () => {
+  const result = await Query({
+    id: DATACONTENT_ID.roleTableNId,
+    needPage: pageNum.value,
+    dataContent: ["", sessionStorage.getItem("User_Id")],
+  });
+  if (result.code == 0) {
+    const datas = result.returnData.listValues;
+    roleData.value = datas;
+  } else {
+    ElMessage.error(result.message);
+  }
+};
+
+//角色明细
+const roleDetails = async () => {
+  const res = await Query({
+    id: DATACONTENT_ID.accountRoleId,
+    dataContent: [role_id],
+  });
+  if (res.code == 0) {
+    const { listValues } = res.returnData;
+    const datas: any = [];
+    listValues.forEach((item) => {
+      datas.push(item.role_id);
     });
-    roleData.push({
-      label: "系统开发工程师",
-      value: i + 2,
-      id: i + 2,
+    checkedKeys.value.push(datas);
+    roleGroup.value = datas;
+  } else {
+    ElMessage.error(res.message);
+  }
+};
+
+//当前选中角色
+const checkChange = (arr) => {
+  checkedKeys.value.push(arr);
+  const data1 = checkedKeys.value[checkedKeys.value.length - 1]; //最后一条数据
+  const data2 = checkedKeys.value[checkedKeys.value.length - 2]; //倒数第二条数据
+  if (data1.length > data2.length) {
+    checksBoxTs(data1, data2, "add");
+  } else {
+    checksBoxTs(data2, data1, "del");
+  }
+};
+
+//当前点击的角色
+const handleClick = (item, index) => {
+  roleIndex.value = index;
+  roleAuths(item.role_id);
+};
+
+//获取当前角色权限
+const roleAuths = async (id) => {
+  const res = await Query({
+    id: DATACONTENT_ID.roleAuthId,
+    dataContent: [id],
+  });
+  if (res.code == 0) {
+    groupData.value = res.returnData.listValues;
+  } else {
+    ElMessage.error(res.message);
+  }
+};
+
+//查看当前角色规则
+const handleCk = (item) => {
+  editDialogTitle.value = item.auth_name;
+  ruleNewForm.value = item;
+  editDialogVisible.value = true;
+};
+
+//提交当前取消数据
+const checksBoxTs = async (datas, arr, type) => {
+  const res = [...datas, ...arr].filter(
+    (item) => !(datas.some((p) => item == p) && arr.some((c) => item == c))
+  );
+
+  if (res && res.length) {
+    const obj = <any>{
+      role_id: res[res.length - 1],
+      user_id: role_id,
+    };
+    if (type == "add") {
+      obj.event = 1;
+    } else {
+      obj.event = 3;
+    }
+    const result = await GeneralDataReception({
+      serviceId: SERVICE_ID.roleScId,
+      dataContent: JSON.stringify(obj),
     });
+    if (result.code == 0) {
+      ElMessage.success(result.message);
+    } else {
+      ElMessage.error(result.message);
+    }
+  } else {
+    ElMessage.error("未选中数据");
   }
+};
+const submitForm = () => {
+  editDialogVisible.value = false;
+};
+
+const resetForm = () => {
+  editDialogVisible.value = false;
+};
+onBeforeMount(() => {
+  getAccountInfo();
+  getRoleData();
+  roleDetails();
 });
 </script>
 
@@ -147,11 +304,12 @@ onBeforeMount(() => {
       margin-right: 0;
     }
     .strategy-top {
-      height: 310px;
-    }
-    .strategy-bottom {
-      height: calc(100% - 335px);
+      // height: 310px;
+      height: 100%;
     }
+    // .strategy-bottom {
+    //   height: calc(100% - 335px);
+    // }
     .strategy {
       margin-top: 24px;
       &-content {
@@ -163,6 +321,7 @@ onBeforeMount(() => {
           box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.1);
           border-radius: 4px;
           margin-top: 16px;
+          border: 1px solid #f5f7fa;
           :deep .ck {
             display: flex;
             justify-content: space-between;
@@ -175,6 +334,9 @@ onBeforeMount(() => {
             }
           }
         }
+        .active {
+          border-color: #ac014d;
+        }
       }
     }
     .auth-tree {

src/views/userManagement/account/index.vue

@@ -43,6 +43,7 @@ import { ref, reactive, onBeforeMount } from "vue";
 import { ElMessage, FormInstance, FormRules } from "element-plus";
 import Table from "@/components/tableTemp/index.vue";
 import Search from "@/components/search/index.vue";
+import Dialog from "@/components/dialog/index.vue";
 import { translateDataToTreeAll } from "@/utils/validate";
 import { GeneralDataReception, Query } from "@/api/dataIntegration";
 import * as _ from "lodash";
@@ -52,7 +53,7 @@ const router = useRouter();
 const ruleFormRef = ref<FormInstance>();
 const tableHeader = ref<any>([]);
 const tableData = ref<any>([]);
-const tableBtnGroup = [
+const tableBtnGroup = <any>[
   {
     name: "编辑",
     className: "editBtn",
@@ -206,7 +207,12 @@ const btnClick = (index, row, param) => {
     editDialogTitle.value = "编辑账号";
     ruleForm.value = _.cloneDeep(row);
   } else {
-    router.push("/userManagement/accountAuth");
+    router.push({
+      path: "/userManagement/accountAuth",
+      query: {
+        id: row.user_id,
+      },
+    });
   }
 };
 const delRest = () => {