github.com/v2pro/plz@v0.0.0-20221028024117-e5f9aec5b631/witch/webroot/snapshots.html (about)

     1  <script type="text/x-template" id="snapshots-template">
     2  <div>
     3      <el-button @click="pollCurrentState" style="margin-bottom: 8px;">Poll Current State</el-button>
     4      <div v-for="snapshot in snapshots" @click="selectSnapshot(snapshot)"
     5           :class="snapshot.is_selected ? 'selected-snapshot' : ''">
     6          {{ formatTimestamp(snapshot.timestamp) }}
     7      </div>
     8  </div>
     9  </script>
    10  <style>
    11      .selected-snapshot {
    12          background: #ADD8E6;
    13      }
    14  </style>
    15  <script>
    16      Vue.component('snapshots', {
    17          template: '#snapshots-template',
    18          props: ['selectedSnapshot'],
    19          data: function () {
    20              return {
    21                  snapshots: [],
    22              };
    23          },
    24          methods: {
    25              pollCurrentState: function() {
    26                  var me = this;
    27                  axios.get(window.location.href + '/expvar?ts=' + Date.now())
    28                      .then(function (resp) {
    29                          var snapshot = {timestamp: new Date(), data: resp.data, is_selected:false};
    30                          me.snapshots = [snapshot].concat(me.snapshots);
    31                          me.selectSnapshot(snapshot);
    32                      });
    33              },
    34              formatTimestamp: function(val) {
    35                  return val.getHours() + ':' + val.getMinutes() + ':' + val.getSeconds() + '.' + val.getMilliseconds();
    36              },
    37              selectSnapshot: function(snapshot) {
    38                  for (var i in this.snapshots) {
    39                      if (this.snapshots[i] === snapshot) {
    40                          this.snapshots[i].is_selected = true;
    41                      } else {
    42                          this.snapshots[i].is_selected = false;
    43                      }
    44                  }
    45                  this.$emit('update:selectedSnapshot', snapshot);
    46              }
    47          }
    48      });
    49  </script>