<template>
  <div>
    <pre class="code language-java line-numbers" v-html="html"></pre>
    <el-button ref="btnCopy" type="info" style="position: absolute; top: 20px; right: 10px;">复制</el-button>
  </div>
</template>

<script>
import Prism from 'prismjs';
import 'prismjs/components/prism-java';
import FpCodeMixin from './FpCodeMixin';

export default {
  name: "FpCodeJava",
  mixins: [FpCodeMixin],
  computed: {
    html() {
      return Prism.highlight(this.code(), Prism.languages.java, 'java');
    }
  },
  methods: {
    code() {
      let c1 = ''
      this.items.forEach(e => {
        if (!e.vd) {
          return
        }
        c1 += `        params.put("${e.vd}", "${e.v.replace("\n", "\\n")}");\n`
      })
      c1 = c1 || '        // 暂未指定任何动态参数\n'

      let c = `import net.fastposter.client.FastposterClient;
import java.util.*;

public class FastposterClientDemo {

    public static void main(String[] args) {

        // 如需进一步了解，请参考开发文档 https://cloud.fastposter.net/doc/sdk/

        // 1.创建海报客户端对象
        FastposterClient client = FastposterClient.builder()
                .token("${this.token}")     // 设置token
                .endpoint("${this.apiUrl}")
                .build();

        // 2.准备海报参数（从实际业务系统中获取）
        Map<String, Object> params = new HashMap<>();
${c1}

        // 3.生成海报并保存(提供图片流、二进制、base64等多种方式)
        client.buildPoster("${this.posterId || '未生成'}").params(params).build().save("demo.png");

    }
}`
      return c
    }
  }
}
</script>


<style scoped>

.code {
  text-align: left;
  overflow: auto;
  user-select: text;
  cursor: text;
  height: 500px;
  font-size: 13px;
}

</style>