From 51ed148b49d2a113ac8a1684ad8e08270dc00d6d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9C=A8=E5=A4=B4=E8=8A=B1=E8=8A=B1?= <2372183198@qq.com> Date: Wed, 28 Sep 2022 12:09:20 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=B5=81=E6=B0=B4=E8=AE=B0?= =?UTF-8?q?=E5=BD=95=E7=95=8C=E9=9D=A2=EF=BC=8C=E5=AE=9E=E7=8E=B0=E6=B5=81?= =?UTF-8?q?=E6=B0=B4=E8=AE=B0=E5=BD=95=E5=9F=BA=E6=9C=AC=E7=95=8C=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/router/index.js | 16 +- src/utils/DeviceManagementApi.js | 37 +- ...agement.vue => ESDPersonnelManagement.vue} | 2 +- src/views/ESD/ESDPushSettings.vue | 4 +- ...nagement.vue => ESDRegionalManagement.vue} | 531 +++++++------ src/views/ESD/ESDServiceList.vue | 375 +++++----- src/views/ESD/ESDTrafficRules.vue | 193 +++-- src/views/ESD/FlowRecord.vue | 696 ++++++++++++++++++ .../FacilityManagement/FacilityLists.vue | 64 +- .../NewMainPageComponents/LeftCenter.vue | 1 + 10 files changed, 1304 insertions(+), 615 deletions(-) rename src/views/ESD/{ESDPersonelManagement.vue => ESDPersonnelManagement.vue} (99%) rename src/views/ESD/{ESDRefionalManagement.vue => ESDRegionalManagement.vue} (37%) create mode 100644 src/views/ESD/FlowRecord.vue diff --git a/src/router/index.js b/src/router/index.js index 2ba5b5b..70bda33 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -96,8 +96,8 @@ const routes = [ } }, { - path: '/ESDPersonelManagement', // ESD人员管理 - component: () => import('../views/ESD/ESDPersonelManagement'), + path: '/ESDPersonnelManagement', // ESD人员管理 + component: () => import('../views/ESD/ESDPersonnelManagement'), meta: { requireAuth: true // 该路由项需要权限校验 } @@ -110,12 +110,18 @@ const routes = [ } }, { - path: '/ESDRefionalManagement', // ESD区域管理 - component: () => import('../views/ESD/ESDRefionalManagement'), + path: '/ESDRegionalManagement', // ESD区域管理 + component: () => import('../views/ESD/ESDRegionalManagement'), meta: { requireAuth: true // 该路由项需要权限校验 } - } + },{ + path: '/FlowRecord', // 流水记录管理 + component: () => import('../views/ESD/FlowRecord'), + meta: { + requireAuth: true // 该路由项需要权限校验 + } + }, ] } ] diff --git a/src/utils/DeviceManagementApi.js b/src/utils/DeviceManagementApi.js index d943295..ea0c970 100644 --- a/src/utils/DeviceManagementApi.js +++ b/src/utils/DeviceManagementApi.js @@ -86,11 +86,9 @@ export function deleteESDDeviceByDeviceId(query) { export function operateESDDevice(query) { return postRequest('api/api/esd/operation', query) } - /* ESD配置模块(设备管理)管理 结束 */ -/* ESD通信规则模块 */ - +/* ESD通信规则模块 开始 */ // 分页获取通信规则信息 export function getESDTrafficRules(query) { return postRequest('api/api/esd/role/search', query) @@ -110,3 +108,36 @@ export function getESDTrafficRulesById(query) { export function deleteESDTrafficRulesById(query) { return deleteRequest(`api/api/esd/role/delete/${query}`) } +/* ESD通信规则模块 结束 */ + + +/* ESD区域管理模块 开始 */ +// 分页获取区域信息 +export function getESDRegionInfo(query) { + return postRequest('api/api/esd/region/search', query) +} + +// 获取下拉框通行规则信息 +export function getSelectTrafficInfo() { + return getRequest('api/api/esd/region/getRole') +} + +// 通过id获取区域信息 +export function getESDRegionInfoById(query) { + return getRequest(`api/api/esd/region/get/${query}`) +} + +// 添加区域信息 +export function addRegionInfo(query) { + return postRequest('api/api/esd/region/insert', query) +} + +// 修改区域信息 +export function updateRegionInfo(query) { + return postRequest('api/api/esd/region/update', query) +} + +// 通过id删除区域信息 +export function deleteESDRegionInfoById(query) { + return deleteRequest(`api/api/esd/region/delete/${query}`) +} diff --git a/src/views/ESD/ESDPersonelManagement.vue b/src/views/ESD/ESDPersonnelManagement.vue similarity index 99% rename from src/views/ESD/ESDPersonelManagement.vue rename to src/views/ESD/ESDPersonnelManagement.vue index 77bfb4a..6fe57ec 100644 --- a/src/views/ESD/ESDPersonelManagement.vue +++ b/src/views/ESD/ESDPersonnelManagement.vue @@ -547,7 +547,7 @@ import { } from '@/utils/DeviceManagementApi' export default { - name: 'ESDPersonelManagement', + name: 'ESDPersonnelManagement', components: { BreadCrumb, EmptyCard diff --git a/src/views/ESD/ESDPushSettings.vue b/src/views/ESD/ESDPushSettings.vue index 680e82f..01a6bbc 100644 --- a/src/views/ESD/ESDPushSettings.vue +++ b/src/views/ESD/ESDPushSettings.vue @@ -60,8 +60,8 @@ 已选择 {{ multipleSelection.length }}项 清空 - - + + diff --git a/src/views/ESD/ESDRefionalManagement.vue b/src/views/ESD/ESDRegionalManagement.vue similarity index 37% rename from src/views/ESD/ESDRefionalManagement.vue rename to src/views/ESD/ESDRegionalManagement.vue index e3b79f8..218b628 100644 --- a/src/views/ESD/ESDRefionalManagement.vue +++ b/src/views/ESD/ESDRegionalManagement.vue @@ -4,51 +4,53 @@
+
- - 新增 - - - 批量删除 - + 新增 + 批量删除
+
-
- 已选择{{ multipleSelection.length }} - - 清空 - +
+ 已选择 {{ multipleSelection.length }}项 + 清空
- + + + + + - - - - - + min-width="120px" + > - - + @@ -76,65 +78,66 @@ - -
- - - - + +
+
+ +
+ + + + + + + + + + + + + + + 参与考勤 + 不参与考勤 + + - - - - - - + + + 选择人员 + - - - - 参与考勤 - - - 不参与考勤 - - - + + + + + - - - 选择人员 - - - - - - - - + +
+ +
+ +
+ 取 消 + 确 定 +
- - 取 消 - 确 定 - - + @@ -149,17 +152,14 @@ import BreadCrumb from '@/components/BreadCrumb' import EmptyCard from '@/components/EmptyCard' import { - addDevice, - editDeviceData, - editDeviceOperateData, - getConfigData, - getConfigureByDeviceId, - deleteDevice, - getESDDeviceData -} from '@/utils/DeviceManagementApi' + addRegionInfo, + deleteESDRegionInfoById, + getESDRegionInfo, getESDRegionInfoById, + getSelectTrafficInfo, updateRegionInfo +} from "../../utils/DeviceManagementApi"; export default { - name: 'ESDRefionalManagement', + name: 'ESDRegionalManagement', components: { BreadCrumb, EmptyCard @@ -172,82 +172,58 @@ export default { searchFrom: { searchData: '' }, - tableData: [ - { - areaName: '创业园', // 区域名称 - areaAttr: '公共区域' // 区域属性 - } - ], // 表格数据 + tableData: [], // 表格数据 + trafficRulesData: [], // 存放通行规则数据 pager: { - currentPage: 1, - pageSize: 10, - totalPage: null // 总页数 - }, + currentPage: 1, // 当前页面 + pageSize: 10, // 每页条数 + totalPage: undefined // 总页数 + }, // 分页数据 loading: false, // 加载动画 multipleSelection: [], // 选中列表 - ModifyDialogVisible: false, // 修改信息弹框 - ModifyDialogTitle: '', // 修改信息弹框标题 - modifyInfoRules: { - /* - areaName: [{ required: true, message: '请输入区域名称', trigger: 'change' }], - areaAttr: [{ required: true, message: '请选择区域属性', triangle: 'blur' }], - areaAttendance: [{ required: true, message: '请输入客户主编号', triangle: 'blur' }], - accessPermission: [{ required: true, message: '请输入区域编号', triangle: 'blur' }], - accessRule: [{ required: true, message: '请输入IP地址', trigger: 'blur' }], - */ - areaName: [{ required: true, message: '请输入区域名称', trigger: 'change' }], - state: [{ required: true, message: '请选择区域属性' }], - areaAttendance: [{ required: true, message: '请输入客户主编号', triangle: 'blur' }], - accessPermission: [{ required: true, message: '请输入区域编号', triangle: 'blur' }], - accessRule: [{ required: true, message: '请输入IP地址', trigger: 'blur' }] - }, - modifyInfo: { - /* areaName: '', // 区域名称 - areaAttr: '', // 区域属性 - areaAttendance: 1, // 区域考勤 - accessPermission: '', // 通行权限 - accessRule: '' // 通行规则*/ - // 临时数据 - areaName: '', - deviceId: '', - deviceName: '', - deviceTypeName: '', - state: '' - }, - titleOfDialog: '', // 操作弹框标题 - operationDialogVisible: false, // 操作弹框 + regionInfoDrawer: false, // 区域信息弹窗 是否可见 + regionInfoDrawerTitle: '', // 修改区域信息弹框标题 + regionInfoForm: { + regionId: '', // 区域id + regionName: '', // 区域名称 + regionAttribute: undefined, // 区域属性:1、公共区域;2、限制区域 + regionAttendance: 1, // 区域考勤 1、考勤;2、不考勤 + trafficRule: undefined // 通行规则 + }, // 区域信息表单 + trafficSelectInfo: [], // 通行规则下拉框数据 + regionInfoRules: { + regionName: [{ required: true, message: '请输入区域名称', trigger: 'burl' }], + regionAttribute: [{ required: true, message: '请选择区域属性', type: 'number',}], + regionAttendance: [{required: false, message: '请选择区域考勤', type: 'number',}], + trafficRule: [{required: false, message: '请选择通行规则', type: 'number',}] + }, // 区域信息表单规则验证 isShow: false, // 是否为查看控制是否可选 - operationDialogLoading: false, + openDrawerLoading: false, editArray: [] } }, - computed: {}, - watch: {}, created() { }, mounted() { this.getData() - this.getConfigData() + this.getSelectInfo() }, methods: { - handleClick(tab, event) { - console.log(tab, event) - }, - // 单个设备删除 - deleteRow(index, row) { - this.$confirm('此操作将永久删除该设备, 是否继续?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }).then(async() => { - const res = await deleteDevice([row.deviceId]) - if (res.code === 200) { - await this.getData() - } - }).catch(() => { + // 抽屉打开后,其他的关闭样式 + handleClose() { + this.regionInfoDrawer = false + this.$nextTick(() => { + this.$refs.regionInfoRef.resetFields() }) + /*this.regionInfoForm = { + regionId: '', // 区域id + regionName: '', // 区域名称 + regionAttribute: undefined, // 区域属性:1、公共区域;2、限制区域 + regionAttendance: 1, // 区域考勤 1、考勤;2、不考勤 + trafficRule: undefined // 通行规则 + }*/ }, - + // 获取表格数据 async getData() { this.loading = true try { @@ -258,10 +234,9 @@ export default { }, searchObject: this.searchFrom.searchData } - const res = await getESDDeviceData(query) + const res = await getESDRegionInfo(query) // 获取区域信息数据 if (res) { - console.log(res) - this.pager.totalPage = res.totalPage + this.pager.totalPage = res.totalPage * this.pager.pageSize // 总条数(total总数) this.tableData = res.tableData } } catch (err) { @@ -270,21 +245,97 @@ export default { this.loading = false } }, - - // 获取下拉框 - async getConfigData() { - this.options = await getConfigData() + // 获取通行规则下拉框信息 + async getSelectInfo() { + this.trafficSelectInfo = await getSelectTrafficInfo() }, // 分页 change(val) { this.pager.currenPage = val this.getData() }, - // 输入框清空回调 - inputClear(val) { - if (val === '') { - this.getData() + // 点击添加区域信息按钮 回调函数 + newRegionInfo() { + if (this.$refs.regionInfoRef) { + this.$refs.regionInfoRef.resetFields() + } + this.regionInfoDrawerTitle = '添加区域信息' + this.regionInfoDrawer = true + this.openDrawerLoading = true + this.openDrawerLoading = false + }, + // 点击编辑区域管理信息按钮 回调函数 + async editRegionInfo(scope, row) { + if (this.$refs.regionInfoRef) { + this.$refs.regionInfoRef.resetFields() } + this.regionInfoDrawerTitle = '编辑区域信息' + this.regionInfoDrawer = true + this.openDrawerLoading = true + const data = await getESDRegionInfoById([row.regionId]) + this.regionInfoForm.regionId = data.regionId + this.regionInfoForm.regionName = data.regionName + this.regionInfoForm.regionAttribute = data.regionAttribute + this.regionInfoForm.regionAttendance = data.checkWork + this.regionInfoForm.trafficRule = data.authId + this.openDrawerLoading = false + }, + // 取消提交 + cancelSubmit() { + this.$confirm('确认关闭?') + .then(_ => { + this.handleClose() + }).catch(_ => {}) + }, + + // 点击弹窗中确认按钮 回调函数 + async submitRegionInfo() { + await this.$refs.regionInfoRef.validate(async (valid) => { + if(valid) { + try { + const query = { + authId: undefined, + checkWork: null, + regionAttribute: null, + regionId: null, + regionName: '', + remark: '', + userList: [{name: '', personId: ''}], + userNotList: [{name: '', personId: ''}] + } + query.regionAttribute = this.regionInfoForm.regionAttribute + query.regionName = this.regionInfoForm.regionName + query.authId = this.regionInfoForm.trafficRule + query.checkWork = this.regionInfoForm.regionAttendance + console.log('添加的请求头数据为:', query) + if(this.regionInfoDrawerTitle === '添加区域信息') { + await addRegionInfo(query) // 提交信息 + } else if (this.regionInfoDrawerTitle === '编辑区域信息') { + query.regionId = this.regionInfoForm.regionId + await updateRegionInfo(query) // 提交更新数据 + } + await this.getData() + } catch (err) { + this.$message.error(err.message) + } finally { + this.openDrawerLoading = false + } + } else { + return false + } + this.handleClose() + }) + }, + + // 点击删除区域信息按钮 回调函数 + deleteRow(index, row) { + this.$confirm('此操作将永久删除该区域信息, 是否继续?', {type: 'warning'} + ).then(async() => { + const res = await deleteESDRegionInfoById([row.regionId]) + if (res.code === 200) { + await this.getData() + } + }).catch(() => {}) }, // 清空多选项 clearCheck() { @@ -298,7 +349,7 @@ export default { } else { this.editArray = [] this.multipleSelection.forEach(i => { - this.editArray.push(i.deviceId) + this.editArray.push(i.regionId) }) this.titleOfDialog = '批量编辑设备操作' this.isShow = false @@ -312,22 +363,20 @@ export default { } else { let name = '' this.multipleSelection.forEach(i => { - name += i.deviceId + ',' + name += i.regionId + ',' }) const deleteArray = [] this.multipleSelection.forEach(i => { - deleteArray.push(i.deviceId) + deleteArray.push(i.regionId) }) this.$confirm(`此操作将删除设备${name},是否继续?`, '删除提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(async() => { - await deleteDevice(deleteArray) + await deleteESDRegionInfoById(deleteArray) await this.getData() - }) - .catch(() => { - }) + }).catch(() => {}) } }, // 选中函数 @@ -338,115 +387,10 @@ export default { filterHandler(value, row, column) { return row.state === value }, - // 设备新增 - newDevice() { - if (this.$refs.modifyInfo) { - // 重置表单 - this.$refs.modifyInfo.resetFields() - this.modifyInfo = { - deviceId: '', - deviceType: '', - customerId: '', - areaId: '', - deviceIp: '', - devicePort: '', - status: '', - remark: '' - } - } - this.ModifyDialogTitle = '新增设备' - this.ModifyDialogVisible = true - }, - // 编辑设备信息 - editInfo(scope, row) { - this.ModifyDialogTitle = '编辑设备信息' - this.modifyInfo = JSON.parse(JSON.stringify(row)) - this.ModifyDialogVisible = true - if (this.$refs.modifyInfo) { - this.$refs.modifyInfo.resetFields() - } - }, - // 确认 新增/编辑新增设备信息(弹框内) - handleModify() { - this.$refs.modifyInfo.validate(async(valid) => { - if (valid) { - try { - const query = { - ...this.modifyInfo - } - const res = this.ModifyDialogTitle === '编辑设备信息' ? await editDeviceData(query) : await addDevice(this.modifyInfo) - } catch (err) { - this.$message.error(err) - } finally { - await this.getData() - } - } else { - console.log('error submit!!') - return false - } - this.ModifyDialogVisible = false - }) - }, - // 查看设备操作信息 - async seeInfo(scope, row) { - if (this.$refs.EquipmentOperation) { - this.$refs.EquipmentOperation.resetFields() - } - this.titleOfDialog = '查看设备操作' - this.isShow = true - this.operationDialogLoading = true - this.operationDialogVisible = true - const res = await getConfigureByDeviceId(row.deviceId) - if (res.passageway1 === undefined && res.overallSensitivity === undefined && - res.passageway2 === undefined && res.passageway3 === undefined) { - this.$message.info('暂未设置参数') - this.operationDialogLoading = false - this.operationDialogVisible = false - } else { - this.operationDialogLoading = false - this.EquipmentOperation = res - } - }, - // 编辑设备操作 - async editOperation(scope, row) { - if (this.$refs.EquipmentOperation) { - this.$refs.EquipmentOperation.resetFields() - } - this.titleOfDialog = '编辑设备操作' - this.isShow = false - this.operationDialogLoading = true - this.operationDialogVisible = true - this.editArray = [row.deviceId] - this.EquipmentOperation = await getConfigureByDeviceId(row.deviceId) - this.operationDialogLoading = false - }, - // 确认编辑设备操作 - async modifyEquipmentOperation() { - await this.$refs.EquipmentOperation.validate(async(valid) => { - if (valid) { - try { - const query = { - deviceId: this.editArray, - staffNumber: JSON.parse(window.localStorage.getItem('staffNumber')), - ...this.EquipmentOperation - } - this.operationDialogLoading = true - await editDeviceOperateData(query) - } catch (err) { - this.$message.error(err) - console.log(err, '111') - } - } else { - console.log('error submit!!') - return false - } - this.operationDialogVisible = false - this.operationDialogLoading = false - }) - } } } + diff --git a/src/views/ESD/ESDServiceList.vue b/src/views/ESD/ESDServiceList.vue index 4baba0e..5b6ccff 100644 --- a/src/views/ESD/ESDServiceList.vue +++ b/src/views/ESD/ESDServiceList.vue @@ -52,7 +52,7 @@ - + @@ -134,7 +134,7 @@ :visible.sync="editEquipmentVisible" @before-close="handleClose" direction="rtl" - size="50%" + size="800px" >
@@ -158,173 +158,169 @@ - - - - - - - - - - 活体 - 非活体 - - - - - - - - - - - - - - - - - - - - - - - - - - - —— - - - - —— - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
+ + + + + + + + + + 活体 + 非活体 + + + + + + + + + + + + + + + + + + + + + + + —— + + + + —— + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + +
-
-
- - - - - -
@@ -345,7 +341,7 @@ title="检索添加设备" :visible.sync="addDeviceDrawer" direction="rtl" - size="50%" + size="800px" >
@@ -495,7 +491,7 @@
- 取 消 + 取 消 确 定
@@ -509,7 +505,6 @@ import BreadCrumb from '@/components/BreadCrumb' import EmptyCard from '@/components/EmptyCard' -import {deleteDevice} from '@/utils/DeviceManagementApi' import { deleteESDDeviceByDeviceId, editESDParameter, @@ -546,40 +541,40 @@ export default { editEquipmentForm: { deviceId: '', // 设备号 deviceType: '', // 产品类型 - tempRange1: '', // 高烧阀值 - tempRange2: '', // 低烧阀值 + tempRange1: 0, // 高烧阀值 + tempRange2: 0, // 低烧阀值 appFailMsg: '', //失败文本 appWelcomeMsg: '', // 成功文本 - beginRecoDistance: '', //识别最小人脸阈值 + beginRecoDistance: 0, //识别最小人脸阈值 cameraDetectType: '', //活体开关,0 代表活体检测,1 代表非活体检测 channelNumber: '', //闸机通道编号 deviceDefendTime: '', //设备重启时间 deviceIntoOrOut: '', // 进/出类型,0: 进,1 - deviceMusicSize: '', //音量调节 + deviceMusicSize: 0, //音量调节 deviceName: '', // 设备名称 - doorType: '', // 开门方式 - faceFeaturePairNumber: '', // 面部识别阈值 - faceFeaturePairNumberMask: '', //口罩识别阀值 - faceFeaturePairSuccessOrFailWaitTime: '', //比对等待时间 + doorType: 0, // 开门方式 + faceFeaturePairNumber: 0, // 面部识别阈值 + faceFeaturePairNumberMask: 0, //口罩识别阀值 + faceFeaturePairSuccessOrFailWaitTime: 0, //比对等待时间 fillLightStart: '', //补光开始时间 fillLightEnd: '', //补光结束时间 - handStart: undefined, //手阻值开始值 - hangEnd: undefined, //手阻值结束值 - footStart: undefined, //脚阻值开始值 - footEnd: undefined, //脚阻值结束值 - idCardFaceFeaturePairNumber: '', //身份证比对时的阈值 + handStart: 0, //手阻值开始值 + hangEnd: 0, //手阻值结束值 + footStart: 0, //脚阻值开始值 + footEnd: 0, //脚阻值结束值 + idCardFaceFeaturePairNumber: 0, //身份证比对时的阈值 lowPowerStart: '', // 息屏时间开始 lowPowerEnd: '', // 息屏时间结束 maskFlag: '', //口罩提醒 misPort:'', //MIS端口 misUrl: '', //MIS网址 - openDoorContinueTime: '', //开门持续时间 - openDoorType: '', //开门条件 + openDoorContinueTime: 0, //开门持续时间 + openDoorType: 0, //开门条件 pairSuccessOpenDoor: '', //识别成功后是否开闸,0:开闸,1:不开闸,默认 0 replaceLiveToTemp: '', //测温不开活体 resistance: '', //阻值权限,0:免测,1:测手,2:测脚,3:全测 - resistanceWaitingTime: '', //阻值等待时间 - tempMapOffset: '', //温度补偿值 + resistanceWaitingTime: 0, //阻值等待时间 + tempMapOffset: 0, //温度补偿值 visitorCardNo: '', // 访客使用的特殊卡号 visitorOpenDoorType: '', //访客模式,0:未启用,1:人脸+身份证 workshopNumber: '', //车间出入口编码 @@ -788,7 +783,7 @@ export default { this.editEquipmentForm.lowPowerEnd = this.rangeValue.lowPowerTimes[1] const query = this.editEquipmentForm await editESDParameter(query) - this.getData() + await this.getData() } catch (err) { this.$message.error(err) console.log("error is:", err) @@ -813,7 +808,7 @@ export default { }, // 设置设备时区 取消按钮的回调 - cancleTimeZone() { + cancelTimeZone() { this.$confirm('确认取消?',{ }).then(() => { this.setTimeZoneDrawer = false diff --git a/src/views/ESD/ESDTrafficRules.vue b/src/views/ESD/ESDTrafficRules.vue index 49a0bd9..b225e88 100644 --- a/src/views/ESD/ESDTrafficRules.vue +++ b/src/views/ESD/ESDTrafficRules.vue @@ -31,9 +31,10 @@ ref="multipleTable" :data="tableData" style="width: 100%;height: 100%;" :header-cell-style="{background:'rgba(238,241,246,0.54)',color:'rgb(96,98,102)'}" - @selection-change="handleSelectionChange"> - - + @selection-change="handleSelectionChange" + > + + @@ -133,8 +134,7 @@