[update] 完善系统

public/index.html

@@ -141,7 +141,7 @@
       top: 0;
       width: 51%;
       height: 100%;
-      background: #49a9ee;
+      background: #0094FF;
       /* Old browsers */
       z-index: 1000;
       -webkit-transform: translateX(0);

src/api/systemOverview.js

@@ -28,7 +28,10 @@ const getOilWellRealTimeData = (params) => getAction('/khOilRealtimeData/realtim
 const getUserPage = (params) => getAction('/sys/user/page', params)
 // 添加用户
 const addUserInfo = (params) => postAction('/sys/user/add', params)
-
+// 删除用户
+const delUserInfo = (params) => postAction('/sys/user/delete', params)
+// 编辑用户
+const editUserInfo = (params) => postAction('/sys/user/edit', params)
 export {
   getDevicePage,
   addDevice,
@@ -41,5 +44,7 @@ export {
   saveSysSetting,
   getOilWellRealTimeData,
   getUserPage,
-  addUserInfo
+  addUserInfo,
+  delUserInfo,
+  editUserInfo
 }

src/assets/less/common.less

@@ -126,6 +126,77 @@
 }
 /* 表格样式end */
 
+/* 分页器样式begin */
+.ant-pagination.ant-table-pagination.mini {
+  @gray: #D0DEEE;
+
+  // 总条数
+  .ant-pagination-total-text {
+    font-family: PingFang SC, PingFang SC, sans-serif;
+    font-weight: 400;
+    font-size: 14px;
+    color: @gray;
+    line-height: 22px;
+    margin-right: 16px;
+  }
+  .ant-pagination-prev {
+    margin-right: 4px;
+  }
+  .ant-pagination-next {
+    margin-left: 4px;
+    margin-right: 16px;
+  }
+  .ant-pagination-prev .ant-pagination-item-link,
+  .ant-pagination-next .ant-pagination-item-link {
+    border-color: @primary-color;
+    color: @gray;
+  }
+  .ant-pagination-jump-prev,
+  .ant-pagination-jump-next {
+    border: @primary-color 1px solid;
+    min-width: 24px;
+    margin-left: 4px;
+    margin-right: 4px;
+
+    .ant-pagination-item-ellipsis {
+      color: @gray;
+      font-size: 8px;
+    }
+  }
+  .ant-pagination-item {
+    margin-left: 4px;
+    margin-right: 4px;
+
+    & > a {
+      color: @gray;
+    }
+    & > a:hover {
+      color: @text-color;
+    }
+
+    &:not(.ant-pagination-item-active) {
+      border-color: @primary-color;
+    }
+  }
+  .ant-pagination-item-active {
+    background: linear-gradient( 180deg, rgba(0,148,255,0) 0%, rgba(0,148,255,0.8) 100%);
+
+    & > a {
+      color: @text-color;
+    }
+  }
+  .ant-select-arrow {
+    display: inline-block;
+    color: @gray;
+  }
+  .ant-select-arrow::after {
+    display: none;
+    content: none;
+  }
+}
+/* 分页器样式end */
+
+
 /* 复选框begin */
 .ant-checkbox-inner,
 .ant-tree-checkbox-inner{
@@ -286,6 +357,22 @@
   border: 1px solid #FF5353;
   color: @text-color;
 }
+
+.ant-btn.ant-btn-primary,
+.ant-btn.ant-btn-primary:hover,
+.ant-btn.ant-btn-primary:focus {
+  background: linear-gradient( 180deg, rgba(0,148,255,0) 0%, rgba(0,148,255,0.6) 100%);
+  border: 1px solid #0094FF;
+  color: @text-color;
+}
+
+.ant-btn.ant-btn-danger,
+.ant-btn.ant-btn-danger:hover,
+.ant-btn.ant-btn-danger:focus {
+  background: linear-gradient( 0deg, rgba(255,83,83,0.6) 00%, rgba(255,83,83,0) 100%);
+  border: 1px solid #FF5353;
+  color: @text-color;
+}
 /* 部分组件end */
 
 .ml-8 {
@@ -432,7 +519,7 @@
     margin-bottom: 4px;
   }
   .ant-form-item {
-    margin-bottom: 0px;
+    margin-bottom: 16px;
   }
   .ant-form-item-label > label::after {
     display: none;
@@ -453,3 +540,32 @@
   flex-direction: column;
   justify-content: space-between;
 }
+
+.tag-blue {
+  background: rgba(0,148,255,0.2);
+  color: rgba(0,148,255,1);
+  border-radius: 2px;
+  display: inline-block;
+  height: 24px;
+  font-size: 13px;
+  line-height: 24px;
+  padding: 0 12px;
+
+}
+.tag-cyan {
+  background: rgba(46,228,253,0.2);
+  color: rgba(46,228,253);
+  border-radius: 2px;
+  display: inline-block;
+  height: 24px;
+  font-size: 13px;
+  line-height: 24px;
+  padding: 0 12px;
+}
+/*表格中换行文本的样式*/
+.table-text {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
+}

src/assets/less/modifyLessVars.js

@@ -1,7 +1,7 @@
 module.exports = {
   // 背景色
   'component-background': '#001B36',
-  'background-color-base': 'rgba(0,27,54,0.67)', // 基础背景色
+  'background-color-base': '#001B3688', // 基础背景色
   'background-color-light': 'rgba(0, 148, 255, 0.30)', // 基础高亮背景色
 
   // 边框色

src/assets/less/modifyLessVars.less

@@ -1,7 +1,7 @@
 @primary-color: #0094FF;
 /* 背景色 */
 @component-background: #001B36;
-@background-color-base: #001B36AA;
+@background-color-base: #001B3688;
 @background-color-light: rgba(0, 148, 255, 0.30);
 
 /* 边框色 */

src/components/CommonCardInfo.vue

@@ -4,7 +4,7 @@
       <div class="info-row" v-for="(item, index) in leftList" :key="item.id || (item.label + index)">
         <div class="info-label" :title="item.label">{{ item.label }}</div>
         <!-- valueField是数据的字段，表示从data中取数据 -->
-        <div v-if="item.valueField" class="info-value over-text" :title="data[item.valueField]">{{ data[item.valueField] }}</div>
+        <div v-if="item.valueField && data" class="info-value over-text" :title="data[item.valueField]">{{ data[item.valueField] }}</div>
         <div v-else class="info-value over-text" :title="item.value">{{ item.value }}</div>
       </div>
     </a-col>
@@ -13,7 +13,7 @@
       <div class="info-row" v-for="(item, index) in rightList" :key="item.id || (item.label + index)">
         <div class="info-label" :title="item.label">{{ item.label }}</div>
         <!-- valueField是数据的字段，表示从data中取数据 -->
-        <div v-if="item.valueField" class="info-value over-text" :title="data[item.valueField]">{{ data[item.valueField] }}</div>
+        <div v-if="item.valueField && data" class="info-value over-text" :title="data[item.valueField]">{{ data[item.valueField] }}</div>
         <div v-else class="info-value over-text" :title="item.value">{{ item.value }}</div>
       </div>
     </a-col>
@@ -37,7 +37,7 @@ export default {
     },
     // 数据
     data: {
-      type: Array,
+      type: Object,
       required: false,
       default: () => ({})
     }
@@ -46,5 +46,7 @@ export default {
 </script>
 
 <style scoped>
-
+.info-row .info-value {
+  max-width: 50%;
+}
 </style>

src/components/menu/FirstLevelMenu.vue

@@ -74,6 +74,14 @@ export default {
   methods: {
     // 选择菜单
     selectMenu (menu) {
+      console.log(menu)
+      if (menu.path !== '/systemOverview') {
+        this.$warning({
+          title: '系统建设中',
+          onOk: () => {}
+        })
+        return
+      }
       this.selectPath = menu.path
       if (menu.children && menu.children.length > 0) {
         this.$router.push({ path: menu.children[0].path })
@@ -128,7 +136,7 @@ export default {
           }
         }
       }
-    },
+    }
   }
 }
 </script>
@@ -154,7 +162,11 @@ export default {
       box-sizing: border-box;
       margin: 0 20px;
       max-width: 68px;
-
+       // 1366下调整
+       @media screen and (max-width: 1367px) {
+         transform: scale(0.9);
+         margin: 10px 4px 0;
+       }
       .menu-item {
         position: relative;
         width: 68px;

src/components/page/GlobalLayout.vue

@@ -297,7 +297,7 @@ export default {
 
       .user-wrapper {
         float: right;
-        height: 100%;
+        //height: 100%;
         .small-action {
           cursor: pointer;
           padding: 0 5px;

src/components/tools/UserMenu.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="user-wrapper" :class="theme">
     <span class="action">
-      <a class="logout_title" target="_blank" href="#">
+      <a class="logout_title" @click="handleHelp">
         <div class="operate" title="帮助">
           <img :src="require(`@assets/images/icon/help.png`)" alt="help" class="operate-img">
           <span class="operate-text">帮助</span>
@@ -84,7 +84,7 @@ import { mixinDevice } from '@/utils/mixin.js'
 import { getFileAccessHttpUrl, getAction } from '@/api/manage'
 import Vue from 'vue'
 import { UI_CACHE_DB_DICT_DATA } from '@/store/mutation-types'
-import { UserOutlined } from '@ant-design/icons-vue';
+import { UserOutlined } from '@ant-design/icons-vue'
 export default {
   name: 'UserMenu',
   mixins: [mixinDevice],
@@ -238,8 +238,14 @@ export default {
         this.$message.warn('刷新缓存失败！')
         console.log('刷新失败', e)
       })
-    }
+    },
     /* update_end author:liushaoqian date:20200507 for: 刷新缓存 */
+    handleHelp () {
+      this.$warning({
+        title: '系统建设中',
+        onOk: () => {}
+      })
+    }
   }
 }
 </script>

src/enums/commonEnums.js

@@ -21,3 +21,9 @@ export const wellheadType = {
   oil: { label: '油井', value: '1' },
   water: { label: '水井', value: '2' }
 }
+
+// 用户类别
+export const userType = {
+  admin: { label: '管理员', value: 'admin' },
+  common: { label: '普通用户', value: 'common' }
+}

src/views/system/modules/PermissionModal.vue

@@ -6,7 +6,7 @@
     :visible="visible"
     :confirmLoading="confirmLoading">
 
-    <div :style="{width: '100%',border: '1px solid #e9e9e9',padding: '10px 16px',background: '#fff',}">
+    <div :style="{width: '100%',padding: '10px 16px',}">
     <a-spin :spinning="confirmLoading">
       <a-form-model ref="form" :model="model" :rules="validatorRules">
 

src/views/systemOverview/equipmentManagement/EquipmentManagement.vue

@@ -34,13 +34,14 @@
           </div>
         </common-card>
       </a-col>
-      <a-col flex="auto">
+      <a-col flex="1">
         <common-card title="设备列表">
           <a-table
             ref="table"
             size="middle"
             bordered
             rowKey="id"
+            :loading="deviceData.loading"
             :scroll="{x: true,y:200}"
             :columns="deviceData.columns"
             :dataSource="deviceData.dataSource"
@@ -61,7 +62,7 @@
       </a-col>
     </a-row>
 
-    <a-row :gutter="20" type="flex">
+    <a-row :gutter="20" type="flex" class="mb-20">
       <a-col flex="545px">
         <common-card title="系统消息">
           <a-table
@@ -81,7 +82,7 @@
           </a-table>
         </common-card>
       </a-col>
-      <a-col flex="auto">
+      <a-col flex="1">
         <a-row type="flex">
           <a-col flex="1" style="margin-right: 20px">
             <common-card title="添加设备">
@@ -276,7 +277,7 @@ export default {
           pageSize: 10,
           pageSizeOptions: ['10', '20', '30'],
           showTotal: (total, range) => {
-            return range[0] + '-' + range[1] + ' 共' + total + '条'
+            return '共' + total + '条'
           },
           showQuickJumper: true,
           showSizeChanger: true,
@@ -310,41 +311,49 @@ export default {
         ],
         dataSource: [
           {
+            id: '1',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '用户登录',
             messageContent: '张三登录系统'
           },
           {
+            id: '2',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备上线',
             messageContent: '树101-1RTU控制器上线'
           },
           {
+            id: '3',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备下线',
             messageContent: '树101-1RTU控制器上线'
           },
           {
+            id: '4',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备上线',
             messageContent: '树101-1RTU控制器上线'
           },
           {
+            id: '5',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备上线',
             messageContent: '树101-1RTU控制器上线'
           },
           {
+            id: '6',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备上线',
             messageContent: '树101-1RTU控制器上线'
           },
           {
+            id: '7',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '设备下线',
             messageContent: '树101-1RTU控制器下线'
           },
           {
+            id: '8',
             triggerTime: '2024-3-15 13:55:26',
             messageType: '用户退出',
             messageContent: '张三退出系统'
@@ -377,7 +386,7 @@ export default {
     // 分页、排序、筛选变化时触发
     handleTableChange (pagination, filters, sorter) {
       this.deviceData.ipagination = pagination
-      // this.loadData()
+      this.loadDeviceList()
     },
     // 设备状态改变
     handleChangeStatus (record) {

src/views/systemOverview/systemSettings/SystemSettings.vue

@@ -50,7 +50,7 @@
             size="middle"
             bordered
             rowKey="id"
-            :scroll="{x: true,y:200}"
+            :scroll="{x: true,y:280}"
             :columns="userInfo.columns"
             :dataSource="userInfo.dataSource"
             :pagination="userInfo.ipagination"
@@ -61,9 +61,19 @@
                 <div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
               </a-tooltip>
             </template>
+            <template slot="userType" slot-scope="text, record">
+              <a-tooltip>
+                <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
+                <div class="table-text"
+                     :class="{
+                      'tag-blue': record.userType === userType.admin.value,
+                      'tag-cyan': record.userType === userType.common.value
+                }">{{ text || text === 0 ? text : global.emptyLine }}</div>
+              </a-tooltip>
+            </template>
             <span slot="action" slot-scope="text, record, index" class="operation-btns">
-              <a class="primary" @click="handleChangeStatus(record, index)">编辑</a>
+              <a class="primary" @click="handleEditUser(record, index)">编辑</a>
-              <a class="danger" @click="handleDelete(record, index)">删除</a>
+              <a class="danger" @click="handleDeleteUser(record, index)">删除</a>
             </span>
           </a-table>
         </common-card>
@@ -133,7 +143,7 @@
             size="middle"
             bordered
             rowKey="id"
-            :scroll="{x: true,y:200}"
+            :scroll="{x: true,y:360}"
             :columns="communicationLog.columns"
             :dataSource="communicationLog.dataSource"
             :pagination="communicationLog.ipagination"
@@ -152,20 +162,24 @@
         </common-card>
       </a-col>
     </a-row>
+    <!--  用户信息编辑  -->
+    <user-info-modal ref="userInfoModal" @ok="loadUserList"/>
   </a-spin>
 </template>
 
 <script>
 import CommonCard from '@comp/CommonCard'
-import { addUserInfo, getSysSetting, getUserPage, saveSysSetting } from '@api/systemOverview'
+import { addUserInfo, delUserInfo, getSysSetting, getUserPage, saveSysSetting } from '@api/systemOverview'
-import { dataAcquisitionCycle, dataAcquisitionProtocol } from '@/enums/commonEnums'
+import { dataAcquisitionCycle, dataAcquisitionProtocol, userType } from '@/enums/commonEnums'
 import { getRSAPublicKey } from '@/utils/encryption'
 import { JSEncrypt } from 'jsencrypt'
+import UserInfoModal from '@views/systemOverview/systemSettings/modules/UserInfoModal'
 export default {
   name: 'SystemSettings',
-  components: { CommonCard },
+  components: { UserInfoModal, CommonCard },
   data () {
     return {
+      userType,
       loading: false,
       // 系统设置表单
       sysSettingForm: this.$form.createForm(this),
@@ -210,11 +224,11 @@ export default {
             scopedSlots: { customRender: 'text' }
           },
           {
-            dataIndex: 'roleTxt',
+            dataIndex: 'userType_dictText',
             title: '用户类别',
             align: 'center',
             width: '20%',
-            scopedSlots: { customRender: 'text' }
+            scopedSlots: { customRender: 'userType' }
           },
           {
             dataIndex: 'orgCodeTxt',
@@ -238,7 +252,7 @@ export default {
           pageSize: 10,
           pageSizeOptions: ['10', '20', '30'],
           showTotal: (total, range) => {
-            return range[0] + '-' + range[1] + ' 共' + total + '条'
+            return '共' + total + '条'
           },
           showQuickJumper: true,
           showSizeChanger: true,
@@ -254,28 +268,94 @@ export default {
       communicationLog: {
         columns: [
           {
-            dataIndex: 'deviceStatus_dictText',
+            dataIndex: 'time',
             title: '时间',
             align: 'center',
-            width: '20%',
+            width: '30%',
             scopedSlots: { customRender: 'text' }
           },
           {
-            dataIndex: 'deviceName',
+            dataIndex: 'msgType',
             title: '消息类型',
             align: 'center',
-            width: '20%',
+            width: '30%',
             scopedSlots: { customRender: 'text' }
           },
           {
-            dataIndex: 'deviceSn',
+            dataIndex: 'msgContent',
             title: '消息内容',
             align: 'center',
-            width: '20%',
+            width: '40%',
             scopedSlots: { customRender: 'text' }
           }
         ],
-        dataSource: []
+        dataSource: [
+          {
+            id: '1',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Host-》Device',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '2',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Device-》Host',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '3',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Host-》Device',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '4',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Device-》Host',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '5',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Host-》Device',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '6',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Device-》Host',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '7',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Host-》Device',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          },
+          {
+            id: '8',
+            time: '2024-3-15 13:55:26',
+            msgType: 'Device-》Host',
+            msgContent: '01 03 00 00 00 05 89 C5'
+          }
+        ],
+        /* 分页参数 */
+        ipagination: {
+          current: 1,
+          pageSize: 10,
+          pageSizeOptions: ['1', '10', '20', '30'],
+          showTotal: (total, range) => {
+            return '共' + total + '条'
+          },
+          showQuickJumper: true,
+          showSizeChanger: true,
+          total: 0
+        },
+        /* 排序参数 */
+        isorter: {
+          column: 'createTime',
+          order: 'desc'
+        }
       },
       // 公钥
       rsaPublicKey: '',
@@ -361,11 +441,12 @@ export default {
         this.userInfo.loading = false
       })
     },
-    handleUserInfoTableChange () {
+    handleUserInfoTableChange (pagination) {
-      console.log()
+      this.userInfo.ipagination = pagination
+      this.loadUserList()
     },
-    handleCommunicationLogTableChange () {
+    handleCommunicationLogTableChange (pagination) {
-      console.log()
+      this.communicationLog.ipagination = pagination
     },
     // 添加用户
     async handleAddUser () {
@@ -406,6 +487,34 @@ export default {
       } else {
         callback(new Error('您的手机号码格式不正确'))
       }
+    },
+    // 编辑用户
+    handleEditUser (record) {
+      // this.$refs.userInfoModal.edit(record)
+    },
+    // 删除用户
+    handleDeleteUser (record) {
+      const { id } = record
+      this.$confirm({
+        title: '确认删除',
+        content: '确定要删除此条数据吗?',
+        onOk: () => {
+          delUserInfo({ id }).then((res) => {
+            if (res.success) {
+              this.$message.success(res.message)
+              // 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
+              if (this.userInfo.ipagination.current > 1 && ((this.userInfo.ipagination.current - 1) * this.userInfo.ipagination.pageSize) + 1 === this.userInfo.ipagination.total) {
+                this.userInfo.ipagination.current -= 1
+              }
+              this.loadData()
+            } else {
+              this.$message.warning(res.message)
+            }
+          }).finally(() => {
+            this.loadUserList()
+          })
+        }
+      })
     }
   }
 }

src/views/systemOverview/wellheadDataMonitoring/WellheadDataMonitoring.vue

@@ -62,7 +62,7 @@
           <!--  泵型图  -->
           <div class="pump-type mb-20">
             <div class="pump-type-title">泵型：常规泵</div>
-            <div class="pump-type-remarks">备注：-----</div>
+            <div class="pump-type-remarks">备注：备注备注备注备注</div>
           </div>
           <common-card-info :left-list="data.oilWellProductionDataLeft"
                             :right-list="data.oilWellProductionDataRight"/>
@@ -163,13 +163,14 @@
         </template>
 
         <span slot="action" slot-scope="text, record">
-          <a @click="handleConfirm(record)" class="confirm mr-10">确认</a>
+          <a @click="handleConfirm(record)" :disabled="record.disabledConfirm" class="confirm mr-10">确认</a>
           <a @click="handleShow(record)" class="show">查看</a>
         </span>
       </a-table>
 
       <a-table
         bordered
+        class="right-fixed-table"
         style='display: inline-block; width: 100px'
         ref="table"
         size="middle"
@@ -186,7 +187,7 @@
         :dataSource="this.dataSource.length ? [{}]: []"
         :pagination="false">
         <div slot="actionBatch" class="action-batch">
-          <a href='javascript:' class='all-alarms'></a>
+          <a href='javascript:' @click="handleAllAlarms" class='all-alarms'></a>
         </div>
       </a-table>
     </div>
@@ -217,56 +218,56 @@ export default {
       singleWellList: [],
       columns: [
         {
-          dataIndex: 'a',
+          dataIndex: 'alarmTime',
           title: '报警时间',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'b',
+          dataIndex: 'recoveryTime',
           title: '恢复时间',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'c',
+          dataIndex: 'alarmDeviceA',
           title: '报警设备',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'd',
+          dataIndex: 'alarmDeviceB',
           title: '报警设备',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'e',
+          dataIndex: 'alarmDesc',
           title: '报警描述',
           align: 'center',
           width: '20%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'f',
+          dataIndex: 'alarmType',
           title: '报警类别',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'g',
+          dataIndex: 'confirmTime',
           title: '确认时间',
           align: 'center',
           width: '10%',
           scopedSlots: { customRender: 'text' }
         },
         {
-          dataIndex: 'h',
+          dataIndex: 'confirmUser',
           title: '确认人',
           align: 'center',
           width: '10%',
@@ -305,7 +306,107 @@ export default {
         //   width: 100
         // }
       ],
-      dataSource: new Array(10).fill(0).map((_, i) => ({ id: i + '' })),
+      dataSource: [
+        {
+          id: '1',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '报警恢复：西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '2',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '3',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '4',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '报警恢复：西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '5',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '6',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '7',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '报警恢复：西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '8',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        },
+        {
+          id: '9',
+          alarmTime: '2022-02-10 19:48:30',
+          recoveryTime: '2022-02-10 19:58:30',
+          alarmDeviceA: '西平236-76',
+          alarmDeviceB: '收球桶压力：0.53MPa',
+          alarmDesc: '西平236-76油压低报警，报警值（1.3MPa）',
+          alarmType: '油套压报警',
+          confirmTime: '2022-02-10 19:58:30',
+          confirmUser: '王某某'
+        }
+      ],
       defaultId: 'default', // 默认数据的id
       // 油井实时数据
       oilWellRealTimeData: {},
@@ -362,7 +463,7 @@ export default {
           { label: '日产水量', value: '4.34 m³' },
           { label: '日产液量', value: '19.09 m³' },
           { label: '日产油量', value: '14.75 t' },
-          { label: '备注', value: '----' }
+          { label: '备注', value: '备注备注备注备注备注' }
         ],
         oilWellProductionDataRight: [
           { label: '用电量', value: '0.00 kw.h' },
@@ -397,11 +498,29 @@ export default {
     searchReset () {
 
     },
-    handleConfirm () {
+    handleConfirm (record) {
-
+      this.$confirm({
+        title: '确认报警',
+        content: '确定报警该数据吗?',
+        onOk: function () {
+          record.disabledConfirm = true
+        }
+      })
     },
     handleShow () {
 
+    },
+    // 全部报警
+    handleAllAlarms () {
+      this.$confirm({
+        title: '确认报警',
+        content: '确定报警全部数据吗?',
+        onOk: () => {
+          this.dataSource.forEach(item => {
+            item.disabledConfirm = true
+          })
+        }
+      })
     },
     // 加载实时数据(油井实时参数、实时示功图、载荷分布图)(每10s请求一次)
     loadOilWellRealTimeData () {
@@ -897,6 +1016,10 @@ export default {
 .confirm:hover {
   color: #2BFF82;
 }
+.confirm[disabled],
+.show[disabled] {
+  color: @text-color-secondary;
+}
 // 查看
 .show,
 .show:hover {
@@ -915,4 +1038,7 @@ export default {
   height: 100px;
   background: url("~@/assets/images/systemOverview/wellheadDataMonitoring/all-alarms-btn.png");
 }
+.right-fixed-table /deep/ th {
+  height: 40px;
+}
 </style>