index.vue 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <template>
  2. <div>
  3. <div class="search-term">
  4. <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
  5. <el-form-item label="表名">
  6. <el-input v-model="searchInfo.tableName" placeholder="表名" />
  7. </el-form-item>
  8. <el-form-item label="结构体名称">
  9. <el-input v-model="searchInfo.tableName" placeholder="结构体名称" />
  10. </el-form-item>
  11. <el-form-item>
  12. <el-button size="mini" type="primary" icon="el-icon-plus" @click="goAutoCode">新增</el-button>
  13. </el-form-item>
  14. </el-form>
  15. </div>
  16. <el-table :data="tableData" border stripe>
  17. <el-table-column
  18. type="selection"
  19. width="55"
  20. />
  21. <el-table-column label="id" width="60" prop="ID" />
  22. <el-table-column label="日期" width="180">
  23. <template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
  24. </el-table-column>
  25. <el-table-column label="结构体名" min-width="150" prop="tableName" />
  26. <el-table-column label="表名称" min-width="150" prop="tableName" />
  27. </el-table>
  28. <el-pagination
  29. :current-page="page"
  30. :page-size="pageSize"
  31. :page-sizes="[10, 30, 50, 100]"
  32. :style="{float:'right',padding:'20px'}"
  33. :total="total"
  34. layout="total, sizes, prev, pager, next, jumper"
  35. @current-change="handleCurrentChange"
  36. @size-change="handleSizeChange"
  37. />
  38. </div>
  39. </template>
  40. <script>
  41. // 获取列表内容封装在mixins内部 getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
  42. import { getSysHistory } from '@/api/autoCode.js'
  43. import { formatTimeToStr } from '@/utils/date'
  44. import infoList from '@/mixins/infoList'
  45. export default {
  46. name: 'Api',
  47. filters: {
  48. formatDate: function(time) {
  49. if (time !== null && time !== '') {
  50. var date = new Date(time)
  51. return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
  52. } else {
  53. return ''
  54. }
  55. },
  56. formatBoolean: function(bool) {
  57. if (bool !== null) {
  58. return bool ? '是' : '否'
  59. } else {
  60. return ''
  61. }
  62. }
  63. },
  64. mixins: [infoList],
  65. data() {
  66. return {
  67. listApi: getSysHistory
  68. }
  69. },
  70. created() {
  71. this.getTableData()
  72. },
  73. methods: {
  74. goAutoCode() {
  75. this.$router.push({ name: 'autoCode' })
  76. }
  77. }
  78. }
  79. </script>
  80. <style scoped lang="scss">
  81. .button-box {
  82. padding: 10px 20px;
  83. .el-button {
  84. float: right;
  85. }
  86. }
  87. .el-tag--mini {
  88. margin-left: 5px;
  89. }
  90. .warning {
  91. color: #dc143c;
  92. }
  93. </style>