// <script>
import VueCodeDiff from "vue-code-diff";

export default {
  // 渲染
  render(h) {
    return h(
      "div",
      {
        // render函数配置项
        style: {
          overflow: "auto",
        },
      },
      [this.sideBySize(h)]
    );
  },
  // 数据
  data() {
    return {
      old_value:
        "蒋哥APICLOUD账号：\r\n17656640588\r\n294175748\r\nNVNavigationBar\r\ntimeSelector\r\ndb\r\nFNScanner\r\nUIPullRefresh\r\nFNPhotograph\r\nzxycamera\r\nUIListCheck\r\ntrans\r\nimageFilter\r\nphotoBrowser\r\ndocInteraction\r\nUICalendar\r\najpush\r\nmam",
      new_value:
        "今日工作计划\r\n================\r\n1.禅道Bug修正\r\n2.阅读项目源码--包括Web端和App端\r\n3.生产管理2.0版本App端等待接口联调\r\n4.Saas大屏\r\n5.长江润发问题解决\r\n\r\n今日工作总结\r\n================\r\n1.SaaS大屏播放页面完成\r\n2.SaaS大屏播放模块接口绑定完成\r\n3.生产管理-计划内派工-终止-去掉多选框，点击终止直接终止所有\r\n4.生产管理-工单任务一览-查看进度-列表数据一行显示，鼠标悬浮显示全部信息，禁止折行\r\n5.生产管理-生产报工记录-修改禁止修改开始时间和结束时间\r\n6.生产管理-生产报工记录-列表报工时间显示到时分秒\r\n7.生产管理-计划内派工-列表完成率加上单位%\r\n8.生产管理-计划外派工-搜索栏将派工日期范围修改为创建时间\r\n9.生产管理-生产报工记录-查询添加时间修改为报工时间，且默认值设置为最近七天\r\n10.生产管理-生产报工记录-查询报工人员参数绑定错误修正\r\n11.生产管理-计划外派工-搜索栏将执行人员修改为实际执行人\r\n12.生产管理-计划外派工-作废将弹出框中的删除都替换成作废\r\n13.生产管理-计划外派工-新增任务设置班组为必填项且设置必填项提示信息\r\n14.生产管理-计划外派工-新增任务设置为每次打开弹框都清空上一次的输入记录\r\n15.生产管理-计划外派工-新增任务限制任务名称和任务内容字数，且在输入框右下角设置字数提示\r\n16.生产管理-计划外派工-新增任务限制预计工时不能输入负数、小数和0\r\n17.\r\n  \r\n明日工作计划\r\n================\r\n1.禅道Bug修正\r\n2.阅读项目源码--包括Web端和App端\r\n3.生产管理2.0版本App端接口联调\r\n4.长江润发问题解决今日工作计划\r\n================\r\n1.禅道Bug修正\r\n2.阅读项目源码--包括Web端和App端\r\n3.生产管理2.0版本App端等待接口联调\r\n4.Saas大屏\r\n5.长江润发问题解决\r\n\r\n今日工作总结\r\n================\r\n1.SaaS大屏播放页面完成\r\n2.SaaS大屏播放模块接口绑定完成\r\n3.生产管理-计划内派工-终止-去掉多选框，点击终止直接终止所有\r\n4.生产管理-工单任务一览-查看进度-列表数据一行显示，鼠标悬浮显示全部信息，禁止折行\r\n5.生产管理-生产报工记录-修改禁止修改开始时间和结束时间\r\n6.生产管理-生产报工记录-列表报工时间显示到时分秒\r\n7.生产管理-计划内派工-列表完成率加上单位%\r\n8.生产管理-计划外派工-搜索栏将派工日期范围修改为创建时间\r\n9.生产管理-生产报工记录-查询添加时间修改为报工时间，且默认值设置为最近七天\r\n10.生产管理-生产报工记录-查询报工人员参数绑定错误修正\r\n11.生产管理-计划外派工-搜索栏将执行人员修改为实际执行人\r\n12.生产管理-计划外派工-作废将弹出框中的删除都替换成作废\r\n13.生产管理-计划外派工-新增任务设置班组为必填项且设置必填项提示信息\r\n14.生产管理-计划外派工-新增任务设置为每次打开弹框都清空上一次的输入记录\r\n15.生产管理-计划外派工-新增任务限制任务名称和任务内容字数，且在输入框右下角设置字数提示\r\n16.生产管理-计划外派工-新增任务限制预计工时不能输入负数、小数和0\r\n17.\r\n  \r\n明日工作计划\r\n================\r\n1.禅道Bug修正\r\n2.阅读项目源码--包括Web端和App端\r\n3.生产管理2.0版本App端接口联调\r\n4.长江润发问题解决",
      context: 1000,
    };
  },
  // 方法
  methods: {
    // 左右对比
    sideBySize(h) {
      return h(
        "div",
        {
          style: {
            height: "500px",
            overflow: "auto",
          },
        },
        [
          h(VueCodeDiff, {
            props: {
              oldString: this.old_value,
              newString: this.new_value,
              context: this.context,
              outputFormat: "side-by-side",
            },
          }),
        ]
      );
    },
    // 上下对比
    lineByLine(h) {
      return h(
        "div",
        {
          // render函数配置项
        },
        [
          h(
            "div",
            {
              staticClass: "",
            },
            ["一页显示对比结果，效果如下所示："]
          ),
          h(VueCodeDiff, {
            props: {
              oldString: this.old_value,
              newString: this.new_value,
              context: this.context,
              outputFormat: "line-by-line",
            },
          }),
        ]
      );
    },
  },
};
</script>



