// frozen_string_literal: true

document.addEventListener('DOMContentLoaded', function() {
  if (document.getElementById('dashboard-app')) {
    new Vue({
      el: '#dashboard-app',
      data: function() {
        return {
          dashboardData: {
            devices: { total: 0 },
            tasks: { total: 0, pending: 0, running: 0, list: [] },
            cache: { total_scripts: 0, cache_size_human: '0 B' },
            logs: { total: 0, recent: [] }
          },
          taskForm: {
            natural_language: ''
          },
          creatingTask: false
        };
      },
      mounted: function() {
        this.fetchDashboardData();
      },
      methods: {
        fetchDashboardData: function() {
          var self = this;
          fetch('/api/dashboard')
            .then(function(response) { return response.json(); })
            .then(function(data) {
              self.dashboardData = data;
            })
            .catch(function(error) {
              console.error('获取仪表板数据失败:', error);
            });
        },
        formatTime: function(timestamp) {
          var date = new Date(timestamp);
          var month = String(date.getMonth() + 1).padStart(2, '0');
          var day = String(date.getDate()).padStart(2, '0');
          var hours = String(date.getHours()).padStart(2, '0');
          var minutes = String(date.getMinutes()).padStart(2, '0');
          return month + '-' + day + ' ' + hours + ':' + minutes;
        },
        getStatusType: function(status) {
          var types = {
            'completed': 'success',
            'running': 'info',
            'failed': 'danger',
            'pending': 'warning'
          };
          return types[status] || 'info';
        },
        createTask: function() {
          if (!this.taskForm.natural_language.trim()) {
            this.$message.warning('请输入自然语言指令');
            return;
          }
          
          var self = this;
          this.creatingTask = true;
          
          var formData = new FormData();
          formData.append('natural_language', this.taskForm.natural_language);
          
          fetch('/tasks/natural', {
            method: 'POST',
            body: formData
          })
          .then(function(response) {
            if (response.redirected) {
              window.location.href = response.url;
            } else {
              self.$message.error('创建任务失败');
            }
          })
          .catch(function(error) {
            console.error('创建任务失败:', error);
            self.$message.error('创建任务失败');
          })
          .finally(function() {
            self.creatingTask = false;
          });
        },
        startTask: function(taskId) {
          var self = this;
          var formData = new FormData();
          
          fetch('/tasks/' + taskId + '/start', {
            method: 'POST',
            body: formData
          })
          .then(function(response) {
            if (response.redirected) {
              window.location.href = response.url;
            } else {
              self.$message.success('任务已启动');
              self.fetchDashboardData();
            }
          })
          .catch(function(error) {
            console.error('启动任务失败:', error);
            self.$message.error('启动任务失败');
          });
        }
      }
    });
  }
});
