emailMonitor 模块 instances页面代码调整，接口联调

新增核素平均值列表页面，及当前页面的接口联调

src/views/abnormalAlarm/analysisMonitor/avgNuclide/index.vue

@@ -0,0 +1,284 @@
+<template>
+  <div style="height: 100%;">
+    <div class="search-bar">
+      <a-row type="flex">
+        <a-col flex="108px">
+          <a-button class="search-btn" type="primary" @click="handleConfig">
+            Config
+          </a-button>
+        </a-col>
+        <a-col flex="380px">
+          <span class="item-label">Cacl date</span>
+          <a-range-picker
+            dropdownClassName="asd"
+            :default-value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
+            @change="onRangeDateChange" 
+          />
+        </a-col>
+      </a-row>
+    </div>
+    <div class="analysis-main">
+      <TableList
+        size="middle"
+        rowKey="id"
+        :columns="columns"
+        :list="dataSource"
+        :loading="loading"
+        :pagination="false"
+        :canSelect="false"
+      >
+      </TableList>
+      <a-pagination 
+        size="small"
+        v-model="ipagination.current" 
+        :pageSize="ipagination.pageSize"
+        :page-size-options="ipagination.pageSizeOptions"
+        show-size-changer
+        show-quick-jumper
+        :total="ipagination.total"
+        :show-total="(total, range) => `Total ${total} items　Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
+        show-less-items 
+        @change="handlePageChange"
+        @showSizeChange="handleSizeChange"
+      />
+    </div>
+    <a-modal 
+      title="Config" 
+      v-model="visible" 
+      @cancel="onCancel"
+    >
+    <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 16 }">
+      <a-form-item label="Days">
+        <a-input-number
+          v-decorator="[
+            'days', 
+            { 
+              rules: [{ required: true, message: 'Please input days!' }],
+              initialVale: this.formVal.days
+            }
+          ]"
+        />
+      </a-form-item>
+      <a-form-item label="Index">
+        <a-input-number
+          v-decorator="[
+            'index', 
+            { 
+              rules: [{ required: true, message: 'Please input index!' }],
+              initialVale: this.formVal.index
+            }
+          ]"
+        />
+      </a-form-item>
+    </a-form>
+      <template slot="footer">
+        <a-space class="operators" :size="20">
+          <a-button type="success" @click="onSave">Save</a-button>
+          <a-button type="warn"  @click="onCancel">Cancel</a-button>
+        </a-space>
+      </template>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import dateFormat from '@/components/jeecg/JEasyCron/format-date'
+import moment from 'moment';
+import TableList from '../../components/tableList.vue';
+import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
+const columns = [
+  {
+    title: 'NUCLIDE',
+    align: 'center',
+    dataIndex: 'nuclide',
+    // width: 200,
+  },{
+    title: 'VAL',
+    align: 'center',
+    dataIndex: 'val',
+    // width: 200,
+  },{
+    title: 'CYCLE',
+    align: 'center',
+    dataIndex: 'cycle',
+    // width: 200,
+  },{
+    title: 'DATA SOURCE TYPE',
+    align: 'center',
+    dataIndex: 'datasource',
+    // width: 200,
+  },{
+    title: 'CACL DATE',
+    align: 'center',
+    dataIndex: 'caclDate',
+    // width: 200,
+  },
+]
+export default {
+  components: {
+    TableList,
+  },
+  data() {
+    return {
+      columns,
+      dataSource: [],
+      loading: false,
+      queryParams: {
+        startDate: dateFormat(new Date(), 'yyyy-MM-dd'),
+        endDate: dateFormat(new Date(), 'yyyy-MM-dd')
+      },
+      ipagination:{
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '20', '30'],
+        showTotal: (total, range) => {
+          const { current, pageSize } = this.ipagination
+          return `Total ${total} items　Page ${current} / ${Math.ceil(total / pageSize)}`
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      isAdd: true,
+      visible: false,
+      form: this.$form.createForm(this),
+      formVal: {
+        days:"",
+        index: "",
+      },
+      currId:""
+    }
+  },
+  mounted () {
+    this.getNuclideAvgList();
+  },
+  methods: {
+    moment,
+    getNuclideAvgList() {
+      let params = {
+        startDate:this.queryParams.startDate,
+        endDate:this.queryParams.endDate,
+        pageNo: this.ipagination.current,
+        pageSize: this.ipagination.pageSize
+      }
+      getAction("/nuclideAvg/findPage",params).then(res => {
+        if (res.success) {
+          this.dataSource = res.result.records
+          this.ipagination.total = res.result.total
+        } else {
+          this.$message.warning("This operation fails. Contact your system administrator")
+        }
+      })
+    },
+    onRangeDateChange(date, dateString) {
+      this.queryParams.startDate = dateString[0]
+      this.queryParams.endDate = dateString[1]
+      this.getNuclideAvgList()
+    },
+    handlePageChange(page, pageSize) {
+      this.ipagination.current = page
+      this.ipagination.pageSize = pageSize
+      this.getNuclideAvgList()
+    },
+    handleSizeChange(current, size) {
+      this.ipagination.current = current
+      this.ipagination.pageSize = size
+      this.getNuclideAvgList()
+    },
+    handleConfig() {
+      this.visible = true
+      getAction("/nuclideParam/findInfo").then(res => {
+        if (res.success) {
+          this.currId = res.result.id
+          this.form.setFieldsValue({
+            days: res.result.days,
+            index: res.result.index
+          });
+        } else {
+          this.$message.warning("This operation fails. Contact your system administrator")
+        }
+      })
+    },
+    onSave() {
+      this.form.validateFields((err, values) => { 
+        if (!err) { 
+          let params = {
+              id: this.currId,
+              ...values
+            }
+            httpAction("/nuclideParam/update", params, "put").then(res => {
+              if (res.success) {
+                this.form.resetFields()
+                this.visible = false
+                this.$message.success("success")
+              } else {
+                this.$message.info(res.result.message)
+              }
+            })
+        }
+      })
+    },
+    onCancel() {
+      this.form.resetFields()
+      this.visible = false
+    },
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.search-bar{
+  height: 50px;
+  border-top: 1px solid rgba(13, 235, 201, 0.3);
+  border-bottom: 1px solid rgba(13, 235, 201, 0.3);
+  margin-left: 20px;
+  padding: 8px 10px;
+  background: rgba(12, 235, 201, 0.05);
+}
+.ant-calendar-picker{
+  width: 270px;
+}
+.search-btn {
+  margin-bottom: 10px;
+}
+/deep/ .ant-calendar-range-picker-separator{
+  color: white;
+}
+.item-label{
+  display: inline-block;
+  font-size: 16px;
+  font-family: ArialMT;
+  color: #ade6ee;
+  line-height: 32px;
+  height: 32px;
+  margin-right: 10px;
+}
+.analysis-main{
+  width: 100%;
+  height: calc(100% - 50px);
+  overflow: hidden;
+  padding-top: 15px;
+  margin-left: 20px;
+  position: relative;
+}
+.ant-pagination{
+  position: absolute;
+  left: 50%;
+  bottom: 0;
+  transform: translateX(-50%);
+}
+.operators {
+  width: 100%;
+  justify-content: center;
+  .ant-btn {
+    width: 92px;
+  }
+}
+/deep/.ant-modal-title{
+  letter-spacing: 1px;
+}
+.ant-input-number{
+  width: 100%;
+  background-color: #03353f !important
+}
+</style>

src/views/abnormalAlarm/components/searchBar.vue

@@ -366,13 +366,4 @@ export default {
   position: relative;
   background: #03353f;
 }
-
-  // .asd{
-  //   .ant-calendar-range .ant-calendar-input ,
-  //   .ant-calendar-range .ant-calendar-time-picker-input{
-  //     color: red !important;
-  //     background: none !important;
-  //   }
-  // }
-
 </style>

src/views/abnormalAlarm/emailMonitor/instances/index.vue

@@ -3,7 +3,7 @@
     <div class="email-top">
       <BoxTitle title="Receiving information">
         <template slot="right">
-          <div>
+          <div style="display: flex;align-items: center;">
             <span class="item-label">Email</span>
             <a-select style="width:160px"
               v-model="email" 
@@ -30,6 +30,7 @@
             <div class="email-top-content-li-right-title">Mailbox connection status</div>
             <div class="email-top-content-li-right-val">{{ emailStatus?"NORMAL":"ABNORMAL" }}</div>
           </div>
+          <div class="email-top-content-li-rect" style="background: #24d870;"></div>
         </div>
         <div class="email-top-content-li email-top-content-item1">
           <div class="email-top-content-li-left">
@@ -42,6 +43,7 @@
             <div class="email-top-content-li-right-title">Total mail volume for today</div>
             <div class="email-top-content-li-right-val" style="color: #ade6ee;font-size: 30px;">{{emailTotal.today||0}}</div>
           </div>
+          <div class="email-top-content-li-rect" style="background: #00ddfe;"></div>
         </div>
         <div class="email-top-content-li email-top-content-item2">
           <div class="email-top-content-li-left">
@@ -54,6 +56,7 @@
             <div class="email-top-content-li-right-title">Total mail volume of yesterday</div>
             <div class="email-top-content-li-right-val" style="color: #ade6ee;font-size: 30px;">{{emailTotal.yesterday||0}}</div>
           </div>
+          <div class="email-top-content-li-rect" style="background: #7c9da2;"></div>
         </div>
         <div class="email-top-content-li email-top-content-item3">
           <div class="email-top-content-li-left">
@@ -66,6 +69,7 @@
             <div class="email-top-content-li-right-title">Total mail volume of the past week</div>
             <div class="email-top-content-li-right-val" style="color: #ade6ee;font-size: 30px;">{{emailTotal.week||0}}</div>
           </div>
+          <div class="email-top-content-li-rect" style="background: #cca817;"></div>
         </div>
         <div class="email-top-content-li email-top-content-item4">
           <div class="email-top-content-item4-left">
@@ -81,6 +85,7 @@
           <div  class="email-top-content-item4-right">
             <div class="email-top-content-item4-right-chart" id="store"></div>
           </div>
+          <div class="email-top-content-li-rect" style="background: #e54f0d;"></div>
         </div>
       </div>
     </div>
@@ -92,7 +97,7 @@
     <div class="email-footer">
       <BoxTitle title="Mail reception statistics">
         <template slot="right">
-          <div>
+          <div style="display: flex;align-items: center;">
             <a-select style="width:160px"
               v-model="date" 
               placeholder="select..."
@@ -217,13 +222,15 @@ export default {
       timeLine: null,
       xData: [],
       yData: [],
+      currId:""
     }
   },
   created () {
     this.startDate = this.getBeforeDate(6)
   },
   mounted() {
-    this.getServerList()
+    this.currId = this.$route.query.emailId
+    this.getEmailList()
     this.getEmailStatus()
     this.getEmailTotal()
     this.getEmailSpace()
@@ -240,10 +247,10 @@ export default {
         option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
       );
     },
-    getServerList() {
+    getEmailList() {
-      getAction("/sysServer/sourceList").then(res => {
+      getAction("/sysEmail/sourceList").then(res => {
         if (res.success) {
-          this.serverOptions = res.result.map(item => {
+          this.emailOptions = res.result.map(item => {
             return {
               label: item.sourceName,
               value: item.sourceId
@@ -255,7 +262,7 @@ export default {
       })
     },
     onEmailChange(val) {
-      console.log(val);
+      this.currId = val
     },
     onDateChange(val) {
       console.log(this.getBeforeDate(val-1));
@@ -266,7 +273,7 @@ export default {
       this.endDate = dateString[1]
     },
     getEmailStatus() {
-      getAction("/sysEmailLog/status",{emailId:this.$route.query.emailId}).then(res => {
+      getAction("/sysEmailLog/status",{emailId:this.currId}).then(res => {
         if (res.success) {
           this.emailStatus = res.result
         } else {
@@ -275,7 +282,7 @@ export default {
       })
     },
     getEmailTotal() {
-      getAction("/sysEmailLog/total",{emailId:this.$route.query.emailId}).then(res => {
+      getAction("/sysEmailLog/total",{emailId:this.currId}).then(res => {
         if (res.success) {
           this.emailTotal = res.result
         } else {
@@ -284,7 +291,7 @@ export default {
       })
     },
     getEmailSpace() {
-      getAction("/sysEmailLog/space",{emailId:this.$route.query.emailId}).then(res => {
+      getAction("/sysEmailLog/space",{emailId:this.currId}).then(res => {
         if (res.success) {
           let s = res.result.usage
           s = s.substring(0, s.length - 1)
@@ -297,7 +304,7 @@ export default {
       })
     },
     getEmailToday() {
-      // getAction("/sysEmailLog/space",{emailId:this.$route.query.emailId}).then(res => {
+      // getAction("/sysEmailLog/space",{emailId:this.currId}).then(res => {
       getAction("/sysEmailLog/today",{emailId:"1668823404678311937"}).then(res => {
         if (res.success) {
           this.emailToday = res.result
@@ -308,7 +315,7 @@ export default {
     },
     getEmailStatistics() {
       let params = {
-        emailId: this.$route.query.emailId,
+        emailId: this.currId,
         startDate: this.startDate,
         endDate: this.endDate
         // emailId: "1668823404678311937",
@@ -618,6 +625,14 @@ export default {
       width: 270px;
       height: 125px;
       background: #07282b;
+      position: relative;
+      &-rect{
+        width: 12px;
+        height: 4px;
+        position: absolute;
+        right: 0;
+        bottom: 0;
+      }
       &-left{
         width: 92px;
         height: 100%;
@@ -647,7 +662,7 @@ export default {
         }
         &-val{
           font-family: MicrogrammaD-MediExte;
-          font-size: 22px;
+          font-size: 20px;
           font-weight: normal;
           line-height: 25px;
           color: #24d870;