detail.vue 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <div id="detail">
  3. <el-row>
  4. <el-col :span="24" class="main animate__animated animate__backInRight">
  5. <el-col :span="24" class="one">
  6. <data-form :fields="fields" :data="form" @save="toSave" returns="/adminCenter/test/index"> </data-form>
  7. </el-col>
  8. </el-col>
  9. </el-row>
  10. </div>
  11. </template>
  12. <script>
  13. import { mapState, createNamespacedHelpers } from 'vuex';
  14. const { mapActions: maptest } = createNamespacedHelpers('test');
  15. export default {
  16. name: 'detail',
  17. props: {},
  18. components: {},
  19. data: function () {
  20. return {
  21. form: {
  22. img_url: [],
  23. },
  24. fields: [
  25. { label: '标题', model: 'title' },
  26. { label: '内容', model: 'content', type: 'editor', url: '/files/study/news_editor/upload' },
  27. ],
  28. };
  29. },
  30. created() {
  31. if (this.id) this.search();
  32. },
  33. methods: {
  34. ...maptest(['fetch', 'create', 'update']),
  35. async search() {
  36. let res = await this.fetch(this.id);
  37. if (this.$checkRes(res)) {
  38. this.$set(this, `form`, res.data);
  39. }
  40. },
  41. async toSave({ data }) {
  42. let dup = _.cloneDeep(data);
  43. let res;
  44. if (_.get(dup, 'id')) {
  45. res = await this.update(dup);
  46. } else {
  47. res = await this.create(dup);
  48. }
  49. if (this.$checkRes(res, '保存成功', '保存失败')) {
  50. if (this.$dev_mode) this.$router.push('/adminCenter/test/index');
  51. }
  52. },
  53. },
  54. computed: {
  55. ...mapState(['user']),
  56. id() {
  57. return this.$route.query.id;
  58. },
  59. },
  60. metaInfo() {
  61. return { title: this.$route.meta.title };
  62. },
  63. watch: {
  64. test: {
  65. deep: true,
  66. immediate: true,
  67. handler(val) {},
  68. },
  69. },
  70. };
  71. </script>
  72. <style lang="less" scoped></style>