ipc-app/pages/work/alarm/detailsAlarm.vue
2024-06-11 14:34:37 +08:00

109 lines
2.7 KiB
Vue

<template>
<view class="detail-container">
<view style="background: white;padding: 20px;">
<u--form labelPosition="left" :model="recordDetails" :rules="rules" ref="alarmForm" label-width="100px">
<u-form-item label="监测设备名称:" prop="" borderBottom>
{{recordDetails.equipInfo.equipName}}
</u-form-item>
<u-form-item label="参数名称:" prop="" borderBottom>
{{recordDetails.alarmRules.alarmName}}
</u-form-item>
<u-form-item label="报警值:" prop="" borderBottom>
{{recordDetails.alarmValue}}
</u-form-item>
<u-form-item label="参数单位:" prop="" borderBottom>
{{recordDetails.alarmRules.alarmInfoUnit}}
</u-form-item>
<u-form-item label="报警等级:" prop="" borderBottom>
{{recordDetails.alarmLevel}}
</u-form-item>
<u-form-item label="报警时间:" prop="" borderBottom>
{{ recordDetails.alarmTime }}
</u-form-item>
<u-form-item label="报警内容:" prop="" borderBottom>
{{recordDetails.content}}
</u-form-item>
<u-form-item label="处理结果:" prop="result" borderBottom>
<u--textarea v-if="recordDetails.status === 0" v-model="recordDetails.result"
placeholder="请输入处理结果"></u--textarea>
<view v-if="recordDetails.status === 1">{{recordDetails.result}}</view>
</u-form-item>
</u--form>
</view>
<view class="worker-button">
<button type="primary" v-if="recordDetails.status === 0" @click="submitAlarmResult" size="mini">处理</button>
</view>
</view>
</template>
<script>
import {
getRecord,
updateRecord
} from "@/api/alarm/alarm.js";
export default {
data() {
return {
id: null,
recordDetails: {
equipInfo: {
equipName: null
},
alarmRules: {
alarmName: null,
alarmInfoUnit: null
},
alarmValue: null,
alarmLevel: null,
alarmTime: null,
content: null
},
rules: {}
}
},
created() {
this.getRecordDetails();
},
onLoad(opts) {
this.id = opts.id;
},
methods: {
//查看详情
getRecordDetails() {
getRecord(this.id).then((res) => {
this.recordDetails = res.data;
})
},
//提交处理结果
submitAlarmResult() {
const data = {
id: this.recordDetails.id,
result: this.recordDetails.result,
status: 1
}
updateRecord(data).then(() => {
uni.$u.toast('处理成功');
uni.navigateBack({
//关闭当前页面,返回上一页面或多级页面。
delta: 1
});
})
},
}
}
</script>
<style>
.detail-container {
padding: 12px;
background: #f1f1f1;
//设置按钮的样式,靠右
.worker-button {
float: right;
/* margin-right: 24px; */
margin-top: 10px;
}
}
</style>