feat: Data Base页除去搜索部分

src/components/CustomTable/index.vue

@@ -1,5 +1,6 @@
 <template>
   <a-table
+   class="custom-table"
     v-bind="$attrs"
     :data-source="list"
     :columns="columns"
@@ -84,4 +85,12 @@ export default {
   }
 }
 </script>
-<style lang=""></style>
+<style lang="less" scoped>
+.custom-table {
+  ::v-deep {
+    .ant-table-row {
+      cursor: pointer;
+    }
+  }
+}
+</style>

src/components/SearchForm/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="search-form">
     <a-form-model ref="form" :model="formModel" v-bind="$attrs" @keyup.enter.native="onSearch">
-      <a-row :gutter="20">
+      <a-row :gutter="20" style="margin-right: 0 !important;">
         <a-col
           class="search-form-item"
           v-for="(item, index) in items"
@@ -67,6 +67,7 @@ export default {
   border-top: 1px solid rgba(12, 235, 201, 0.3);
   border-bottom: 1px solid rgba(12, 235, 201, 0.3);
   margin-bottom: 18px;
+  background-color: rgba(12, 235, 201, .05);
   &-item {
     margin-bottom: 10px;
   }

src/components/page/GlobalLayout.vue

@@ -14,11 +14,11 @@
         @updateMenuTitle="handleUpdateMenuTitle"
       />
       <div class="global-content">
-        <div class="top-border">
+        <div class="content-top-border">
           <img src="@/assets/images/content/top.png" alt="">
         </div>
         <div class="content-main">
-          <div class="left-border">
+          <div class="content-left-border">
             <img src="@/assets/images/content/left.png" alt="">
           </div>
           <!-- layout content -->
@@ -30,11 +30,11 @@
               <slot></slot>
             </div>
           </a-layout-content>
-          <div class="right-border">
+          <div class="content-right-border">
             <img src="@/assets/images/content/left.png" alt="">
           </div>
         </div>
-        <div class="bottom-border">
+        <div class="content-bottom-border">
           <img src="@/assets/images/content/bottom.png" alt="">
         </div>
       </div>
@@ -739,11 +739,11 @@
           padding-right: 5px;
         }
         .has-submenu {
-          height: calc(100% - 56px);
+          height: calc(100% - 65px);
         }
       }
     }
-    .top-border {
+    .content-top-border {
       position: absolute;
       top: 11px;
       left: 0;
@@ -753,7 +753,7 @@
         height: 21px;
       }
     }
-    .bottom-border {
+    .content-bottom-border {
       position: absolute;
       bottom: 6px;
       img {
@@ -761,22 +761,23 @@
         height: 21px;
       }
     }
-    .left-border {
+    .content-left-border {
       width: 3px;
       height: 100%;
       margin-left: 12px;
       margin-right: 10px;
     }
-    .right-border {
+    .content-right-border {
       width: 3px;
       height: 100%;
       margin-right: 14px;
       margin-left: 5px;
     }
 
-    .left-border,
+    .content-left-border,
-    .right-border {
+    .content-right-border {
       img {
+        width: 100%;
         height: 100%;
       }
     }

src/style.less

@@ -12,6 +12,7 @@
 
 body {
   color: #fff;
+  font-family: Arial;
 }
 
 .ant-layout {
@@ -109,7 +110,7 @@ body {
   }
 }
 
-// 日历
+// 日期选择
 .ant-calendar {
   border-color: @formInputBorderColor;
   border-radius: 0;
@@ -163,6 +164,82 @@ body {
       }
     }
   }
+
+  &-month {
+    &-panel {
+      background-color: @modalBg;
+      &-header {
+        border-bottom: 1px solid @formInputBorderColor;
+      }
+      &-year-select-content {
+        color: #fff;
+      }
+    }
+  }
+}
+
+// 日历
+.ant-fullcalendar {
+  border-spacing: 0;
+  &-column-header {
+    background-color: #126b82;
+    border-left: 1px solid #126b82 !important;
+    padding: 0 !important;
+    line-height: 34px;
+    &-inner {
+      text-align: center;
+    }
+  }
+
+  &-content {
+    margin-top: 10px;
+    height: 98px;
+    background-color: rgba(140, 255, 229, .1);
+    &::-webkit-scrollbar {
+      width: 4px !important;
+    }
+  }
+
+  &-date {
+    padding: 20px 10px 10px !important;
+    margin: 0 !important;
+    height: 159px !important;
+    border-top: none !important;
+  }
+
+  &-value {
+    font-size: 24px;
+    font-family: Arial;
+    color: #ade6ee !important;
+  }
+
+  &-last-month-cell,
+  &-next-month-btn-day {
+    .ant-fullcalendar-value {
+      color: rgba(173, 230, 238, .1) !important;
+    }
+  }
+
+  &-calendar-body {
+    padding: 0 !important;
+  }
+
+  &-cell {
+    border-top: 1px solid #25454e !important;
+    border-left: 1px solid #25454e !important;
+    &:last-child {
+      border-right: 1px solid #25454e !important;
+    }
+  }
+
+  &-tbody {
+    border-bottom: 1px solid #25454e;
+  }
+
+  &-selected-day &-date,
+  &-date:hover {
+    background-color: #072f32 !important;
+  }
 }
 
 @formInputBgColor: #03353f;
@@ -361,6 +438,14 @@ body {
 
 // 树形结构
 .ant-tree {
+  &-checkbox-inner {
+    background-color: #03353f;
+    border-color: #0a544e;
+    border-radius: 0;
+  }
+  &-node-content-wrapper {
+    background-color: transparent !important;
+  }
 }
 
 // 按钮
@@ -582,6 +667,32 @@ body {
   background-color: #15494c !important;
 }
 
+// 穿梭框样式
+.ant-transfer {
+  &-list {
+    border-radius: 0;
+    border-color: #224852;
+    &-header {
+      background-color: #08363c;
+      border-radius: 0;
+      border-bottom-color: #224852;
+    }
+  }
+  &-operation {
+    .ant-btn {
+      background-color: #1397a3;
+      border: none;
+      border-radius: 0;
+      color: #fff;
+      &:disabled {
+        background-color: #4f7578;
+        color: #fff;
+      }
+    }
+  }
+}
+
+
 #userLayout {
   .container {
     background-color: @modalBg !important;
@@ -607,3 +718,7 @@ body {
 ::-webkit-scrollbar-track-piece {
   background-color: #15494c !important;
 }
+
+::-webkit-scrollbar-corner {
+  background-color: #15494c;
+}

src/views/system/DataBase.vue

@@ -10,14 +10,14 @@
     </search-form>
     <custom-table
       size="middle"
-      rowKey="id"
+      rowKey="sampleId"
       :columns="columns"
       :list="dataSource"
       :pagination="ipagination"
       :loading="loading"
       @change="handleTableChange"
       :selectedRowKeys.sync="selectedRowKeys"
-      :scroll="{ y: 'calc(100vh - 405px)' }"
+      :scroll="{ x: true, y: 'calc(100vh - 405px)' }"
     >
       <template slot="index" slot-scope="{ index }">
         {{ index + 1 }}
@@ -28,8 +28,197 @@
 
 <script>
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import { getAction } from '../../api/manage'
 
-const formItems = [
+const columns = [
+  {
+    title: 'NO',
+    align: 'center',
+    width: 100,
+    scopedSlots: {
+      customRender: 'index'
+    }
+  },
+  {
+    title: 'SITE DET CODE',
+    align: 'center',
+    dataIndex: 'siteDetCode',
+    width: 120
+  },
+  {
+    title: 'SAMPLE ID',
+    align: 'center',
+    width: 100,
+    dataIndex: 'sampleId'
+  },
+  {
+    title: 'STATION',
+    align: 'center',
+    width: 100,
+    dataIndex: 'stationName'
+  },
+  {
+    title: 'DETECTOR',
+    align: 'center',
+    width: 100,
+    dataIndex: 'detectorsName'
+  },
+  {
+    title: 'SAMPLE TYPE',
+    align: 'center',
+    width: 120,
+    dataIndex: 'sampleType'
+  },
+  {
+    title: 'DATA TYPE',
+    align: 'center',
+    width: 100,
+    dataIndex: 'dataType'
+  },
+  {
+    title: 'GEOMETRY',
+    align: 'center',
+    width: 100,
+    dataIndex: 'geometry'
+  },
+  {
+    title: 'QUALIFIE',
+    align: 'center',
+    width: 100,
+    dataIndex: 'spectralQualifie'
+  },
+  {
+    title: 'TRANSMIT DTG',
+    align: 'center',
+    width: 150,
+    dataIndex: 'transmitDtg'
+  },
+  {
+    title: 'COLLECT START',
+    align: 'center',
+    width: 150,
+    dataIndex: 'collectStart'
+  },
+  {
+    title: 'COLLECT STOP',
+    align: 'center',
+    width: 150,
+    dataIndex: 'collectStop'
+  },
+  {
+    title: 'ACQ.START',
+    align: 'center',
+    width: 150,
+    dataIndex: 'acquisitionStart'
+  },
+  {
+    title: 'ACQ.STOP',
+    align: 'center',
+    width: 150,
+    dataIndex: 'acquisitionStop'
+  },
+  {
+    title: 'ACQ.REAL(S)',
+    align: 'center',
+    width: 100,
+    dataIndex: 'acquisitionRealSec'
+  },
+  {
+    title: 'ACQ.LIVE(S)',
+    align: 'center',
+    width: 100,
+    dataIndex: 'acquisitionLiveSec'
+  },
+  {
+    title: 'QUANTITY',
+    align: 'center',
+    width: 100,
+    dataIndex: 'quantity'
+  },
+  {
+    title: 'STATUS',
+    align: 'center',
+    width: 100,
+    dataIndex: 'status'
+  }
+]
+
+export default {
+  mixins: [JeecgListMixin],
+  data() {
+    this.columns = columns
+    return {
+      queryParam: {
+        station: '',
+        detector: ''
+      },
+      url: {
+        list: '/gardsSampleData/findPage',
+        delete: '/gardsSampleData/deleteById'
+      },
+      stationList: [],
+      detectorList: []
+    }
+  },
+  created() {
+    this.getStationList()
+    this.getDetectorList()
+  },
+  methods: {
+    async getStationList() {
+      try {
+        const { success, result, message } = await getAction('/gardsStations/findPage', {
+          pageIndex: 1,
+          pageSize: 10000
+        })
+        if (success) {
+          this.stationList = result.records.map(record => ({ label: record.stationCode, value: record.stationId }))
+        } else {
+          this.$message.error(message)
+        }
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    async getDetectorList() {
+      try {
+        const { success, result, message } = await getAction('/gardsDetectors/findPage', {
+          pageIndex: 1,
+          pageSize: 10000
+        })
+        if (success) {
+          this.detectorList = result.records.map(record => ({ label: record.detectorCode, value: record.detectorId }))
+        } else {
+          this.$message.error(message)
+        }
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+
+    onDel() {
+      if (this.selectedRowKeys && this.selectedRowKeys.length) {
+        this.$confirm({
+          title: 'Do You Want To Delete This Item?',
+          okText: 'OK',
+          cancelText: 'Cancel',
+          onOk: () => {
+            this.handleDelete(this.selectedRowKeys[0], 'sampleId')
+          }
+        })
+      } else {
+        this.$message.warn('Please Select An Item To Delete')
+      }
+    }
+  },
+  computed: {
+    formItems() {
+      return [
         {
           label: 'SampleID',
           type: 'a-input',
@@ -39,28 +228,34 @@ const formItems = [
         {
           label: 'Station',
           type: 'custom-select',
-    name: 'station',
+          name: 'stationId',
           props: {
             options: [
               {
                 label: 'ALL',
                 value: ''
-        }
+              },
-      ]
+              ...this.stationList
+            ],
+            showSearch: true,
+            filterOption: this.filterOption
           },
           span: 4
         },
         {
           label: 'Detector',
           type: 'custom-select',
-    name: 'detector',
+          name: 'detectorId',
           props: {
             options: [
               {
                 label: 'ALL',
                 value: ''
-        }
+              },
-      ]
+              ...this.detectorList
+            ],
+            showSearch: true,
+            filterOption: this.filterOption
           },
           span: 4
         },
@@ -101,103 +296,7 @@ const formItems = [
             width: '600px'
           }
         }
-]
+      ]
-
-const columns = [
-  {
-    title: 'NO',
-    align: 'center',
-    width: 100,
-    scopedSlots: {
-      customRender: 'index'
-    }
-  },
-  {
-    title: 'SITE DET CODE',
-    align: 'center',
-    dataIndex: 'siteDetCode',
-    width: 100
-  },
-  {
-    title: 'STATION ID',
-    align: 'center',
-    width: 100,
-    dataIndex: 'stationId'
-  },
-  {
-    title: 'STATION',
-    align: 'center',
-    width: 100,
-    dataIndex: 'station'
-  },
-  {
-    title: 'DETECTOR',
-    align: 'center',
-    width: 100,
-    dataIndex: 'detector'
-  },
-  {
-    title: 'SAMPLE TYPE',
-    align: 'center',
-    width: 100,
-    dataIndex: 'sampleType'
-  },
-  {
-    title: 'DATA TYPE',
-    align: 'center',
-    width: 100,
-    dataIndex: 'dataType'
-  },
-  {
-    title: 'GEOMETRY',
-    align: 'center',
-    width: 100,
-    dataIndex: 'geometry'
-  },
-  {
-    title: 'QUALIFIE',
-    align: 'center',
-    width: 100,
-    dataIndex: 'qualifie'
-  },
-  {
-    title: 'TRANSMIT DTG',
-    align: 'center',
-    width: 100,
-    dataIndex: 'transmitDtg'
-  }
-]
-
-export default {
-  mixins: [JeecgListMixin],
-  data() {
-    this.formItems = formItems
-    this.columns = columns
-    return {
-      queryParam: {
-        station: '',
-        detector: ''
-      },
-      url: {
-        list: '/sys/user/list',
-        delete: ''
-      }
-    }
-  },
-  methods: {
-    onDel() {
-      if (this.selectedRowKeys && this.selectedRowKeys.length) {
-        this.$confirm({
-          title: 'Do You Want To Delete This Item?',
-          okText: 'OK',
-          cancelText: 'Cancel',
-          onOk: () => {
-            this.handleDelete(this.selectedRowKeys[0])
-          }
-        })
-      } else {
-        this.$message.warn('Please Select An Item To Delete')
-      }
     }
   }
 }