inspection-list.vue 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492
  1. <template>
  2. <div class="device">
  3. <template v-if="!addOrUpdateVisible && !detailVisible && !historyVisible && !damageVisible && !checkVisible && !inspectionVisible">
  4. <!-- 查询、新增操作 -->
  5. <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
  6. <el-form-item label="名称/编号">
  7. <el-input v-model="dataForm.name" placeholder="名称/编号" clearable/>
  8. </el-form-item>
  9. <el-form-item label="点检责任人">
  10. <user-component v-model="dataForm.creatorId"/>
  11. </el-form-item>
  12. <el-form-item label="点检日期起">
  13. <el-date-picker
  14. v-model="dataForm.date"
  15. value-format="yyyy-MM-dd HH:mm:ss"
  16. type="daterange"
  17. range-separator="至"
  18. start-placeholder="开始日期"
  19. end-placeholder="结束日期">
  20. </el-date-picker>
  21. </el-form-item>
  22. <el-form-item label="设备状态">
  23. <el-select
  24. v-model="dataForm.state"
  25. remote
  26. placeholder="请选择">
  27. <el-option
  28. v-for="item in optionsState"
  29. :key="item.value"
  30. :label="item.label"
  31. :value="item.value">
  32. </el-option>
  33. </el-select>
  34. </el-form-item>
  35. <el-form-item>
  36. <el-button @click="search()">查询</el-button>
  37. </el-form-item>
  38. </el-form>
  39. <!-- 数据表格 -->
  40. <el-table
  41. :data="dataList"
  42. border
  43. v-loading="dataListLoading"
  44. style="width: 100%;">
  45. <el-table-column
  46. label="序号"
  47. type="index"
  48. width="50"
  49. align="center">
  50. </el-table-column>
  51. <el-table-column
  52. header-align="center"
  53. align="center"
  54. min-width="100"
  55. :show-overflow-tooltip="true"
  56. label="日期">
  57. <template slot-scope="scope">
  58. {{ scope.row.rowRersion ? getDate(scope.row.rowRersion) : '' }}
  59. </template>
  60. </el-table-column>
  61. <el-table-column
  62. prop="code"
  63. header-align="center"
  64. align="center"
  65. min-width="140"
  66. :show-overflow-tooltip="true"
  67. label="网关编码">
  68. </el-table-column>
  69. <el-table-column
  70. prop="codeNumber"
  71. header-align="center"
  72. align="center"
  73. min-width="100"
  74. :show-overflow-tooltip="true"
  75. label="设备编号">
  76. </el-table-column>
  77. <el-table-column
  78. prop="online"
  79. header-align="center"
  80. align="center"
  81. min-width="80"
  82. :show-overflow-tooltip="true"
  83. label="是否在线">
  84. <template slot-scope="scope">
  85. <el-tag v-if="Number(scope.row.online) === 0" type="danger">离线</el-tag>
  86. <el-tag v-else type="success">在线</el-tag>
  87. </template>
  88. </el-table-column>
  89. <el-table-column
  90. prop="spindleActualSpeed"
  91. header-align="center"
  92. align="center"
  93. min-width="120"
  94. :show-overflow-tooltip="true"
  95. label="设备主轴转速">
  96. </el-table-column>
  97. <el-table-column
  98. prop="name"
  99. header-align="center"
  100. align="center"
  101. min-width="140"
  102. :show-overflow-tooltip="true"
  103. label="设备名称">
  104. </el-table-column>
  105. <el-table-column
  106. prop="model"
  107. header-align="center"
  108. align="center"
  109. min-width="120"
  110. :show-overflow-tooltip="true"
  111. label="设备型号">
  112. </el-table-column>
  113. <el-table-column
  114. prop="specifications"
  115. header-align="center"
  116. align="center"
  117. min-width="120"
  118. :show-overflow-tooltip="true"
  119. label="设备规格">
  120. </el-table-column>
  121. <el-table-column
  122. prop="useFor"
  123. header-align="center"
  124. align="center"
  125. min-width="100"
  126. :show-overflow-tooltip="true"
  127. label="设备用途">
  128. </el-table-column>
  129. <el-table-column
  130. prop="accuracy"
  131. header-align="center"
  132. align="center"
  133. min-width="100"
  134. :show-overflow-tooltip="true"
  135. label="设备精度">
  136. </el-table-column>
  137. <el-table-column
  138. prop="manufacturers"
  139. header-align="center"
  140. align="center"
  141. min-width="120"
  142. :show-overflow-tooltip="true"
  143. label="制造厂家">
  144. </el-table-column>
  145. <el-table-column
  146. prop="manufacturingNumber"
  147. header-align="center"
  148. align="center"
  149. min-width="120"
  150. :show-overflow-tooltip="true"
  151. label="设备出厂编号">
  152. </el-table-column>
  153. <el-table-column
  154. prop="leaveFactoryDate"
  155. header-align="center"
  156. align="center"
  157. min-width="160"
  158. :show-overflow-tooltip="true"
  159. label="设备出厂日期">
  160. </el-table-column>
  161. <el-table-column
  162. prop="verificationDate"
  163. header-align="center"
  164. align="center"
  165. min-width="160"
  166. :show-overflow-tooltip="true"
  167. label="检定日期">
  168. </el-table-column>
  169. <el-table-column
  170. prop="validityDate"
  171. header-align="center"
  172. align="center"
  173. min-width="160"
  174. :show-overflow-tooltip="true"
  175. label="检定有效期(止)">
  176. </el-table-column>
  177. <el-table-column
  178. prop="attachList"
  179. header-align="center"
  180. align="center"
  181. min-width="120"
  182. :show-overflow-tooltip="true"
  183. label="操作说明书">
  184. <template slot-scope="scope">
  185. <div v-for="(item, index) in scope.row.attachList" style="display: inline">
  186. <span v-if="index > 0">,</span>
  187. <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
  188. </div>
  189. </template>
  190. </el-table-column>
  191. <el-table-column
  192. prop="notes"
  193. header-align="center"
  194. align="center"
  195. min-width="180"
  196. :show-overflow-tooltip="true"
  197. label="备注">
  198. </el-table-column>
  199. <el-table-column
  200. prop="responsibilityUserName"
  201. header-align="center"
  202. align="center"
  203. min-width="80"
  204. :show-overflow-tooltip="true"
  205. label="责任人">
  206. </el-table-column>
  207. <el-table-column
  208. prop="userOfName"
  209. header-align="center"
  210. align="center"
  211. min-width="100"
  212. :show-overflow-tooltip="true"
  213. label="当前使用人">
  214. </el-table-column>
  215. <el-table-column
  216. prop="breakageCause"
  217. header-align="center"
  218. align="center"
  219. min-width="180"
  220. :show-overflow-tooltip="true"
  221. label="损坏原因">
  222. </el-table-column>
  223. <el-table-column
  224. prop="attachListBreakage"
  225. header-align="center"
  226. align="center"
  227. min-width="120"
  228. :show-overflow-tooltip="true"
  229. label="报损附件">
  230. <template slot-scope="scope">
  231. <div v-for="(item, index) in scope.row.attachListBreakage" style="display: inline">
  232. <span v-if="index > 0">,</span>
  233. <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
  234. </div>
  235. </template>
  236. </el-table-column>
  237. <el-table-column
  238. prop="attachListVerification"
  239. header-align="center"
  240. align="center"
  241. min-width="120"
  242. :show-overflow-tooltip="true"
  243. label="检定报告附件">
  244. <template slot-scope="scope">
  245. <div v-for="(item, index) in scope.row.attachListVerification" style="display: inline">
  246. <span v-if="index > 0">,</span>
  247. <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
  248. </div>
  249. </template>
  250. </el-table-column>
  251. <el-table-column
  252. prop="state"
  253. fixed="right"
  254. header-align="center"
  255. align="center"
  256. min-width="100"
  257. :show-overflow-tooltip="true"
  258. label="状态">
  259. <template slot-scope="scope">
  260. {{optionsState.find(t => t.value === scope.row.state).label}}
  261. </template>
  262. </el-table-column>
  263. <el-table-column
  264. fixed="right"
  265. header-align="center"
  266. align="center"
  267. width="230"
  268. label="操作">
  269. <template slot-scope="scope">
  270. <!-- <el-button v-if="isAuth('prod:equipment:info')" type="text" size="small" @click="detailHandle(scope.row.id)">查看</el-button>-->
  271. <el-button v-if="isAuth('prod:equipment:info')" type="text" size="small" @click="historyHandle(scope.row)">历史数据</el-button>
  272. <el-button v-if="isAuth('prod:equipment:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">编辑</el-button>
  273. <el-button v-if="isAuth('prod:updateVerification:update')" type="text" size="small" @click="checkHandle(scope.row)">检定</el-button>
  274. <el-button v-if="isAuth('prod:updateBreakage:update')" type="text" size="small" @click="damageHandle(scope.row)">报损</el-button>
  275. <el-button v-if="isAuth('prod:equipmentCheckRecord:updateCheck')" type="text" size="small" @click="inspectionHandle(scope.row)">点检</el-button>
  276. </template>
  277. </el-table-column>
  278. </el-table>
  279. <el-pagination
  280. @size-change="sizeChangeHandle"
  281. @current-change="currentChangeHandle"
  282. :current-page="pageIndex"
  283. :page-sizes="[10, 20, 50, 100]"
  284. :page-size="pageSize"
  285. :total="totalPage"
  286. layout="total, sizes, prev, pager, next, jumper">
  287. </el-pagination>
  288. </template>
  289. <!-- 弹窗, 新增 / 修改 -->
  290. <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @onChose="onChose"></add-or-update>
  291. <detail v-if="detailVisible" ref="detail" @onChose="onChose"></detail>
  292. <device-history v-if="historyVisible" ref="history" @onChose="onChose"></device-history>
  293. <preview-component v-if="previewVisible" ref="preview" @onChose="onChose"></preview-component>
  294. <device-damage v-if="damageVisible" ref="damage" @onChose="onChose" @refreshDataList="getDataList"></device-damage>
  295. <device-check v-if="checkVisible" ref="check" @onChose="onChose" @refreshDataList="getDataList"></device-check>
  296. <device-inspection v-if="inspectionVisible" ref="inspection" @onChose="onChose" @refreshDataList="getDataList"></device-inspection>
  297. </div>
  298. </template>
  299. <script>
  300. import AddOrUpdate from './device-add-or-update'
  301. import Detail from './temp-detail'
  302. import History from './temp-history'
  303. import OrgComponent from '../common/org-component'
  304. import UserComponent from '../common/user-component'
  305. import {optionsEquipmentCheckState} from '@/utils/enums'
  306. import {isAuth} from '@/utils'
  307. import PreviewComponent from '@/views/modules/common/preview-component.vue'
  308. import DeviceHistory from '@/views/modules/device/device-history.vue'
  309. import DeviceDamage from '@/views/modules/device/device-damage.vue'
  310. import DeviceCheck from '@/views/modules/device/device-check.vue'
  311. import DeviceInspection from '@/views/modules/device/device-inspection.vue'
  312. import {getDate} from '@/utils/date-util'
  313. export default {
  314. name: 'inspection-list',
  315. components: {
  316. DeviceInspection,
  317. DeviceCheck,
  318. DeviceDamage,
  319. DeviceHistory,
  320. PreviewComponent,
  321. Detail,
  322. History,
  323. AddOrUpdate,
  324. UserComponent,
  325. OrgComponent
  326. },
  327. data () {
  328. return {
  329. addOrUpdateVisible: false,
  330. detailVisible: false,
  331. historyVisible: false,
  332. previewVisible: false,
  333. damageVisible: false,
  334. checkVisible: false,
  335. inspectionVisible: false,
  336. dataForm: {},
  337. dataList: [],
  338. pageIndex: 1,
  339. pageSize: 10,
  340. totalPage: 0,
  341. dataListLoading: false,
  342. dataListSelections: [],
  343. optionsState: optionsEquipmentCheckState
  344. }
  345. },
  346. created () {
  347. this.getDataList()
  348. },
  349. methods: {
  350. getDate,
  351. isAuth,
  352. onChose () {
  353. this.addOrUpdateVisible = false
  354. this.detailVisible = false
  355. this.historyVisible = false
  356. this.damageVisible = false
  357. this.checkVisible = false
  358. this.inspectionVisible = false
  359. },
  360. // 查询
  361. search () {
  362. this.pageIndex = 1
  363. this.getDataList()
  364. },
  365. // 获取数据列表
  366. getDataList () {
  367. this.dataListLoading = true
  368. this.addOrUpdateVisible = false
  369. this.$http({
  370. url: this.$http.adornUrl('/biz-service/equipmentCheckRecord/list'),
  371. method: 'get',
  372. params: this.$http.adornParams({
  373. 'current': this.pageIndex,
  374. 'size': this.pageSize,
  375. 'creatorId': this.dataForm.creatorId ? this.dataForm.creatorId : null,
  376. 'name': this.dataForm.name ? this.dataForm.name : null,
  377. 'state': this.dataForm.state ? this.dataForm.state : null,
  378. 'dateStart': this.dataForm.date ? this.dataForm.date[0] : null,
  379. 'dateEnd': this.dataForm.date ? this.dataForm.date[1] : null
  380. })
  381. }).then(({data}) => {
  382. if (data && data.code === '200') {
  383. this.dataList = data.data.records
  384. this.totalPage = Number(data.data.total)
  385. } else {
  386. this.dataList = []
  387. this.totalPage = 0
  388. }
  389. this.dataListLoading = false
  390. })
  391. },
  392. // 每页数
  393. sizeChangeHandle (val) {
  394. this.pageSize = val
  395. this.pageIndex = 1
  396. this.getDataList()
  397. },
  398. // 当前页
  399. currentChangeHandle (val) {
  400. this.pageIndex = val
  401. this.getDataList()
  402. },
  403. // 多选
  404. selectionChangeHandle (val) {
  405. this.dataListSelections = val
  406. },
  407. // 新增 / 修改
  408. addOrUpdateHandle (id, disable) {
  409. this.addOrUpdateVisible = true
  410. this.$nextTick(() => {
  411. this.$refs.addOrUpdate.init(id, disable)
  412. })
  413. },
  414. detailHandle (id) {
  415. this.detailVisible = true
  416. this.$nextTick(() => {
  417. this.$refs.detail.init(id)
  418. })
  419. },
  420. // 预览
  421. previewFile (fileName, url) {
  422. this.previewVisible = true
  423. this.$nextTick(() => {
  424. this.$refs.preview.init(fileName, url)
  425. })
  426. },
  427. // 历史记录
  428. historyHandle (row) {
  429. this.historyVisible = true
  430. this.$nextTick(() => {
  431. this.$refs.history.init(row.codeNumber)
  432. })
  433. },
  434. // 报损
  435. damageHandle (row) {
  436. this.damageVisible = true
  437. this.$nextTick(() => {
  438. this.$refs.damage.init(row)
  439. })
  440. },
  441. // 检定
  442. checkHandle (row) {
  443. this.checkVisible = true
  444. this.$nextTick(() => {
  445. this.$refs.check.init(row)
  446. })
  447. },
  448. // 点检
  449. inspectionHandle (row) {
  450. this.inspectionVisible = true
  451. this.$nextTick(() => {
  452. this.$refs.inspection.init(row)
  453. })
  454. },
  455. // 删除
  456. deleteHandle (id) {
  457. if (!id) return
  458. let ids = []
  459. ids.push(id)
  460. this.$confirm(`确定删除?`, '提示', {
  461. confirmButtonText: '确定',
  462. cancelButtonText: '取消',
  463. type: 'warning'
  464. }).then(() => {
  465. this.$http({
  466. url: this.$http.adornUrl(`/iot-platform/temp/delete`),
  467. method: 'DELETE',
  468. data: ids
  469. }).then(({data}) => {
  470. if (data && data.code === '200') {
  471. this.$message({
  472. message: '操作成功',
  473. type: 'success',
  474. duration: 1500,
  475. onClose: () => {
  476. this.getDataList()
  477. }
  478. })
  479. } else {
  480. this.$message.error(data.msg)
  481. }
  482. })
  483. }).catch(() => {})
  484. }
  485. }
  486. }
  487. </script>
  488. <style scoped>
  489. </style>