alarm-detail.vue 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <template>
  2. <div>
  3. <div class="my-title">查看</div>
  4. <div style="margin-left: 20px;margin-right: 20px">
  5. <e-desc title="基本信息" column="2" labelWidth="160px">
  6. <e-desc-item label="设备名称">{{dataForm.equipmentName}}</e-desc-item>
  7. <e-desc-item label="设备编号">{{dataForm.codeNumber}}</e-desc-item>
  8. <e-desc-item label="报警接收人">{{dataForm.alarmName}}</e-desc-item>
  9. <e-desc-item label="报警时间">{{dataForm.createTime}}</e-desc-item>
  10. <e-desc-item label="设备报警内容" :span="2">{{dataForm.alarmMsg}}</e-desc-item>
  11. </e-desc>
  12. </div>
  13. <span slot="footer" class="dialog-footer">
  14. <el-button @click="onChose">返回</el-button>
  15. </span>
  16. <!-- 文件预览 -->
  17. <preview-component v-if="previewVisible" ref="preview"/>
  18. </div>
  19. </template>
  20. <script>
  21. import EDesc from '../common/e-desc'
  22. import EDescItem from '../common/e-desc-item'
  23. import {getAlarmDetail} from '@/api/device'
  24. import {getDate} from '@/utils/date-util'
  25. import PreviewComponent from '@/views/modules/common/preview-component.vue'
  26. import {optionsEquipmentRepairState} from '@/utils/enums'
  27. export default {
  28. name: 'alarm-detail',
  29. components: {
  30. PreviewComponent,
  31. EDesc,
  32. EDescItem
  33. },
  34. data () {
  35. return {
  36. visible: false,
  37. id: 0,
  38. dataForm: {},
  39. previewVisible: false,
  40. optionsState: optionsEquipmentRepairState
  41. }
  42. },
  43. methods: {
  44. getDate,
  45. onChose () {
  46. this.$emit('onChose')
  47. },
  48. async init (id) {
  49. this.visible = true
  50. this.id = id || 0
  51. this.dataForm = {}
  52. this.getDetails()
  53. },
  54. getDetails () {
  55. getAlarmDetail(this.id).then(({data}) => {
  56. if (data && data.code === '200') {
  57. this.dataForm = data.data
  58. }
  59. })
  60. },
  61. previewFile (fileName, url) {
  62. this.previewVisible = true
  63. this.$nextTick(() => {
  64. this.$refs.preview.init(fileName, url)
  65. })
  66. }
  67. }
  68. }
  69. </script>
  70. <style scoped>
  71. .my-line{
  72. border-bottom: 1px solid #c0c4cc;
  73. margin-bottom: 10px;
  74. }
  75. .title{
  76. padding: 10px 0 ;
  77. }
  78. </style>