rcwxTable.vue 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553
  1. <!-- 维修-->
  2. <template>
  3. <div class="rcwx-list">
  4. <div class="eq-list-top">
  5. <el-input
  6. placeholder="搜索设备名称或内码"
  7. size="small"
  8. @keyup.enter.native="pageChanged(1)"
  9. @blur="pageChanged(1)"
  10. clearable
  11. prefix-icon="el-icon-search"
  12. v-model="sbjc"
  13. style="width:192px;margin-right:12px"
  14. ></el-input>
  15. <el-input
  16. placeholder="搜索位置名称或内码"
  17. size="small"
  18. @keyup.enter.native="pageChanged(1)"
  19. @blur="pageChanged(1)"
  20. clearable
  21. prefix-icon="el-icon-search"
  22. v-model="wzjc"
  23. style="width:192px;margin-right:12px"
  24. ></el-input>
  25. <el-input
  26. placeholder="搜索描述"
  27. size="small"
  28. clearable
  29. @keyup.enter.native="pageChanged(1)"
  30. @blur="pageChanged(1)"
  31. prefix-icon="el-icon-search"
  32. v-model="matters"
  33. style="width:192px;margin-right:12px"
  34. ></el-input>
  35. <el-input
  36. placeholder="搜索工单编号"
  37. size="small"
  38. clearable
  39. @keyup.enter.native="pageChanged(1)"
  40. @blur="pageChanged(1)"
  41. prefix-icon="el-icon-search"
  42. v-model="wonum2"
  43. style="width:192px;margin-right:12px"
  44. ></el-input>
  45. <Select
  46. @change="confirmMore"
  47. @confirm="confirmMore"
  48. style="margin-right:12px;"
  49. v-model="status"
  50. width="200"
  51. tipPlace="top"
  52. caption="任务状态描述:"
  53. multiple
  54. :selectdata="statusOption"
  55. ></Select>
  56. <Select
  57. @change="pageChanged(1)"
  58. style="margin-right:12px;"
  59. v-model="source"
  60. width="180"
  61. tipPlace="top"
  62. caption="报修来源:"
  63. :selectdata="sourceOption"
  64. ></Select>
  65. <!-- <el-input
  66. placeholder='搜索执行人'
  67. size='small'
  68. clearable
  69. @keyup.enter.native='pageChanged(1)'
  70. @blur='pageChanged(1)'
  71. prefix-icon='el-icon-search'
  72. v-model='people'
  73. style='width:192px;margin-right:12px'
  74. ></el-input>-->
  75. <input-dialog :type="5" @confirm="confirm"></input-dialog>
  76. </div>
  77. <div ref="tableBox">
  78. <el-table :data="tableData" :border="true" style="width: 100%" @row-click="innerTable">
  79. <el-table-column type="index" label="序号" width="60" :index="indexMethod"></el-table-column>
  80. <el-table-column prop="sbmc" label="设备名称" show-overflow-tooltip resizable min-width="100">
  81. <template slot-scope="{row}">{{row.sbmc || '--'}}</template>
  82. </el-table-column>
  83. <el-table-column prop="matters" label="位置名称" width="240" show-overflow-tooltip resizable>
  84. <template slot-scope="{row}">{{row.wzjc || '--'}}</template>
  85. </el-table-column>
  86. <el-table-column
  87. prop="description"
  88. label="问题描述"
  89. show-overflow-tooltip
  90. resizable
  91. min-width="280"
  92. >
  93. <template slot-scope="{row}">{{row.description || '--'}}</template>
  94. </el-table-column>
  95. <el-table-column prop="brand" label="报修照片" width="80">
  96. <template slot-scope="{row}">
  97. <div
  98. v-if="row.repair_photos_num"
  99. style="cursor:pointer;color: #0091ff;"
  100. @click.stop="clickPicRepair(row)"
  101. >{{row.repair_photos_num+'张'}}</div>
  102. <div v-else>{{'--'}}</div>
  103. </template>
  104. </el-table-column>
  105. <el-table-column
  106. prop="description"
  107. label="任务状态描述"
  108. show-overflow-tooltip
  109. resizable
  110. min-width="200"
  111. >
  112. <template slot-scope="{row}">{{row.status || '--'}}</template>
  113. </el-table-column>
  114. <el-table-column prop="brand" label="完工照片" width="80">
  115. <template slot-scope="{row}">
  116. <div
  117. v-if="row.finish_photos_num"
  118. style="cursor:pointer;color: #0091ff;"
  119. @click.stop="clickPicFinish(row)"
  120. >{{row.finish_photos_num+'张'}}</div>
  121. <div v-else>{{'--'}}</div>
  122. </template>
  123. </el-table-column>
  124. <el-table-column prop="reportdate" label="要求完成时间" width="140">
  125. <template slot-scope="{row}">{{row.schedfinish?formatterTime(row.schedfinish): '--'}}</template>
  126. </el-table-column>
  127. <el-table-column prop="sjjssj" label="实际完工时间" width="140">
  128. <template slot-scope="{row}">{{row.wotjyssj?formatterTime(row.wotjyssj): '--'}}</template>
  129. </el-table-column>
  130. <el-table-column
  131. prop="description"
  132. label="报修来源"
  133. show-overflow-tooltip
  134. resizable
  135. min-width="200"
  136. >
  137. <template slot-scope="{row}">{{row.bxfwlymc || '--'}}</template>
  138. </el-table-column>
  139. <el-table-column
  140. prop="description"
  141. label="执行人"
  142. show-overflow-tooltip
  143. resizable
  144. min-width="80"
  145. >
  146. <template slot-scope="{row}">{{row.lead || '--'}}</template>
  147. </el-table-column>
  148. <el-table-column
  149. prop="description"
  150. label="工单编号"
  151. show-overflow-tooltip
  152. resizable
  153. min-width="80"
  154. >
  155. <template slot-scope="{row}">
  156. <div
  157. v-if="row.wonum"
  158. @click.stop="staff(row)"
  159. style="cursor:pointer;color: #0091ff;"
  160. >{{row.wonum}}</div>
  161. <div v-else>{{'--'}}</div>
  162. </template>
  163. </el-table-column>
  164. <el-table-column prop="assetnum" label="设备内码" show-overflow-tooltip resizable width="80">
  165. <template slot-scope="{row}">{{row.assetnum || '--'}}</template>
  166. </el-table-column>
  167. <el-table-column
  168. prop="description"
  169. label="位置内码"
  170. show-overflow-tooltip
  171. resizable
  172. min-width="80"
  173. >
  174. <template slot-scope="{row}">{{row.location || '--'}}</template>
  175. </el-table-column>
  176. </el-table>
  177. </div>
  178. <div class="foot">
  179. <el-pagination
  180. background
  181. layout="prev, pager, next"
  182. :total="total"
  183. :page-size="size"
  184. :current-page="currentPage"
  185. @prev-click="pageChanged"
  186. @next-click="pageChanged"
  187. @current-change="pageChanged"
  188. ></el-pagination>
  189. <pic-large :imgUrl="imgUrl" ref="picLargeOpen"></pic-large>
  190. </div>
  191. </div>
  192. </template>
  193. <script>
  194. import { queryWxzy, queryWxzyImg } from "@/api/equipmentList.js";
  195. import { mapGetters } from "vuex";
  196. import inputDialog from "./inputDIalog";
  197. import { Select } from "meri-design";
  198. import { querySelect } from "@/api/public.js";
  199. import { formatterTime, number_format } from "@/utils/format.js";
  200. export default {
  201. components: { Select, inputDialog },
  202. data() {
  203. return {
  204. tableData: [],
  205. total: 0,
  206. currentPage: 1,
  207. reportdate: "",
  208. sjjssj: "",
  209. sbjc: "",
  210. wzjc: "",
  211. matters: "",
  212. wonum2: "",
  213. wonum: "",
  214. sourceOption: [],
  215. statusOption: [],
  216. source: "全部",
  217. formatterTime,
  218. number_format,
  219. imgUrl: [],
  220. people: "",
  221. locationName: "",
  222. keyword: "",
  223. status: [], //搜索状态描述
  224. getStatus: [
  225. "新建",
  226. "待派工",
  227. "已派工",
  228. "待验收",
  229. "验收通过",
  230. "工单执行退回",
  231. "问题待解决",
  232. "执行中"
  233. ] //默认选项如果statusOption存在则写入status中
  234. };
  235. },
  236. computed: {
  237. ...mapGetters(["floorSelect"])
  238. },
  239. props: ["smsxt", "diff", "tabLabel", "size", "assetnum"],
  240. methods: {
  241. //序号的方法
  242. indexMethod(index) {
  243. return (this.currentPage - 1) * this.size + index + 1;
  244. },
  245. innerTable(row) {
  246. if (row.workorderid) {
  247. window.open(
  248. `http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=JXWO&uniqueid=${row.workorderid}`
  249. );
  250. }
  251. },
  252. //跳转工单编号
  253. staff(row) {
  254. console.log(row);
  255. if (row.wonum) {
  256. window.open(
  257. `http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=JXWO&uniqueid=${row.wonum}`
  258. );
  259. }
  260. },
  261. //多余输入框监听
  262. confirm(reportdate, real, locationName, people) {
  263. this.reportdate = reportdate;
  264. this.sjjssj = real;
  265. this.locationName = locationName;
  266. this.people = people;
  267. this.pageChanged(1);
  268. },
  269. pageChanged(page) {
  270. this.currentPage = page;
  271. this.getList();
  272. },
  273. getList() {
  274. let getParams = {
  275. data: {
  276. smsxt: this.smsxt,
  277. // diff: this.diff,
  278. plazaId: this.$store.state.plazaId,
  279. page: this.currentPage,
  280. size: this.size
  281. }
  282. };
  283. //区分主要设备和全部设备
  284. if (this.smsxt != "1008") {
  285. getParams.data.onlyMainAsset = true;
  286. }
  287. if (this.assetnum) {
  288. getParams.data.assetnum = this.assetnum;
  289. }
  290. //下拉
  291. if (this.reportdate) {
  292. getParams.data.schedfinishStartDate = this.reportdate[0] + "000000";
  293. getParams.data.schedfinishEndDate = this.reportdate[1] + "000000";
  294. }
  295. if (this.real) {
  296. getParams.data.wotjyssjStartDate = this.real[0] + "000000";
  297. getParams.data.wotjyssjEndDate = this.real[1] + "000000";
  298. }
  299. if (this.source && this.source != "全部") {
  300. getParams.data.bxfwlymc = this.source;
  301. getParams.data.bxfwly = this.source;
  302. }
  303. //输入框搜索
  304. getParams.data.keyword = "";
  305. if (this.sbjc) {
  306. getParams.data.keyword += `${this.sbjc}:sbmc,assetnum;`;
  307. }
  308. if (this.wzjc) {
  309. getParams.data.keyword += `${this.wzjc}:wzjc,location;`;
  310. }
  311. if (this.matters) {
  312. getParams.data.keyword += `${this.matters}:description;`;
  313. }
  314. if (this.locationName) {
  315. getParams.data.keyword += `${this.locationName}:location;`;
  316. }
  317. if (this.wonum2) {
  318. getParams.data.keyword += `${this.wonum2}:wonum;`;
  319. }
  320. if (this.people) {
  321. getParams.data.keyword += `${this.people}:lead;`;
  322. }
  323. if (getParams.data.keyword == "") {
  324. delete getParams.data.keyword;
  325. }
  326. if (this.status.length) {
  327. const data = {
  328. status: this.status
  329. };
  330. getParams.getParams = data;
  331. }
  332. queryWxzy(getParams).then(res => {
  333. this.tableData = res.data.data || [];
  334. this.total = res.count;
  335. });
  336. },
  337. clickPicRepair(row) {
  338. let getParams = {
  339. data: {
  340. plazaId: this.$store.state.plazaId,
  341. ticketuid: row.ticketuid,
  342. type: 0,
  343. workorderid: row.workorderid
  344. }
  345. };
  346. queryWxzyImg(getParams).then(res => {
  347. let url = res.data;
  348. this.imgUrl = [];
  349. if (url) {
  350. url.forEach(el => {
  351. let obj = {
  352. name: el.description,
  353. url: el.urlname
  354. };
  355. this.imgUrl.push(obj);
  356. });
  357. }
  358. this.$refs.picLargeOpen.open(this.imgUrl);
  359. });
  360. },
  361. clickPicFinish(row) {
  362. let getParams = {
  363. data: {
  364. plazaId: this.plazaId,
  365. ticketuid: row.ticketuid,
  366. type: 1,
  367. workorderid: row.workorderid
  368. }
  369. };
  370. queryWxzyImg(getParams).then(res => {
  371. let url = res.data;
  372. this.imgUrl = [];
  373. if (url) {
  374. url.forEach(el => {
  375. let obj = {
  376. name: el.description,
  377. url: el.urlname
  378. };
  379. this.imgUrl.push(obj);
  380. });
  381. }
  382. this.$refs.picLargeOpen.open(this.imgUrl);
  383. });
  384. },
  385. startMethods() {
  386. this.tabFind();
  387. },
  388. //下拉框查询
  389. tabFind() {
  390. let postParams = [
  391. {
  392. columnName: { bxfwly: "bxfwlymc" },
  393. params: {
  394. smsxt: this.smsxt
  395. },
  396. tableName: "sms_wxzy" //视图名称
  397. }
  398. ];
  399. let data = {
  400. plazaId: this.$store.state.plazaId
  401. };
  402. if (this.smsxt != "1008") {
  403. data.onlyMainAsset = true;
  404. }
  405. querySelect({ data, postParams }).then(res => {
  406. //console.log(res)
  407. let bxfwlymc =
  408. res.data && res.data.data && res.data.data.sms_wxzy
  409. ? res.data.data.sms_wxzy.bxfwly
  410. : [];
  411. this.sourceOption = [];
  412. this.sourceOption.push({
  413. name: "全部",
  414. id: "全部"
  415. });
  416. bxfwlymc.forEach(el => {
  417. this.sourceOption.push({
  418. name: el.value,
  419. id: el.key
  420. });
  421. });
  422. });
  423. // 2任务状态
  424. let postParams2 = [
  425. {
  426. columnName: { status: "status" },
  427. params: {
  428. smsxt: this.smsxt
  429. },
  430. tableName: "sms_wxzy" //视图名称
  431. }
  432. ];
  433. querySelect({ data, postParams: postParams2 }).then(res => {
  434. let bxfwlymc =
  435. res.data && res.data.data && res.data.data.sms_wxzy
  436. ? res.data.data.sms_wxzy.status
  437. : [];
  438. this.statusOption = [];
  439. // this.statusOption.push({
  440. // name: "全部",
  441. // id: "全部"
  442. // });
  443. bxfwlymc.forEach(el => {
  444. this.statusOption.push({
  445. name: el.value,
  446. id: el.key
  447. });
  448. });
  449. let status = [];
  450. this.statusOption.forEach(item => {
  451. if (this.getStatus.includes(item.id)) {
  452. status.push(item.id);
  453. }
  454. });
  455. this.status = status;
  456. // 获取数据
  457. this.getList();
  458. });
  459. },
  460. confirmMore(val) {
  461. const arr = [];
  462. val.forEach(item => {
  463. arr.push(item.id);
  464. });
  465. this.status = arr;
  466. this.getList();
  467. }
  468. },
  469. watch: {
  470. diff(newV, oldV) {
  471. if (newV !== oldV) {
  472. this.startMethods();
  473. }
  474. },
  475. assetnum(newV, oldV) {
  476. if (newV !== oldV) {
  477. // this.tabFind()
  478. this.getList();
  479. }
  480. },
  481. tabLabel(newV, oldV) {
  482. if (newV !== oldV) {
  483. this.startMethods();
  484. }
  485. }
  486. },
  487. mounted() {
  488. this.startMethods();
  489. }
  490. };
  491. </script>
  492. <style lang="less" scoped>
  493. .rcwx-list {
  494. .eq-list-top {
  495. display: flex;
  496. margin-bottom: 12px;
  497. .picker-box {
  498. display: flex;
  499. align-items: center;
  500. background: #fff;
  501. padding: 0 6px;
  502. border: 1px solid #dcdfe6;
  503. border-radius: 4px;
  504. height: 32px;
  505. box-sizing: border-box;
  506. margin-right: 12px;
  507. .picker-span {
  508. margin-right: 6px;
  509. color: rgba(0, 0, 0, 0.65);
  510. }
  511. }
  512. }
  513. td {
  514. overflow: hidden;
  515. text-overflow: ellipsis;
  516. white-space: nowrap;
  517. }
  518. .foot {
  519. height: 32px;
  520. display: flex;
  521. justify-content: flex-end;
  522. margin-top: 28px;
  523. }
  524. }
  525. </style>
  526. <style lang="less" >
  527. .rcwx-list {
  528. .picker-box {
  529. .el-input__inner {
  530. border: none;
  531. }
  532. .el-range-editor.el-input__inner {
  533. padding: 3px 0px;
  534. }
  535. .el-icon-date {
  536. display: none;
  537. }
  538. .el-range__close-icon {
  539. position: absolute;
  540. right: 0px;
  541. top: 2px;
  542. }
  543. .el-range-editor--mini .el-range-input {
  544. font-size: 14px;
  545. color: rgb(31, 36, 41);
  546. }
  547. }
  548. /deep/.el-table td {
  549. cursor: pointer;
  550. }
  551. }
  552. </style>