index.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <div class="app-container">
  3. <search-form
  4. :list-loading="listLoading"
  5. @change="searchHandle"
  6. />
  7. <table-list
  8. :list-loading="listLoading"
  9. :data="tableData2"
  10. :columns="listConfig"
  11. :current-page="currentPage"
  12. :page-size="pageSize"
  13. :total-records="totalRecords"
  14. @currentChange="pageHandle"
  15. @sizeChange="sizeChange"
  16. :operationsDefaultLength="6"
  17. :isAdd="true"
  18. @add="openPopup"
  19. >
  20. </table-list>
  21. <popup-edit
  22. :isShow="isDtlShow"
  23. :curObj="curObj"
  24. @close="closePopup"
  25. />
  26. <index-record
  27. :isShow="isQShow"
  28. :curObj="curObj"
  29. @close="closeQPopup"
  30. />
  31. </div>
  32. </template>
  33. <script>
  34. import { arrToObj } from '@/utils'
  35. import SearchForm from './components/searchForm/Index'
  36. import IndexRecord from './components/popup/IndexRecord'
  37. import PopupEdit from './components/popup/IndexEdit'
  38. import baseTable from '_m/baseTable.js'
  39. export default {
  40. name: 'index',
  41. components: {
  42. SearchForm,
  43. PopupEdit,
  44. IndexRecord,
  45. },
  46. provide() {
  47. return {
  48. parentData: this
  49. }
  50. },
  51. mixins: [baseTable],
  52. data() {
  53. return {
  54. apiStr: 'cust.admtradelist',
  55. searchForm: null,
  56. isDtlShow: false,
  57. curObj: {},
  58. isQShow: false,
  59. isAShow: false,
  60. }
  61. },
  62. computed: {
  63. tableData2() {
  64. const arr = [...this.tableData]
  65. arr.map(item => {
  66. item.createBy = item.create_user ? item.create_user.nickname : '-'
  67. item.newRecord = `${item.record_estate_name ? item.record_estate_name : '-'}${item.record_protect_at && item.record_protect_at !== '1970-01-01' ? '(' + item.record_protect_at + ')' : ''}-${item.record_remark ? item.record_remark : ''}`
  68. })
  69. return arr
  70. }
  71. },
  72. created() {},
  73. mounted() {
  74. this.listConfig = {
  75. rows: [
  76. { label: '房屋类型', prop: 'house_type', fullShow: true, type: 'flag', flags: arrToObj(this.$dictData.trade_house_type) },
  77. { label: '成交店员', prop: 'deal_clerk' },
  78. { label: '成交楼盘', prop: 'deal_item' },
  79. { label: '房号', prop: 'house_no' },
  80. { label: '成交类型', prop: 'deal_type', fullShow: true, type: 'flag', flags: arrToObj(this.$dictData.trade_deal_type) },
  81. { label: '成交日期', prop: 'deal_at' },
  82. { label: '客户姓名', prop: 'customer_name' },
  83. { label: '客户电话', prop: 'customer_phone' },
  84. { label: '报备渠道', prop: 'report_dept' },
  85. { label: '面积(㎡)', prop: 'area' },
  86. { label: '总价(万元)', prop: 'price' },
  87. { label: '创建时间', prop: 'create_at' },
  88. { label: '操作', width: 200, type: 'handle2', operations:
  89. [
  90. { label: '编辑', func: this.openPopup, btnType: 'success' },
  91. { label: '成交详情', func: this.openQPopup, btnType: 'primary' },
  92. { label: '删除', func: this.delHandle, btnType: 'danger' },
  93. ]
  94. }
  95. ]
  96. }
  97. },
  98. methods: {
  99. openQPopup (row) {
  100. if (row && row.id) {
  101. this.curObj = row
  102. } else {
  103. this.curObj = {}
  104. }
  105. this.isQShow = true
  106. },
  107. closeQPopup (obj) {
  108. this.isQShow = false
  109. if (obj) {
  110. this.fetchData()
  111. }
  112. },
  113. delHandle(row) {
  114. this.$msg(`您确定要删除该报备吗?`, 'confirm', () => {
  115. this.$api.cust.admtradedel({
  116. id: row.id
  117. }).then(data => {
  118. this.$msgs(`已删除!`)
  119. this.fetchData()
  120. })
  121. }, null, true)
  122. },
  123. openPopup(row) {
  124. if (row && row.id) {
  125. this.curObj = row
  126. } else {
  127. this.curObj = {}
  128. }
  129. this.isDtlShow = true
  130. },
  131. closePopup(obj) {
  132. this.isDtlShow = false
  133. if (obj) {
  134. this.fetchData()
  135. }
  136. }
  137. }
  138. }
  139. </script>