OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <!-- |
| 3 Copyright 2017 The Chromium Authors. All rights reserved. |
| 4 Use of this source code is governed by a BSD-style license that can be |
| 5 found in the LICENSE file. |
| 6 --> |
| 7 <link rel="import" href="/components/polymer/polymer.html"> |
| 8 |
| 9 <link rel="import" href="/dashboard/static/simple_xhr.html"> |
| 10 |
| 11 <dom-module id="bug-details"> |
| 12 <style> |
| 13 .error { |
| 14 color: #dd4b39; |
| 15 font-weight: bold; |
| 16 } |
| 17 |
| 18 #loading-spinner { |
| 19 width: 100%; |
| 20 display: flex; |
| 21 justify-content: center; |
| 22 } |
| 23 |
| 24 .container { |
| 25 padding: 20px; |
| 26 background-color: #eaeaea; |
| 27 border-radius: 4px; |
| 28 margin: 20px; |
| 29 width: 600px; |
| 30 } |
| 31 |
| 32 .bordered-cell { |
| 33 border: 1px solid #a8a8a8; |
| 34 border-radius: 4px; |
| 35 } |
| 36 |
| 37 td { |
| 38 padding-left, padding-right: 10px; |
| 39 } |
| 40 </style> |
| 41 <template> |
| 42 <template is="dom-if" if="{{loading}}"> |
| 43 <div id="loading-spinner"><img src="//www.google.com/images/loading.gif"><
/div> |
| 44 </template> |
| 45 <template is="dom-if" if="{{!loading}}"> |
| 46 <table class="container"> |
| 47 <tr><th colspan="2">Bug <a href="http://crbug.com/{{bugId}}" target="_bl
ank">{{bugId}}</a></th></tr> |
| 48 <template is="dom-if" if="{{error}}"> |
| 49 <tr><td colspan="2" class="error">Could not load bug {{bugId}}. {{erro
r}}</td></tr> |
| 50 </template> |
| 51 <template is="dom-if" if="{{!error}}"> |
| 52 <tr><td colspan="2">{{summary}}</td></tr> |
| 53 <tr><td>Filed</td><td>{{formatDate(published)}}</td></tr> |
| 54 <tr><td>Owner</td><td>{{owner}}</td></tr> |
| 55 <tr><td>State</td><td>{{state}}</td></tr> |
| 56 <tr><td>Status</td><td>{{status}}</td></tr> |
| 57 <template is="dom-if" if="{{bisects.length}}"> |
| 58 <tr> |
| 59 <td class="bordered-cell">Bisects</td> |
| 60 <td class="bordered-cell"><ul><template is="dom-repeat" items="{{b
isects}}"> |
| 61 <li><a href="{{item.buildbucket_link}}">{{item.metric}} on {{ite
m.bot}}</a>: {{item.status}} |
| 62 </template></ul></td> |
| 63 </tr> |
| 64 </template> |
| 65 <template is="dom-if" if="{{reviewUrls.length}}"> |
| 66 <tr> |
| 67 <td class="bordered-cell">Changelists</td> |
| 68 <td class="bordered-cell"><ul><template is="dom-repeat" items="{{r
eviewUrls}}"> |
| 69 <li><a href="{{item}}">{{item}}</a> |
| 70 </template></ul></td> |
| 71 </tr> |
| 72 </template> |
| 73 </template> |
| 74 </table> |
| 75 </template> |
| 76 </template> |
| 77 <script> |
| 78 'use strict'; |
| 79 Polymer({ |
| 80 is: 'bug-details', |
| 81 properties: { |
| 82 bisects: { |
| 83 notify: true, |
| 84 type: Array |
| 85 }, |
| 86 bugId: { |
| 87 notify: true, |
| 88 type: Number |
| 89 }, |
| 90 comments: { |
| 91 notify: true, |
| 92 type: Array |
| 93 }, |
| 94 error: { |
| 95 notify: true, |
| 96 type: Boolean, |
| 97 value: false |
| 98 }, |
| 99 loading: { |
| 100 notify: true, |
| 101 type: Boolean, |
| 102 value: true |
| 103 }, |
| 104 owner: { |
| 105 notify: true, |
| 106 type: String |
| 107 }, |
| 108 published: { |
| 109 notify: true |
| 110 }, |
| 111 reviewUrls: { |
| 112 notify: true, |
| 113 type: Array |
| 114 }, |
| 115 state: { |
| 116 notify: true, |
| 117 type: String |
| 118 }, |
| 119 status: { |
| 120 notify: true, |
| 121 type: String |
| 122 }, |
| 123 summary: { |
| 124 notify: true, |
| 125 type: String |
| 126 } |
| 127 }, |
| 128 |
| 129 formatDate: d => d.getFullYear() + '-' + d.getMonth() + '-' + d.getDate(), |
| 130 |
| 131 attached: function() { |
| 132 var params = { |
| 133 'bug_id': this.bugId |
| 134 }; |
| 135 simple_xhr.send('/bug_details', params, |
| 136 response => { |
| 137 this.bisects = response['bisects']; |
| 138 this.comments = response['comments']; |
| 139 this.owner = response['owner']; |
| 140 this.published = new Date(response['published']); |
| 141 this.reviewUrls = response['review_urls']; |
| 142 this.state = response['state']; |
| 143 this.status = response['status']; |
| 144 this.summary = response['summary']; |
| 145 this.loading = false; |
| 146 }, |
| 147 errorMsg => { |
| 148 this.error = errorMsg; |
| 149 this.loading = false; |
| 150 }); |
| 151 } |
| 152 }); |
| 153 </script> |
| 154 </dom-module> |
OLD | NEW |