thingsboard 自定义静态部件

需要弄一个能发送http请求的组件，在源代码里捣鼓一圈，但是对angular实在不熟悉，最后还是在平台里创建吧

html:

<div class="cmBtns box">
    <h4 id="btnTitle" class="btnTitle">{{labelTitle}}</h4>
    <button id="btnOn" ng-click="deviceControl('on')"  class="simpleBtn">开</button>
    <button id="btnOff" ng-click="deviceControl('off')"  class="simpleBtn">关</button>
    <video preload="auto" name="media" hidden="true" class="myVideo">
        <source src="http://www.szqhhjbj.com/aigei_pao.mp3" type="audio/mpeg">
    </video>
</div>

css:

.box {
    text-align: center;
}

.simpleBtn {
    width: 90%;
    padding: 8px 0;
    background: #305680;
    border-radius: 10px;
    border: none;
    color:#fff;
    margin-bottom: 10px;
}
.simpleBtn:hover,.simpleBtn:active {
    background: #4171a7;
}
.btnTitle{margin-top:0;margin-bottom:0; font-size:20px;}

设置模式：

{

    "schema": {

        "type": "object",
        "title": "Settings",
        "properties": {
            "deviceId":{
                "title":"设备id",
                "type":"string"
            },
            "btntype":{
                "title":"是否批量(默认否)",
                "type":"boolean",
                "default":false
            },
            "labelTitle": {
                "title": "标题文字",
                "type": "string",
                "default": "标题文字"
            }
        },
        "required": ["deviceId"]
    },
    "form": [
        "btntype",
        "deviceId",
        "labelTitle"
    ]
}

js:

self.onInit = function() {
    var scope = self.ctx.$scope;
     
    self.ctx.$scope.labelTitle = self.ctx.settings.labelTitle || '标题文字';

    scope.deviceControl = function(status) { 
        var baseurl = "http://192.168.1.17:6405/service/code/action";
        var url="";
        var btnType = self.ctx.settings.btntype;
        var deviceId = self.ctx.settings.deviceId;
        if (deviceId) {
            if (btnType) {
                url = baseurl + "/batch?id=" +deviceId + "&cmd=" + status;
            } else {
                url = baseurl + "/single?id=" +deviceId + "&cmd=" + status;
            }
        }
        $('.myVideo')[0].load();
        $('.myVideo')[0].play();

        var xhr = new XMLHttpRequest();

        xhr.open('GET',url,true);
        xhr.send(null);
        //return promise
        return new Promise(function (resolve, reject) {
            //onload are executed just after the sync request is comple，
            //please use 'onreadystatechange' if need support IE9-
            xhr.onload = function () {
                if (xhr.status === 200) {
                    var result;
                    try {
                        result = JSON.parse(xhr.response);
                    } catch (e) {
                        result = xhr.response;
                    }
                    resolve(result);
                } else {
                    reject(xhr.response);
                }
            };

        });
        
    };
    
}