detail.vue 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <template>
  2. <div class='gdqd-dialog'>
  3. <div class='top'></div>
  4. <div class='gdqd-dialog-top'>
  5. <Select width='120' style='margin-right:12px' tipPlace='top' caption='楼层:' size='small' :selectdata='floorSelect'></Select>
  6. <Select width='224' style='margin-right:12px' tipPlace='top' caption='管理归属' size='small' :selectdata='dataSelect2'></Select>
  7. <Select width='224' style='margin-right:12px' tipPlace='top' caption='设备状态' size='small' :selectdata='dataSelect2'></Select>
  8. <el-input placeholder='请输入设备简称、设备编号、品牌、型号、安装位置、生产厂商、服务商搜索' style='width:490px;' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
  9. </div>
  10. <el-table
  11. v-loading='loading'
  12. :data='tableData'
  13. style='width:100%;margin-top:12px'
  14. :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
  15. >
  16. <el-table-column type='index' label='序号' width='50'></el-table-column>
  17. <el-table-column prop='sbjc' label='设备简称'>
  18. <template slot-scope='{row}'>{{row.sbjc||'--'}}</template>
  19. </el-table-column>
  20. <el-table-column prop='sbbh' label='设备编号'>
  21. <template slot-scope='{row}'>{{row.sbbh||'--'}}</template>
  22. </el-table-column>
  23. <el-table-column prop='sl' label='数量'>
  24. <template slot-scope='{row}'>{{row.sl||'--'}}</template>
  25. </el-table-column>
  26. <el-table-column prop='sbglgs' label='管理归属'>
  27. <template slot-scope='{row}'>{{row.sbglgs||'--'}}</template>
  28. </el-table-column>
  29. <el-table-column prop='sbstatus' label='设备状态'>
  30. <template slot-scope='{row}'>{{row.sbstatus||'--'}}</template>
  31. </el-table-column>
  32. <el-table-column prop='brand' label='品牌'>
  33. <template slot-scope='{row}'>{{row.brand||'--'}}</template>
  34. </el-table-column>
  35. <el-table-column prop='sbxh' label='型号'>
  36. <template slot-scope='{row}'>{{row.sbxh||'--'}}</template>
  37. </el-table-column>
  38. <el-table-column prop='floor' label='楼层'>
  39. <template slot-scope='{row}'>{{row.floor||'--'}}</template>
  40. </el-table-column>
  41. <el-table-column prop='wzqy' label='安装位置'>
  42. <template slot-scope='{row}'>{{row.wzqy||'--'}}</template>
  43. </el-table-column>
  44. <el-table-column prop='manufacturer' label='生产厂商'>
  45. <template slot-scope='{row}'>{{row.manufacturer||'--'}}</template>
  46. </el-table-column>
  47. <el-table-column prop='fws' label='服务商'>
  48. <template slot-scope='{row}'>{{row.fws||'--'}}</template>
  49. </el-table-column>
  50. </el-table>
  51. </div>
  52. </template>
  53. <script>
  54. import Select from '@/components/Select/Select.vue'
  55. import { mapGetters } from 'vuex'
  56. export default {
  57. data() {
  58. return {
  59. loading: false,
  60. tableData: [],
  61. dataSelect2: [
  62. { id: 'test1', name: '选择项' },
  63. { id: 'test2', name: '单平米' },
  64. { id: 'test3', name: '下级分项' },
  65. { id: 'test4', name: '滑动平均滑动平均' }
  66. ],
  67. input: ''
  68. }
  69. },
  70. components: {
  71. Select
  72. },
  73. computed: {
  74. ...mapGetters(['floorSelect'])
  75. },
  76. mounted() {},
  77. methods: {
  78. open() {
  79. this.visible = true
  80. }
  81. }
  82. }
  83. </script>
  84. <style lang="less" scoped>
  85. .gdqd-dialog {
  86. .top {
  87. }
  88. .gdqd-dialog-top {
  89. display: flex;
  90. }
  91. }
  92. </style>
  93. <style lang="less">
  94. .gdqd-dialog {
  95. padding: 16px 24px 24px;
  96. .el-table td,
  97. .el-table th {
  98. padding: 8px 0;
  99. }
  100. }
  101. </style>