contactList.vue 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. <template>
  2. <div class="ele-body">
  3. <ele-pro-table
  4. ref="table"
  5. :columns="columns"
  6. :datasource="datasource"
  7. tool-class="ele-toolbar-form"
  8. :needPage="false"
  9. cache-key="eomContactPageTable"
  10. >
  11. <template v-slot:name="{ row }">
  12. <el-link type="primary" :underline="false" @click="openDetail(row)">
  13. {{ row.name }}</el-link
  14. >
  15. </template>
  16. </ele-pro-table>
  17. <ContactDetailDialog ref="contactDetailDialogRef"></ContactDetailDialog>
  18. </div>
  19. </template>
  20. <script>
  21. import ContactDetailDialog from './contactDetailDialog.vue';
  22. import {
  23. contactApplyList,
  24. } from '@/api/bpm/components/saleManage/contact';
  25. export default {
  26. components: {
  27. ContactDetailDialog
  28. },
  29. props:{
  30. businessId:{
  31. default:""
  32. }
  33. },
  34. data() {
  35. return {
  36. datasource:[],
  37. columns: [
  38. {
  39. columnKey: 'index',
  40. label: '序号',
  41. type: 'index',
  42. width: 55,
  43. align: 'center',
  44. showOverflowTooltip: true,
  45. fixed: 'left'
  46. },
  47. {
  48. prop: 'code',
  49. label: '客户编码',
  50. align: 'center',
  51. showOverflowTooltip: true,
  52. minWidth: 140
  53. },
  54. {
  55. prop: 'name',
  56. label: '客户名称',
  57. align: 'center',
  58. slot: 'name',
  59. showOverflowTooltip: true,
  60. minWidth: 200
  61. },
  62. {
  63. prop: 'serialNo',
  64. label: '客户代号',
  65. align: 'center',
  66. showOverflowTooltip: true,
  67. minWidth: 140
  68. },
  69. {
  70. prop: 'phone',
  71. label: '客户电话',
  72. align: 'center',
  73. showOverflowTooltip: true,
  74. minWidth: 120
  75. },
  76. {
  77. prop: 'addressName',
  78. label: '单位地址',
  79. align: 'center',
  80. showOverflowTooltip: true,
  81. minWidth: 120,
  82. formatter: (_row, _column, cellValue) => {
  83. let addr =
  84. '' + _row.addressName
  85. ? _row.addressName.replaceAll(',', '')
  86. : '';
  87. addr += _row.address ? _row.address : '';
  88. return addr;
  89. }
  90. },
  91. {
  92. prop: 'linkName',
  93. label: '联系人',
  94. align: 'center',
  95. showOverflowTooltip: true,
  96. minWidth: 120
  97. },
  98. {
  99. prop: 'linkPhone',
  100. label: '联系人电话',
  101. align: 'center',
  102. showOverflowTooltip: true,
  103. minWidth: 120
  104. },
  105. {
  106. prop: 'parentName',
  107. label: '上级单位',
  108. align: 'center',
  109. showOverflowTooltip: true,
  110. minWidth: 120
  111. },
  112. {
  113. prop: 'status',
  114. label: '状态',
  115. align: 'center',
  116. showOverflowTooltip: true,
  117. minWidth: 100,
  118. formatter: (_row, _column, cellValue) => {
  119. return _row.status === 1 ? '启用' : '禁用';
  120. }
  121. },
  122. {
  123. prop: 'createUsername',
  124. label: '创建人',
  125. align: 'center',
  126. showOverflowTooltip: true,
  127. minWidth: 100
  128. },
  129. {
  130. prop: 'createTime',
  131. label: '创建时间',
  132. align: 'center',
  133. showOverflowTooltip: true,
  134. minWidth: 160,
  135. formatter: (_row, _column, cellValue) => {
  136. return this.$util.toDateString(cellValue);
  137. }
  138. }
  139. ]
  140. };
  141. },
  142. computed: {},
  143. created() {
  144. contactApplyList(this.businessId).then(res=>{
  145. console.log(res)
  146. this.datasource=res.data.contactList
  147. })
  148. },
  149. methods: {
  150. openDetail(row) {
  151. this.$refs.contactDetailDialogRef.open(row);
  152. }
  153. },
  154. };
  155. </script>
  156. <style lang="scss" scoped></style>