index.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. <template>
  2. <div>
  3. <el-popover
  4. placement="bottom"
  5. width="100%"
  6. v-model="visible">
  7. <div>
  8. <div class="flex-align-center flex-between" style="margin-bottom:10px">
  9. <el-input style="width:200px" suffix-icon="el-icon-search" size="small" v-model="params.content.where.condition" placeholder="输入经销商信息" @keyup.enter.native="queryEnterpriseArchives(params.content.pageNumber = 1)" @clear="queryEnterpriseArchives(params.content.pageNumber = 1)" clearable></el-input>
  10. <addTemp @onSuccess="onSuccess"></addTemp>
  11. </div>
  12. <el-table
  13. :data="ENlist"
  14. size="small"
  15. stripe
  16. style="width: 100%"
  17. height="300"
  18. border>
  19. <el-table-column
  20. prop="enterprisename"
  21. label="经销商名称"
  22. width="180">
  23. </el-table-column>
  24. <el-table-column
  25. prop="contact"
  26. label="联系人"
  27. width="180">
  28. </el-table-column>
  29. <el-table-column
  30. prop="phonenumber"
  31. label="联系电话"
  32. width="180">
  33. </el-table-column>
  34. <el-table-column>
  35. <template slot-scope="scope">
  36. <el-button size="mini" type="text" @click="rowClick(scope.row)">选 择</el-button>
  37. </template>
  38. </el-table-column>
  39. </el-table>
  40. <div style="margin-top:16px;text-align:right">
  41. <el-pagination
  42. background
  43. small
  44. @size-change="handleSizeChange"
  45. @current-change="handleCurrentChange"
  46. :current-page="currentPage"
  47. :page-size="params.content.pageSize"
  48. layout="total, prev, pager, next, jumper"
  49. :total="total">
  50. </el-pagination>
  51. </div>
  52. </div>
  53. <el-input readonly :validate-event="false" slot="reference" v-model="form.enterprisename" @focus="queryEnterpriseArchives" placeholder="输入经销商信息" clearable></el-input>
  54. </el-popover>
  55. </div>
  56. </template>
  57. <script>
  58. import addTemp from '@/Form/EnterpriseArchives/add.vue'
  59. export default {
  60. components:{
  61. addTemp
  62. },
  63. props:['ismanage'],
  64. data () {
  65. return {
  66. ENlist:[],
  67. total:0,
  68. currentPage:0,
  69. form:{
  70. enterprisename:''
  71. },
  72. params:{
  73. "id": 20230219195002,
  74. "content": {
  75. "pageNumber": 1,
  76. "pageSize": 10,
  77. "ismanage": this.ismanage,
  78. "where": {
  79. "condition": ''
  80. },
  81. }
  82. },
  83. visible:false
  84. }
  85. },
  86. methods:{
  87. async queryEnterpriseArchives () {
  88. // if (this.type) this.params.content.where.type = this.type
  89. const res = await this.$api.requested(this.params)
  90. this.ENlist = res.data
  91. this.total = res.total
  92. this.currentPage = res.pageNumber
  93. },
  94. handleSizeChange(val) {
  95. this.params.content.pageSize = val
  96. this.queryEnterpriseArchives()
  97. },
  98. handleCurrentChange(val) {
  99. this.params.content.pageNumber = val
  100. this.queryEnterpriseArchives()
  101. },
  102. rowClick (row) {
  103. this.visible = false
  104. this.form.enterprisename = row.enterprisename
  105. this.$emit('rowClick',row)
  106. },
  107. onSuccess () {
  108. this.queryEnterpriseArchives()
  109. this.form.enterprisename = this.ENlist[0].enterprisename
  110. this.$emit('rowClick',this.ENlist[0])
  111. }
  112. },
  113. mounted () {
  114. // this.queryEnterpriseArchives()
  115. }
  116. }
  117. </script>
  118. <style>
  119. </style>