index.vue 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. <template>
  2. <div class="ele-body">
  3. <el-card shadow="never" v-loading="loading">
  4. <search user="recycleName" @search="reload"></search>
  5. <!-- 数据表格 -->
  6. <ele-pro-table
  7. ref="table"
  8. :columns="columns"
  9. :datasource="datasource"
  10. cache-key="systemRoleTable"
  11. :pageSize="20"
  12. >
  13. <!-- 表头工具栏 -->
  14. <template v-slot:toolbar>
  15. <el-button
  16. size="small"
  17. type="primary"
  18. icon="el-icon-plus"
  19. class="ele-btn-icon"
  20. @click="openEdit('', 'add')"
  21. >新建</el-button>
  22. </template>
  23. <template v-slot:code="{ row }">
  24. <el-link type="primary" :underline="false" @click="openEdit(row, 'view')">{{ row.code }}</el-link>
  25. </template>
  26. <template v-slot:action="{ row }">
  27. <!-- <el-link
  28. v-if="!row.workId"
  29. type="primary"
  30. :underline="false"
  31. @click="openEdit(row, 'edit')"
  32. >修改</el-link>-->
  33. <el-link
  34. v-if="row.source == 0"
  35. type="primary"
  36. :underline="false"
  37. @click="openEdit(row, 'edit')"
  38. >修改</el-link>
  39. <el-popconfirm class="ele-action" title="确定要删除当前故障吗?" @confirm="deleteRecycle(row)">
  40. <template v-slot:reference>
  41. <el-link
  42. v-if="row.source == 0"
  43. type="danger"
  44. icon="el-icon-delete"
  45. :underline="false"
  46. >删除</el-link>
  47. </template>
  48. </el-popconfirm>
  49. </template>
  50. </ele-pro-table>
  51. </el-card>
  52. <recycleDialog ref="recycleRef" @refresh="reload" />
  53. </div>
  54. </template>
  55. <script>
  56. import recycleDialog from './component/recycleDialog.vue';
  57. import search from '@/views/salesServiceManagement/accessory/components/search.vue';
  58. import { recyclePage, recycleDelete } from '@/api/salesServiceManagement/index';
  59. export default {
  60. components: {
  61. search,
  62. recycleDialog
  63. },
  64. data() {
  65. return {
  66. // 加载状态
  67. loading: false
  68. };
  69. },
  70. computed: {
  71. columns() {
  72. return [
  73. {
  74. columnKey: 'index',
  75. label: '序号',
  76. type: 'index',
  77. width: 55,
  78. align: 'center',
  79. showOverflowTooltip: true,
  80. fixed: 'left'
  81. },
  82. {
  83. slot: 'code',
  84. prop: 'code',
  85. label: '编码',
  86. align: 'center',
  87. showOverflowTooltip: true
  88. },
  89. {
  90. prop: 'orderWorkCode',
  91. label: '工单编码',
  92. align: 'center',
  93. showOverflowTooltip: true
  94. },
  95. {
  96. prop: 'categoryName',
  97. label: '物品名称',
  98. align: 'center',
  99. showOverflowTooltip: true,
  100. formatter: (row) => {
  101. if (!row.details) return '';
  102. let str = '';
  103. row.details.map((el, idx) => {
  104. if (idx + 1 == row.details.length) {
  105. str += el.categoryName;
  106. } else {
  107. str = str + '' + el.categoryName + ',';
  108. }
  109. });
  110. return str;
  111. }
  112. },
  113. {
  114. prop: 'contactName',
  115. label: '客户名称',
  116. align: 'center',
  117. showOverflowTooltip: true
  118. },
  119. {
  120. prop: 'categoryName',
  121. label: '设备名称',
  122. align: 'center',
  123. showOverflowTooltip: true,
  124. formatter: (row) => {
  125. if (!row.deviceDetails) return '';
  126. let str = '';
  127. row.deviceDetails.map((el, idx) => {
  128. if (idx + 1 == row.deviceDetails.length) {
  129. str += el.categoryName;
  130. } else {
  131. str = str + '' + el.categoryName + ',';
  132. }
  133. });
  134. return str;
  135. }
  136. },
  137. {
  138. prop: 'recycleDeptName',
  139. label: '回收部门',
  140. align: 'center',
  141. showOverflowTooltip: true
  142. },
  143. // + + 时间选择
  144. {
  145. prop: 'recycleName',
  146. label: '回收人',
  147. align: 'center',
  148. showOverflowTooltip: true
  149. },
  150. {
  151. prop: 'createTime',
  152. label: '创建时间',
  153. align: 'center',
  154. showOverflowTooltip: true
  155. },
  156. {
  157. prop: 'usageTime',
  158. label: '回收时间',
  159. align: 'center',
  160. showOverflowTooltip: true
  161. },
  162. {
  163. columnKey: 'action',
  164. slot: 'action',
  165. label: '操作',
  166. align: 'center',
  167. width: 180,
  168. resizable: false,
  169. showOverflowTooltip: true
  170. }
  171. ];
  172. }
  173. },
  174. created() {},
  175. methods: {
  176. /* 表格数据源 */
  177. async datasource({ page, limit, where, order }) {
  178. return recyclePage({ pageNum: page, size: limit, ...where });
  179. },
  180. /* 刷新表格 */
  181. reload(where) {
  182. this.$refs.table.reload({ page: 1, where });
  183. },
  184. openEdit(row, type) {
  185. this.$refs.recycleRef.init(row, type);
  186. },
  187. deleteRecycle(row) {
  188. recycleDelete([row.id]).then((res) => {
  189. if (res) {
  190. this.$message.success('操作成功!');
  191. this.reload();
  192. }
  193. });
  194. }
  195. }
  196. };
  197. </script>
  198. <style lang="scss" scoped></style>