tfp/src/components/barcode/controller.js

A Web UI framework for TaskBuilder

import { VisibleComponent } from "../controller.js";
// 可视组件  
// 不可视组件

/**
 * 二维码组件
 * @param {[type]} dataModel [description]
 */
export default class BarCode extends VisibleComponent {

  // 全局组件tfp     数据模型   上级组件 最上层的是窗口 

  constructor(__tfp, dataModel, parent) {
    super(__tfp, "BarCode", dataModel, parent);
  }


  get text () { return this.dataModel.text }
  set text (value) {
    this.dataModel.text = value;
  }

  get width () { return this.dataModel.width }
  set width (value) {
    this.dataModel.width = value;
    if (this._jqObj) {  //
      this._jqObj.css("width", value + "px");
    }
  }

  get height () { return this.dataModel.height }
  set height (value) {
    this.dataModel.height = value;
    if (this._jqObj) {  //指向当前组件   编译时没有
      this._jqObj.css("height", value + "px"); // jqery 当前Dom 选择器
    }
  }
  get displayValue () { return this.dataModel.displayValue }
  set displayValue (value) {
    this.dataModel.displayValue = value;
  }


  get textAlign () { return this.dataModel.textAlign }
  set textAlign (value) {
    this.dataModel.textAlign = value;
  }
  get textPosition () { return this.dataModel.textPosition }
  set textPosition (value) {
    this.dataModel.textPosition = value;
  }
  get fontSize () { return this.dataModel.fontSize }
  set fontSize (value) {
    this.dataModel.fontSize = value;
  }
  get background () { return this.dataModel.background }
  set background (value) {
    this.dataModel.background = value;
  }
  get lineColor () { return this.dataModel.lineColor }
  set lineColor (value) {
    this.dataModel.lineColor = value;
  }
  get margin () { return this.dataModel.margin }
  set margin (value) {
    this.dataModel.margin = value;
  }


  // 初始化 运行时   页面渲染完成执行
  initRuntime () {
    var that = this;
    let txt = this.dataModel.text;
    if (!txt) {
      txt = "taskbuilder"
    }
    if (that.dataModel.margin) { that.dataModel.margin = parseInt(that.dataModel.margin) }
    JsBarcode(that.el, txt, {
      format: "CODE39",//选择要使用的条形码类型
      width: 3,//设置条之间的宽度
      height: that.dataModel.height,//高度
      displayValue: that.dataModel.displayValue,//是否在条形码下方显示文字
      text: txt,//覆盖显示的文本
      // fontOptions: "bold italic",//使文字加粗体或变斜体
      font: "fantasy",//设置文本的字体
      textAlign: that.dataModel.textAlign,//设置文本的水平对齐方式
      textPosition: that.dataModel.textPosition,//设置文本的垂直位置
      textMargin: 5,//设置条形码和文本之间的间距
      fontSize: that.dataModel.fontSize,//设置文本的大小
      background: that.dataModel.background,//设置条形码的背景
      lineColor: that.dataModel.lineColor,//设置条和文本的颜色。
      margin: that.dataModel.margin
    });


    this._jqObj.click(function () {
      if (that.dataModel.onClick) {
        eval(that.dataModel.onClick)
      }
    })
    this._jqObj.click(function () {
      if (that.dataModel.onMouseOver) {
        eval(that.dataModel.onMouseOver)
      }
    })
    this._jqObj.click(function () {
      if (that.dataModel.onMouseOut) {
        eval(that.dataModel.onMouseOut)
      }
    })
  }

}