index.vue 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <div class="default-main ">
  3. <el-alert class="ba-table-alert" v-if="baTable.table.remark" :title="baTable.table.remark" type="info"
  4. show-icon/>
  5. <el-row>
  6. <el-col :span="24">
  7. <!-- 表格顶部菜单 -->
  8. <TableHeader :buttons="['refresh', 'add', 'edit', 'delete', 'comSearch']"
  9. quick-search-placeholder="通过标题模糊搜索"
  10. @action="baTable.onTableHeaderAction"/>
  11. <!-- 表格 -->
  12. <!-- 要使用`el-table`组件原有的属性,直接加在Table标签上即可 -->
  13. <Table @action="baTable.onTableAction"/>
  14. </el-col>
  15. </el-row>
  16. <!-- 表单 -->
  17. <PopupForm ref="formRef"/>
  18. </div>
  19. </template>
  20. <script setup lang="ts">
  21. import {ref, onMounted, provide} from 'vue'
  22. import {orderExpress} from '/@/api/controllerUrls'
  23. import Table from '/@/components/table/index.vue'
  24. import TableHeader from '/@/components/table/header/index.vue'
  25. import {defaultOptButtons} from '/@/components/table'
  26. import PopupForm from './popupForm.vue'
  27. import {baTableApi} from '/@/api/common'
  28. import baTableClass from '/@/utils/baTable'
  29. const baTable = new baTableClass(
  30. new baTableApi(orderExpress),
  31. {
  32. dblClickNotEditColumn: [undefined, 'status'],
  33. column: [
  34. {type: 'selection', align: 'center', operator: false},
  35. {label: '所在区(县)', prop: 'expressName', align: 'left', operator: 'LIKE'},
  36. {label: '小区名称', prop: 'expressName', align: 'left', operator: 'LIKE'},
  37. {label: '楼号', prop: 'expressTypeName', align: 'center', operator: false},
  38. {label: '地图', prop: 'expressTypeName', align: 'center', operator: false},
  39. {label: '创建人', prop: 'creatorName', align: 'center', width: '120', operator: false},
  40. {label: '创建时间', prop: 'createTime', align: 'center', width: '160', operator: false},
  41. {
  42. label: '操作',
  43. align: 'center',
  44. width: '160',
  45. render: 'buttons',
  46. buttons: defaultOptButtons(),
  47. operator: false
  48. },
  49. ],
  50. },
  51. {
  52. defaultItems: {},
  53. },
  54. {
  55. // 获得编辑数据后
  56. requestEdit: () => {
  57. if (baTable.form.items && !baTable.form.items.icon) baTable.form.items.icon = 'el-icon-Minus'
  58. },
  59. }
  60. )
  61. provide('baTable', baTable)
  62. onMounted(() => {
  63. baTable.mount()
  64. baTable.getIndex()
  65. })
  66. </script>
  67. <style scoped lang="scss"></style>