<template />

<script>
export default {
  name: 'ApDevItemBase',
  data() {
    return {
      template: '',
      import: '',
      components: '',
      data: '',
      created: '',
      methods: ''
    }
  },
  watch: {
    template(val) {
      this.initContent()
    },
    import(val) {
      this.initContent()
    },
    components(val) {
      this.initContent()
    },
    data(val) {
      this.initContent()
    },
    created(val) {
      this.initContent()
    },
    methods(val) {
      this.initContent()
    }
  },
  methods: {
    initContent() {
      const templateStr = '<template>\n' +
                    '    @template@\n' +
                    '</template>'
      const jsStr = '\n\n<script>\n' +
                    '    @import@export default {\n' +
                    '        name: "test",\n' +
                    '        @components@data() {\n' +
                    '            return @data@\n' +
                    '        },\n' +
                    '        @created@methods: @methods@\n' +
                    '    }\n' +
                    '<' + '/script>'
      const res = templateStr.replaceAll('@template@', this.template) +
                    jsStr.replaceAll('@import@', this.import)
                      .replaceAll('@components@', this.components)
                      .replaceAll('@data@', this.data)
                      .replaceAll('@created@', this.created)
                      .replaceAll('@methods@', this.methods)

      this.$emit('dataChange', res)
    },
    // 模版替换
    replaceTemplate(key, value) {
      this.template = this.template.replaceAll(key, value)
    },
    // import替换
    replaceImport(key, value) {
      this.import = this.import.replaceAll(key, value)
    },
    // components替换
    replaceComponents(key, value) {
      this.components = this.components.replaceAll(key, value)
    },
    // data替换
    replaceData(key, value) {
      this.data = this.data.replaceAll(key, value)
    },
    // created替换
    replaceCreated(key, value) {
      this.created = this.created.replaceAll(key, value)
    },
    // 方法替换
    replaceMethods(key, value) {
      this.methods = this.methods.replaceAll(key, value)
    }
  }

}
</script>

<style scoped>

</style>
