Jira小工具插件-Javascript DRY

我在gadget xml文件中看到，我在其中编写视图部分来创建图表，每个gadget的代码总是相同的，是否可以更清楚地说明这一点？比如创建要导入的外部Javascript文件？外部文件的问题可能是获取数据

代码如下：

view: {
                        enableReload: true,
                        onResizeReload: true,
                        onResizeAdjustHeight: true,
                        template: function (args) {
                            var gadget = this;
                            gadget.getView().empty();
                            gadget.projectOrFilterName = args.chart.filterName;

                            var container = AJS.$("<div id='chart_div'/>");
                            gadget.getView().append(container);

                            if(args.chart.data && args.chart.data.length > 0) {
                                var data = new google.visualization.DataTable();
                                data.addColumn('string', this.getMsg("gadget.user.activity.time.label"));
                                data.addColumn('number', this.getMsg("gadget.user.activity.issues.solving.label"));
                                data.addColumn('number', this.getMsg("gadget.user.activity.sum.label"));
                                data.addRows(args.chart.data);

                                switch(gadget.getPref("chartType"))
                                {
                                    case "ColumnChart":
                                        var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
                                        break;
                                    case "AreaChart":
                                        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
                                        break;
                                    case "LineChart":
                                        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
                                        break;
                                }

                                var width = gadgets.window.getViewportDimensions().width;
                                var height = width * 3/4;
                                chart.draw(
                                    data,
                                    {width: width, height: height,
                                    curveType: "function",
                                    legend: 'bottom',
                                    backgroundColor:{fill:'#DDE8FF'},
                                    vAxis: {  textStyle:{fontSize:10},
                                            baseline:0,
                                            baselineColor:'#9F0000'},
                                    hAxis: {textStyle:{fontSize:10},
                                            slantedText:'true',
                                            slantedTextAngle:45},
                                    colors:['#566D7E','orange'],
                                    fontName:'Trebuchet MS',
                                    pointSize: 2
                                });
                            }
                            else {
                                gadget.getView().append("<p>No Data available</p>");
                            }

                            gadget.resize();
                        },

视图：{
enableReload:true，
真的，
onResizeAdjustHeight:真，
模板：函数（args）{
var gadget=this；
gadget.getView（）.empty（）；
gadget.projectOrFilterName=args.chart.filterName；
var容器=AJS.$（“”）；
gadget.getView（）.append（容器）；
if（args.chart.data&&args.chart.data.length>0）{
var data=new google.visualization.DataTable（）；
data.addColumn（'string'，this.getMsg（“gadget.user.activity.time.label”）；
data.addColumn（'number'，this.getMsg（“gadget.user.activity.issues.solving.label”）；
data.addColumn（'number'，this.getMsg（“gadget.user.activity.sum.label”）；
data.addRows（args.chart.data）；
开关（gadget.getPref（“chartType”））
{
案例“柱形图”：
var chart=new google.visualization.ColumnChart（document.getElementById（'chart_div'））；
打破
案例“区域图”：
var chart=new google.visualization.AreaChart（document.getElementById（'chart_div'））；
打破
案例“线形图”：
var chart=new google.visualization.LineChart（document.getElementById（'chart_div'））；
打破
}
var width=gadgets.window.getViewportDimensions（）.width；
变量高度=宽度*3/4；
图表绘制(
数据，
{宽度：宽度，高度：高度，
curveType：“函数”，
图例：“底部”，
背景色：{fill:'#DDE8FF'}，
变量：{textStyle:{fontSize:10}，
基线：0，
基线颜色：'#9F0000'}，
hAxis:{textStyle:{fontSize:10}，
倾斜文字：'true'，
倾斜角度：45}，
颜色：['566D7E'，'orange']，
fontName:‘投石机MS’，
点数：2
});
}
否则{
gadget.getView（）.append（“无可用数据”
”；
}
gadget.resize（）；
},

您应该在atlassian-plugin.xml中包含自己的JS，如下所示：

  <!-- GADGET WEB RESOURCES -->
  <web-resource key="resources">
    <resource type="download" name="javascript/common.js" location="javascript/MyCustomLibrary.js">
      <property key="content-type" value="text/javascript"/>
    </resource>
    <!-- ... -->
  </web-resource>

最后，从gadget对象视图部分调用JS函数：

CustomFunction(gadget, data);

希望能帮助你， 问候

CustomFunction(gadget, data);