noticetpl.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <template>
  2. <div>
  3. <el-table
  4. :data="data"
  5. style="width: 100%">
  6. <el-table-column type="expand">
  7. <div slot-scope="{row}" class="nexpand" v-html="row.contents"></div>
  8. </el-table-column>
  9. <el-table-column label="简码" prop="jm" />
  10. <el-table-column label="说明" prop="remark" />
  11. <el-table-column label="标题">
  12. <span slot-scope="{row}" v-html="row.titles"></span>
  13. </el-table-column>
  14. <el-table-column label="操作" :width="100">
  15. <el-button slot-scope="{row}" size="mini" type="info" @click="edit(row)">修改</el-button>
  16. </el-table-column>
  17. </el-table>
  18. <tpl-edit ref="edit" @reload="load" />
  19. </div>
  20. </template>
  21. <script>
  22. import tplEdit from './tplEdit'
  23. export default {
  24. data() {
  25. return {
  26. data: []
  27. }
  28. },
  29. methods: {
  30. load () {
  31. this.$http.get('noticetpl').then(data => {
  32. this.data = data
  33. }, err => {})
  34. },
  35. edit (row) {
  36. this.$refs.edit.show(row)
  37. }
  38. },
  39. created () {
  40. this.load()
  41. },
  42. components: {tplEdit}
  43. }
  44. </script>
  45. <style scoped>
  46. .nexpand{white-space: pre-wrap;}
  47. </style>