<template>
|
<div>
|
<a-modal width="70%" title="单位警报配置" destroyOnClose :visible="aFlag" :footer='dataType === undefined? "" : undefined' @cancel="handleCancel" @ok="handleOk">
|
<a-form-model style="margin-top: 8px;" :model="editData">
|
<a-form-model-item v-if="dataType">
|
<a-collapse accordion @change="turnState($event)">
|
<a-collapse-panel v-for="(item, key) in dataType" :key="item.id" :header="'名称：'+item.name">
|
<a-table
|
:columns="columns"
|
:dataSource="dataSources"
|
@change="handleTableChange"
|
:pagination="pagination"
|
>
|
<template
|
v-for="col in ['alarmLevel[0]', 'alarmLevel[1]','alarmLevel[2]','alarmLevel[3]','alarmLevel[4]','alarmLevel[5]']"
|
:slot="col"
|
slot-scope="text, record, index"
|
>
|
<div :key="col">
|
<a-input
|
style="margin: -5px 0"
|
:value="text"
|
@change="e => handleChange(e.target.value, record.id, col)"
|
/>
|
</div>
|
</template>
|
<template slot="unitVal1" slot-scope="text, record">
|
<editable-cell :text="text" :dictData="dictUnitData"
|
@flag="sureFlag"
|
@change="onCellChange(record, 'unitVal1', $event)"/>
|
</template>
|
</a-table>
|
</a-collapse-panel>
|
</a-collapse>
|
</a-form-model-item>
|
<a-result v-else title="该组织下没有可选型号!">
|
<template #icon>
|
<a-icon type="smile" theme="twoTone" />
|
</template>
|
</a-result>
|
</a-form-model>
|
</a-modal>
|
</div>
|
</template>
|
|
<script lang="tsx">
|
import {Component, Emit, Prop, Vue, Watch} from 'vue-property-decorator';
|
import {State, Mutation, namespace} from 'vuex-class';
|
import EditableCell from "@/views/system/editableCell.vue";
|
import UpdateTaskForm from "@/views/list/components/UpdateTaskFormVersion.vue";
|
import DistributionVersion from "@/views/list/components/DistributionVersion.vue";
|
import { get, post } from "@/util/request";
|
|
@Component({
|
components: {
|
EditableCell
|
}
|
})
|
export default class AlarmUnitConfigure extends Vue {
|
|
private editable = true
|
|
private edit() {
|
this.editable = false
|
}
|
|
// 编辑数据
|
private editData: any = {
|
showUnitKey: '1'
|
}
|
|
|
// 内部分页
|
private pagination: any = {
|
total: 0,
|
current: 1,
|
pageSize: 5,
|
showSizeChanger: false,
|
showQuickJumper: false
|
}
|
private handleTableChange(pagination: any, filters: any, sorter: any): void {
|
this.pagination.current = pagination.current
|
this.query()
|
}
|
|
@Prop({
|
type: Boolean,
|
default: false
|
})
|
private alarmUFlag: boolean
|
|
get aFlag() {
|
return this.alarmUFlag
|
}
|
|
@Prop({
|
type: Object,
|
default: () => {
|
return {}
|
}
|
})
|
private alarmRecord!: any
|
|
private dataType: any[] = null
|
|
@Watch('alarmUFlag', {
|
deep: true
|
})
|
private watchAlarmUFlag(newVal: boolean, oldVal: boolean) {
|
if (newVal === true) {
|
this.getAllSensor()
|
this.queryByOrgId(this.alarmRecord.id)
|
}
|
}
|
|
|
// 存放所有因子信息
|
private sensorsList: any[] = null
|
|
// 查询所有因子
|
private getAllSensor() {
|
get('sensor/getAllSensorWithoutPage', {}).then((res: any) => {
|
this.sensorsList = res.data.data.sensors
|
})
|
}
|
|
// 列数据
|
private columns: any = [
|
{
|
title: "传感器名称",
|
dataIndex: "sensorName"
|
},
|
{
|
title: "初始单位",
|
width: '10%',
|
dataIndex: "unitVal"
|
},
|
{
|
title: "显示单位",
|
dataIndex: "unitVal1",
|
width: '10%',
|
scopedSlots: {customRender: 'unitVal1'},
|
},
|
{
|
title: "一级",
|
dataIndex: "alarmLevel[0]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[0]'}
|
},
|
{
|
title: "二级",
|
dataIndex: "alarmLevel[1]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[1]'}
|
},
|
{
|
title: "三级",
|
dataIndex: "alarmLevel[2]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[2]'}
|
},
|
{
|
title: "四级",
|
dataIndex: "alarmLevel[3]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[3]'}
|
},
|
{
|
title: "五级",
|
dataIndex: "alarmLevel[4]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[4]'}
|
},
|
{
|
title: "六级",
|
dataIndex: "alarmLevel[5]",
|
width: '10%',
|
scopedSlots: {customRender: 'alarmLevel[5]'}
|
},
|
{
|
title: "操作",
|
customRender: this.opRender
|
}
|
];
|
|
private dataSources: any[] = null
|
|
// 通过组织id查询型号
|
private queryByOrgId(id: any) {
|
get('version/queryByOrgId', {
|
organizationId: id
|
}).then((res: any) => {
|
if (res.data.code === 0) {
|
this.dataType = res.data.data.versions
|
}
|
})
|
}
|
|
private handleCancel() {
|
this.alarmFlag = false
|
this.turnAlarmFlag()
|
}
|
|
private handleOk() {
|
this.alarmFlag = false
|
this.turnAlarmFlag()
|
}
|
|
// 通过字典表获取单位信息
|
private dictUnitData: any = null
|
private dictAlarmData: any = null
|
|
private queryDictionary(val: string) {
|
get('dict/data/query', {
|
type: val
|
}).then((res: any) => {
|
const objArray = []
|
Object.keys(res.data.data).forEach((key: any) => {
|
let obj = {'key': key, 'value': res.data.data[key]}
|
objArray.push(obj)
|
});
|
if (val === 'unit') {
|
this.dictUnitData = res.data.data
|
}
|
if (val === 'defaultAlarm') {
|
this.dictAlarmData = res.data.data
|
}
|
|
})
|
}
|
|
|
// 获取数据
|
private query() {
|
get('organizationUnitAlarm/query', {
|
organizationId: this.alarmRecord.id,
|
versionId: this.sId,
|
page: this.pagination.current,
|
size: this.pagination.pageSize,
|
}).then((res: any) => {
|
if (res.data.code === 0) {
|
this.pagination.total = res.data.data.total
|
this.dataSources = res.data.data.organizations
|
for (let i = 0; i < this.dataSources.length; i++) {
|
this.dataSources[i].alarmLevel = eval('(' + this.dataSources[i].alarmLevel + ')');
|
// 判断字典表默认报警值是否配置
|
// if (this.dataSources[i].alarmLevel === undefined) {
|
// if (this.dictAlarmData[this.dataSources[i].sensorCode] !== undefined){
|
// this.dataSources[i].alarmLevel = this.dictAlarmData[this.dataSources[i].sensorCode]
|
// this.dataSources[i].alarmLevel = eval('(' + this.dataSources[i].alarmLevel + ')');
|
// }
|
// }
|
for (let j = 0; j < this.sensorsList.length; j++) {
|
if (this.dataSources[i].sensorCode === this.sensorsList[j].code) {
|
this.dataSources[i].sensorName = this.sensorsList[j].name
|
}
|
}
|
this.dataSources[i].unitVal = this.dictUnitData[this.dataSources[i].unitKey]
|
this.dataSources[i].unitVal1 = this.dictUnitData[this.dataSources[i].showUnitKey]
|
}
|
}
|
})
|
}
|
private sId: any = ''
|
// 点击折叠面板事件
|
private turnState(event: any) {
|
this.queryDictionary('unit')
|
this.queryDictionary('defaultAlarm')
|
if (event) {
|
this.sId = event
|
this.query()
|
}
|
}
|
|
|
// 可编辑
|
private handleChange(value: any, key: any, column: any) {
|
for (let i = 0; i < this.dictUnitData.length; i++) {
|
if (column === this.dictUnitData[i].key) {
|
column = this.dictUnitData[i].value
|
}
|
}
|
const newData = [...this.dataSources];
|
const target = newData.filter(item => key === item.id)[0];
|
if (target) {
|
target[column] = value;
|
this.dataSources = newData;
|
}
|
|
}
|
|
private onCellChange(key: any, dataIndex: any, value: any) {
|
const dataSource = [...this.dataSources];
|
const target = dataSource.find(item => item.id === key.id);
|
if (target) {
|
target[dataIndex] = value;
|
this.dataSources = dataSource;
|
}
|
}
|
|
// 分页
|
private turnPage() {
|
|
}
|
|
@Emit('turnAlarmFlag')
|
private turnAlarmFlag() {
|
return false
|
}
|
|
|
private eFlag: boolean = false
|
private sureFlag(flag: any){
|
this.eFlag = flag
|
}
|
|
private save(record: any) {
|
|
// 处理下拉单位
|
if (this.eFlag) {
|
this.$message.warning('请勾选显示单位',2)
|
this.eFlag = false
|
return;
|
}
|
let k;
|
for (let key in this.dictUnitData) {
|
if (record.unitVal1 === this.dictUnitData[key]) {
|
k = key
|
}
|
}
|
if (k === record.showUnitKey) {
|
k = null
|
}
|
|
let arr = Object.keys(record)
|
let alarmLevel = null
|
let arrObj = {}
|
if (arr.length - 8 > 0) {
|
let newArr = []
|
for (let i = 0; i < arr.length; i++) {
|
if (i>=8){
|
newArr.push(arr[i])
|
}
|
}
|
newArr.forEach((item: any) => {
|
let i = item.substr(11,item.length-11-1)
|
arrObj[i] = record[item] === '' ? '' : record[item] === '0' ? '0' : Number(record[item]) === 0 ? '' : record[item]
|
})
|
}else {
|
alarmLevel = null
|
}
|
for(let i in arrObj) {
|
if (record.alarmLevel === undefined) {
|
continue
|
}else {
|
record.alarmLevel[i] = arrObj[i]
|
}
|
}
|
let alarmLevel1 = []
|
if (record.alarmLevel === undefined) {
|
alarmLevel1 = Object.values(arrObj)
|
}else {
|
alarmLevel1 = record.alarmLevel
|
}
|
|
// 递归删除数组最后为空格的元素
|
function digui(array: any) {
|
for (let i = 0; i < array.length; i++) {
|
if (i === array.length -1) {
|
if (array[i] === '' || array[i] === null || array[i] === undefined) {
|
array.splice(i,1)
|
digui(array)
|
}
|
}
|
}
|
}
|
digui(alarmLevel1)
|
|
for (let i = 0; i < alarmLevel1.length; i++) {
|
if (alarmLevel1[i] === '' || alarmLevel1[i] === null || alarmLevel1[i] === undefined) {
|
this.$message.warning('警报不能间隔填写')
|
return;
|
}
|
}
|
// 数字验证
|
for (let i = 0; i < alarmLevel1.length; i++) {
|
let z_reg = /^\d+(\.\d+)?$/
|
if (!z_reg.test(alarmLevel1[i])) {
|
this.$message.warning('报警值必须为数字')
|
return;
|
}
|
}
|
// 顺序验证
|
if (alarmLevel1.length>1){
|
for (let i = 1; i <= alarmLevel1.length; i++) {
|
if (i === alarmLevel1.length) {
|
continue
|
}else {
|
if (alarmLevel1[i] - alarmLevel1[i-1] > 0) {
|
continue
|
}else {
|
this.$message.warning('报警值需根据级别递增')
|
return;
|
}
|
}
|
}
|
}
|
|
if (arr.length - 8 === 0 && k===null ) {
|
this.$message.warning('未改变')
|
return;
|
}
|
|
|
if (alarmLevel1.length > 0) {
|
let array = []
|
for (let i = 0; i < alarmLevel1.length; i++) {
|
array.push(Number(alarmLevel1[i]))
|
}
|
|
alarmLevel1 = array
|
}
|
post('organizationUnitAlarm/update',{
|
id: record.id,
|
showUnitKey: k ,
|
alarmLevel: JSON.stringify(alarmLevel1)
|
}).then(( res: any) => {
|
if (res.data.code === 0) {
|
this.$message.success('修改成功')
|
this.query()
|
}
|
})
|
|
}
|
|
private opRender(text: string, record: any, index: number) {
|
return (
|
<div>
|
<a onClick={() => this.save(record)}>
|
{" "}
|
保存{" "}
|
</a>
|
</div>
|
)
|
;
|
}
|
}
|
</script>
|
|
<style scoped>
|
.editable-cell {
|
position: relative;
|
}
|
|
.editable-cell-input-wrapper,
|
.editable-cell-text-wrapper {
|
padding-right: 24px;
|
}
|
|
.editable-cell-text-wrapper {
|
padding: 5px 24px 5px 5px;
|
}
|
|
.editable-cell-icon,
|
.editable-cell-icon-check {
|
position: absolute;
|
right: 0;
|
width: 20px;
|
cursor: pointer;
|
}
|
|
.editable-cell-icon {
|
line-height: 18px;
|
display: none;
|
}
|
|
.editable-cell-icon-check {
|
line-height: 28px;
|
}
|
|
.editable-cell:hover .editable-cell-icon {
|
display: inline-block;
|
}
|
|
.editable-cell-icon:hover,
|
.editable-cell-icon-check:hover {
|
color: #108ee9;
|
}
|
|
.editable-add-btn {
|
margin-bottom: 8px;
|
}
|
</style>
|
