otherTable.vue 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
  1. <!-- 设备设施其他事项 -->
  2. <template>
  3. <div class='qt-list'>
  4. <div class='eq-list-top'>
  5. <el-input
  6. placeholder='搜索记录事项位置内容'
  7. style='width:192px;margin-right:12px'
  8. size='small'
  9. prefix-icon='el-icon-search'
  10. v-model='keyword'
  11. clearable
  12. @blur='getList'
  13. ></el-input>
  14. <div class='picker-box'>
  15. <span class='picker-span'>选择处理日期:</span>
  16. <el-date-picker
  17. style='width:190px'
  18. v-model='handledate'
  19. value-format='yyyyMMdd'
  20. type='daterange'
  21. @change='getList'
  22. size='mini'
  23. range-separator='-'
  24. start-placeholder
  25. end-placeholder
  26. ></el-date-picker>
  27. </div>
  28. <Select
  29. width='180'
  30. tipPlace='top'
  31. caption='处置结果:'
  32. v-model='handleresults'
  33. :selectdata='handleOption'
  34. :placeholder='"请选择"'
  35. @change='getList'
  36. ></Select>
  37. </div>
  38. <el-table :data='tableData' :border='true' style='width: 100%'>
  39. <el-table-column type='index' label='序号' width='80'></el-table-column>
  40. <el-table-column prop='lb' label='其他事项详情' show-overflow-tooltip resizable>
  41. <el-table-column prop='zlwfwe' label='记录事项' show-overflow-tooltip resizable>
  42. <template slot-scope='{row}'>{{row.jlsx || '--'}}</template>
  43. </el-table-column>
  44. <el-table-column prop label='位置' show-overflow-tooltip resizable>
  45. <template slot-scope='{row}'>{{row.description || '--'}}</template>
  46. </el-table-column>
  47. <el-table-column prop='content' label='内容' show-overflow-tooltip resizable>
  48. <template slot-scope='{row}'>{{row.content || '--'}}</template>
  49. </el-table-column>
  50. <el-table-column prop='sl' label='数量'>
  51. <template slot-scope='{row}'>{{row.sl>=0?row.sl:'--'}}</template>
  52. </el-table-column>
  53. </el-table-column>
  54. <el-table-column prop='zfje' label='金额(万元)'>
  55. <template slot-scope='{row}'>{{number_format(row.zfje,2) || '--'}}</template>
  56. </el-table-column>
  57. <el-table-column prop='handledate' label='处理日期'>
  58. <template slot-scope='{row}'>{{row.handledate?formatter(row.handledate): '--'}}</template>
  59. </el-table-column>
  60. <el-table-column prop='handleresults' label='处置结果' show-overflow-tooltip resizable>
  61. <template slot-scope='{row}'>{{row.handleresults || '--'}}</template>
  62. </el-table-column>
  63. <el-table-column prop='zlwfwz ' label='资料存放位置' show-overflow-tooltip resizable>
  64. <template slot-scope='{row}'>{{row.zlwfwz || '--'}}</template>
  65. </el-table-column>
  66. <el-table-column prop='recordtime' label='记录日期'>
  67. <template slot-scope='{row}'>{{row.createdate?formatter(row.createdate): '--'}}</template>
  68. </el-table-column>
  69. </el-table>
  70. <div class='foot'>
  71. <el-pagination
  72. background
  73. layout='prev, pager, next'
  74. :total='total'
  75. :page-size='size'
  76. @prev-click='pageChanged'
  77. @next-click='pageChanged'
  78. @current-change='pageChanged'
  79. ></el-pagination>
  80. </div>
  81. </div>
  82. </template>
  83. <script>
  84. import { queryQtsx } from '@/api/equipmentList.js'
  85. import { mapGetters } from 'vuex'
  86. import { formatter, number_format } from '@/utils/format.js'
  87. import { querySelect } from '@/api/public.js'
  88. export default {
  89. data() {
  90. return {
  91. tableData: [],
  92. total: 0,
  93. formatter,
  94. number_format,
  95. currentPage: 1,
  96. size: 12,
  97. keyword: '',
  98. handleresults: '',
  99. handledate: '',
  100. handleOption: []
  101. }
  102. },
  103. props: ['major', 'smsxt', 'tabLabel'],
  104. computed: {
  105. ...mapGetters(['floorSelect'])
  106. },
  107. methods: {
  108. pageChanged(page) {
  109. this.currentPage = page
  110. this.getList()
  111. },
  112. getList() {
  113. let getParams = {
  114. data: {
  115. smsxt: this.smsxt,
  116. // tab: this.major,
  117. plazaId: this.$store.state.plazaId,
  118. page: this.currentPage,
  119. size: this.size
  120. }
  121. }
  122. //输入框
  123. getParams.data.keyword = ''
  124. if (this.keyword) {
  125. getParams.data.keyword += `${this.keyword}:jlsx,location,content;`
  126. }
  127. if (getParams.data.keyword == '') {
  128. delete getParams.data.keyword
  129. }
  130. //时间
  131. if (this.handledate) {
  132. getParams.data.handledateStartDate = this.handledate[0] + '000000'
  133. getParams.data.handledateEndDate = this.handledate[1] + '000000'
  134. }
  135. //下拉
  136. if (this.handleresults) {
  137. getParams.data.handleresults = this.handleresults
  138. }
  139. queryQtsx(getParams).then(res => {
  140. //console.log(res)
  141. this.tableData = res.data ? res.data : []
  142. this.total = res.count
  143. })
  144. },
  145. //下拉框查询
  146. tabFind() {
  147. let postParams = [
  148. {
  149. columnName: { handleresults: 'handleresults' },
  150. tableName: 'glsms_qtsx' //视图名称
  151. }
  152. ]
  153. let major
  154. if (this.major.slice(0, 2) == 'GD') {
  155. major = '供电'
  156. } else if (this.major.slice(0, 2) == 'XF') {
  157. major = '消防'
  158. } else if (this.major.slice(0, 2) == 'GPS') {
  159. major = '给排水'
  160. } else if (this.major.slice(0, 2) == 'DT') {
  161. major = '电梯'
  162. } else if (this.major.slice(0, 2) == 'RQ') {
  163. major = '燃气'
  164. } else if (this.major.slice(0, 2) == 'RD') {
  165. major = '弱电'
  166. } else if (this.major.slice(0, 2) == 'NT') {
  167. major = '暖通'
  168. } else if (this.major.slice(0, 2) == 'TJ') {
  169. major = '土建'
  170. } else {
  171. major = this.major
  172. }
  173. let data = {
  174. major: major,
  175. plazaId: this.$store.state.plazaId
  176. }
  177. querySelect({ data, postParams }).then(res => {
  178. //console.log(res)
  179. let handleresults = res.data.data.glsms_qtsx.handleresults
  180. this.handleOption = []
  181. handleresults.forEach(el => {
  182. this.handleOption.push({
  183. name: el.value,
  184. id: el.key
  185. })
  186. })
  187. })
  188. }
  189. },
  190. watch: {
  191. smsxt(newV, oldV) {
  192. if (newV !== oldV) {
  193. this.tabFind()
  194. this.getList()
  195. }
  196. },
  197. tabLabel(newV, oldV) {
  198. if (newV !== oldV) {
  199. this.tabFind()
  200. this.getList()
  201. }
  202. }
  203. },
  204. mounted() {
  205. this.tabFind()
  206. //console.log(this.smsxt)
  207. this.getList()
  208. }
  209. }
  210. </script>
  211. <style lang="less" scoped>
  212. .qt-list {
  213. .eq-list-top {
  214. display: flex;
  215. margin-bottom: 12px;
  216. .picker-box {
  217. display: flex;
  218. align-items: center;
  219. background: #fff;
  220. padding: 0 6px;
  221. border: 1px solid #dcdfe6;
  222. border-radius: 4px;
  223. height: 32px;
  224. box-sizing: border-box;
  225. margin-right: 12px;
  226. .picker-span {
  227. margin-right: 6px;
  228. color: rgba(0, 0, 0, 0.65);
  229. }
  230. }
  231. }
  232. td {
  233. overflow: hidden;
  234. text-overflow: ellipsis;
  235. white-space: nowrap;
  236. }
  237. .foot {
  238. height: 32px;
  239. display: flex;
  240. justify-content: flex-end;
  241. margin-top: 28px;
  242. }
  243. }
  244. </style>
  245. <style lang="less" >
  246. .qt-list {
  247. .picker-box {
  248. .el-input__inner {
  249. border: none;
  250. }
  251. .el-range-editor.el-input__inner {
  252. padding: 3px 0px;
  253. }
  254. .el-icon-date {
  255. display: none;
  256. }
  257. .el-range__close-icon {
  258. position: absolute;
  259. right: 0px;
  260. top: 2px;
  261. }
  262. .el-range-editor--mini .el-range-input {
  263. font-size: 14px;
  264. color: rgb(31, 36, 41);
  265. }
  266. }
  267. }
  268. </style>