vue_delayed_job_dashboard 0.1.1 → 0.1.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +44 -0
- data/Rakefile +6 -0
- data/lib/vue_delayed_job_dashboard/version.rb +3 -0
- data/lib/vue_delayed_job_dashboard/web/app.rb +62 -0
- data/lib/vue_delayed_job_dashboard/web/priv/App.vue +52 -0
- data/lib/vue_delayed_job_dashboard/web/priv/JobsList.vue +144 -0
- data/lib/vue_delayed_job_dashboard/web/priv/app.js +14 -0
- data/lib/vue_delayed_job_dashboard/web/public/b02bdc1b846fd65473922f5f62832108.ttf +0 -0
- data/lib/vue_delayed_job_dashboard/web/public/bundle.js +63960 -0
- data/lib/vue_delayed_job_dashboard/web/public/d2f69a92faa6fe990d2e613c358be705.woff +0 -0
- data/lib/vue_delayed_job_dashboard/web/views/enqueued.haml +0 -0
- data/lib/vue_delayed_job_dashboard/web/views/error.haml +2 -0
- data/lib/vue_delayed_job_dashboard/web/views/failed.haml +1 -0
- data/lib/vue_delayed_job_dashboard/web/views/layout.haml +16 -0
- data/lib/vue_delayed_job_dashboard/web/views/overview.haml +1 -0
- data/lib/vue_delayed_job_dashboard/web/views/pending.haml +1 -0
- data/lib/vue_delayed_job_dashboard/web/views/working.haml +1 -0
- data/lib/vue_delayed_job_dashboard.rb +2 -0
- metadata +20 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 48f4fa220093d565e3e111f261b0e91ed7ed6b20
|
4
|
+
data.tar.gz: e8886096e1bc75e96959eebcf2abd1a20dfb0506
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 6fa9f09a8913719a29ab2b7d9fbde7540afb7cee50b0bcf8b22f5b2983f4b016329d34f2d284e528997699a99f50666782b16a809fc2a39ea6c46a2de0e982ac
|
7
|
+
data.tar.gz: 272ed1b5a6c948cbf1eb57a281a4a604e87c5b54b24685ddaf38d389189b751ded0cd7a0875c7af1442285514687af8b95a7ec706c9ba61b06344e59fb86929e
|
data/README.md
ADDED
@@ -0,0 +1,44 @@
|
|
1
|
+
# Vue Delayed Job Dashboard
|
2
|
+
|
3
|
+
![screenshot1](https://cloud.githubusercontent.com/assets/2282642/24837740/2de53704-1d65-11e7-89dc-8d8fe85e093f.png)
|
4
|
+
|
5
|
+
![screenshot2](https://cloud.githubusercontent.com/assets/2282642/24837741/309915e2-1d65-11e7-92fa-239a729709f7.png)
|
6
|
+
|
7
|
+
## Installation
|
8
|
+
|
9
|
+
Add this line to your application's Gemfile:
|
10
|
+
|
11
|
+
```ruby
|
12
|
+
gem 'vue_delayed_job_dashboard'
|
13
|
+
```
|
14
|
+
|
15
|
+
And then execute:
|
16
|
+
|
17
|
+
$ bundle
|
18
|
+
|
19
|
+
Or install it yourself as:
|
20
|
+
|
21
|
+
$ gem install vue_delayed_job_dashboard
|
22
|
+
|
23
|
+
## Usage
|
24
|
+
|
25
|
+
Add the following line to top of `route.rb`
|
26
|
+
|
27
|
+
```ruby
|
28
|
+
mount VueDelayedJobDashboard::WebApplication => '/delayed_job'
|
29
|
+
```
|
30
|
+
|
31
|
+
## Development
|
32
|
+
|
33
|
+
After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
|
34
|
+
|
35
|
+
To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
|
36
|
+
|
37
|
+
## Contributing
|
38
|
+
|
39
|
+
Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/vue_delayed_job_dashboard. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
|
40
|
+
|
41
|
+
|
42
|
+
## License
|
43
|
+
|
44
|
+
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
data/Rakefile
ADDED
@@ -0,0 +1,62 @@
|
|
1
|
+
require 'sinatra/base'
|
2
|
+
|
3
|
+
module VueDelayedJobDashboard
|
4
|
+
class WebApplication < Sinatra::Base
|
5
|
+
set :root, File.dirname(__FILE__)
|
6
|
+
set :static, true
|
7
|
+
set :public_folder, File.expand_path('../public', __FILE__)
|
8
|
+
set :views, File.expand_path('../views', __FILE__)
|
9
|
+
|
10
|
+
get "/" do
|
11
|
+
redirect "/delayed_job/overview"
|
12
|
+
end
|
13
|
+
|
14
|
+
get '/overview' do
|
15
|
+
if defined?(Delayed::Job)
|
16
|
+
haml :overview, escape_html: false
|
17
|
+
else
|
18
|
+
@message = "Delayed::Job is not available"
|
19
|
+
haml :error
|
20
|
+
end
|
21
|
+
end
|
22
|
+
|
23
|
+
get '/enqueued' do
|
24
|
+
haml :enqueued, escape_html: false
|
25
|
+
end
|
26
|
+
|
27
|
+
get '/pending' do
|
28
|
+
haml :pending, escape_html: false
|
29
|
+
end
|
30
|
+
|
31
|
+
get '/failed' do
|
32
|
+
haml :failed, escape_html: false
|
33
|
+
end
|
34
|
+
|
35
|
+
get '/working' do
|
36
|
+
haml :working, escape_html: false
|
37
|
+
end
|
38
|
+
|
39
|
+
get '/jobs.json' do
|
40
|
+
content_type :json
|
41
|
+
|
42
|
+
case params["filter"]
|
43
|
+
when "pending"
|
44
|
+
@jobs = Delayed::Job.where(locked_at: nil, attempts: 0).order(created_at: :desc)
|
45
|
+
when "failed"
|
46
|
+
@jobs = Delayed::Job.where.not(failed_at: nil).order(created_at: :desc)
|
47
|
+
when "working"
|
48
|
+
@jobs = Delayed::Job.where.not(locked_at: nil).order(created_at: :desc)
|
49
|
+
when "enqueued"
|
50
|
+
@jobs = Delayed::Job.order(created_at: :desc)
|
51
|
+
end
|
52
|
+
|
53
|
+
@jobs = Delayed::Job.order(created_at: :desc) if @jobs.nil?
|
54
|
+
|
55
|
+
@jobs_json = @jobs.as_json
|
56
|
+
@jobs_json.each_with_index do |job, index|
|
57
|
+
job["payload_object"] = @jobs[index].payload_object
|
58
|
+
end
|
59
|
+
@jobs_json.to_json
|
60
|
+
end
|
61
|
+
end
|
62
|
+
end
|
@@ -0,0 +1,52 @@
|
|
1
|
+
<template>
|
2
|
+
<el-row>
|
3
|
+
<el-menu theme="dark" :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
|
4
|
+
<el-menu-item index="1"><a href="/delayed_job/overview">DELAYED JOB DASHBOARD</a></el-menu-item>
|
5
|
+
<el-menu-item index="2"><a href="/delayed_job/enqueued">Enqueued</a></el-menu-item>
|
6
|
+
<el-menu-item index="3"><a href="/delayed_job/working">Working</a></el-menu-item>
|
7
|
+
<el-menu-item index="4"><a href="/delayed_job/pending">Pending</a></el-menu-item>
|
8
|
+
<el-menu-item index="5"><a href="/delayed_job/failed">Failed</a></el-menu-item>
|
9
|
+
</el-menu>
|
10
|
+
|
11
|
+
<el-col :span="24">
|
12
|
+
<jobs-list></jobs-list>
|
13
|
+
</el-col>
|
14
|
+
</el-row>
|
15
|
+
</template>
|
16
|
+
|
17
|
+
<script>
|
18
|
+
import JobsList from './JobsList.vue'
|
19
|
+
|
20
|
+
export default {
|
21
|
+
data () {
|
22
|
+
return {
|
23
|
+
activeIndex: '1'
|
24
|
+
}
|
25
|
+
},
|
26
|
+
|
27
|
+
created () {
|
28
|
+
let path = window.location.pathname;
|
29
|
+
if (path.includes("overview")) {
|
30
|
+
this.activeIndex = '1'
|
31
|
+
} else if (path.includes("enqueued")) {
|
32
|
+
this.activeIndex = '2'
|
33
|
+
} else if (path.includes("working")) {
|
34
|
+
this.activeIndex = '3'
|
35
|
+
} else if (path.includes("pending")) {
|
36
|
+
this.activeIndex = '4'
|
37
|
+
} else if (path.includes("failed")) {
|
38
|
+
this.activeIndex = '5'
|
39
|
+
}
|
40
|
+
},
|
41
|
+
|
42
|
+
components: {
|
43
|
+
jobsList: JobsList
|
44
|
+
}
|
45
|
+
}
|
46
|
+
</script>
|
47
|
+
|
48
|
+
<style scoped>
|
49
|
+
a {
|
50
|
+
text-decoration: none;
|
51
|
+
}
|
52
|
+
</style>
|
@@ -0,0 +1,144 @@
|
|
1
|
+
<template>
|
2
|
+
<div>
|
3
|
+
<el-table
|
4
|
+
:data="jobs"
|
5
|
+
v-loading.body="loading"
|
6
|
+
style="width: 100%">
|
7
|
+
<el-table-column
|
8
|
+
prop="id"
|
9
|
+
label="Job ID">
|
10
|
+
</el-table-column>
|
11
|
+
<el-table-column
|
12
|
+
label="Status">
|
13
|
+
<template scope="scope">
|
14
|
+
<el-tag
|
15
|
+
:type="filterTag(scope.row)">{{filterTagName(scope.row)}}</el-tag>
|
16
|
+
</template>
|
17
|
+
</el-table-column>
|
18
|
+
<el-table-column
|
19
|
+
prop="payload_object"
|
20
|
+
label="Handler"
|
21
|
+
:formatter="formatter"
|
22
|
+
width="400">
|
23
|
+
</el-table-column>
|
24
|
+
<el-table-column
|
25
|
+
prop="priority"
|
26
|
+
label="Priority">
|
27
|
+
</el-table-column>
|
28
|
+
<el-table-column
|
29
|
+
prop="attempts"
|
30
|
+
label="Attempts">
|
31
|
+
</el-table-column>
|
32
|
+
<el-table-column
|
33
|
+
prop="run_at"
|
34
|
+
label="Run At"
|
35
|
+
width="180"
|
36
|
+
:formatter="runAtFormatter">
|
37
|
+
</el-table-column>
|
38
|
+
<el-table-column
|
39
|
+
prop="created_at"
|
40
|
+
label="Created At"
|
41
|
+
:formatter="createdAtFormatter">
|
42
|
+
</el-table-column>
|
43
|
+
|
44
|
+
<el-table-column
|
45
|
+
label="Actions"
|
46
|
+
width="120">
|
47
|
+
<template scope="scope">
|
48
|
+
<el-button type="info" size="mini" @click.native.prevent="handleClickDialog(scope.$index, jobs)">
|
49
|
+
Show
|
50
|
+
</el-button>
|
51
|
+
</template>
|
52
|
+
</el-table-column>
|
53
|
+
</el-table>
|
54
|
+
|
55
|
+
<el-dialog title="Object Payload" v-model="dialogVisible" size="small">
|
56
|
+
<pre>{{jobDetailHandler}}</pre>
|
57
|
+
<span slot="footer" class="dialog-footer">
|
58
|
+
<el-button type="primary" @click="dialogVisible = false">Ok!</el-button>
|
59
|
+
</span>
|
60
|
+
</el-dialog>
|
61
|
+
</div>
|
62
|
+
</template>
|
63
|
+
|
64
|
+
<script>
|
65
|
+
const moment = require('moment');
|
66
|
+
|
67
|
+
export default {
|
68
|
+
props: ["mydata"],
|
69
|
+
data () {
|
70
|
+
return {
|
71
|
+
jobs: [],
|
72
|
+
dialogVisible: false,
|
73
|
+
jobDetailHandler: "",
|
74
|
+
jobDetailId: "",
|
75
|
+
loading: true
|
76
|
+
|
77
|
+
}
|
78
|
+
},
|
79
|
+
created () {
|
80
|
+
let path = window.location.pathname;
|
81
|
+
if (path.includes("pending")) {
|
82
|
+
this.loadJobs({ params: { filter: "pending" } });
|
83
|
+
} else if (path.includes("failed")) {
|
84
|
+
this.loadJobs({ params: { filter: "failed" } });
|
85
|
+
} else if (path.includes("working")) {
|
86
|
+
this.loadJobs({ params: { filter: "working" } });
|
87
|
+
} else if (path.includes("enqueued")) {
|
88
|
+
this.loadJobs({ params: { filter: "enqueued" } });
|
89
|
+
}
|
90
|
+
else {
|
91
|
+
this.loadJobs({ params: {} });
|
92
|
+
}
|
93
|
+
},
|
94
|
+
|
95
|
+
methods: {
|
96
|
+
handleClickDialog(index, jobs){
|
97
|
+
this.jobDetailHandler = jobs[index].payload_object;
|
98
|
+
this.jobDetailId = jobs[index].id;
|
99
|
+
this.dialogVisible = true;
|
100
|
+
},
|
101
|
+
|
102
|
+
formatter(row, column){
|
103
|
+
return row.handler.substring(0,300)
|
104
|
+
},
|
105
|
+
|
106
|
+
filterTag(row){
|
107
|
+
if (row.failed_at !== null) {
|
108
|
+
return "danger"
|
109
|
+
} else if (row.locked_at !== null) {
|
110
|
+
return "warning"
|
111
|
+
} else {
|
112
|
+
return "gray"
|
113
|
+
}
|
114
|
+
},
|
115
|
+
|
116
|
+
filterTagName(row) {
|
117
|
+
if (row.failed_at !== null) {
|
118
|
+
return "Failed"
|
119
|
+
} else if (row.locked_at !== null) {
|
120
|
+
return "Running"
|
121
|
+
} else {
|
122
|
+
return "Queued"
|
123
|
+
}
|
124
|
+
},
|
125
|
+
|
126
|
+
runAtFormatter(row, column){
|
127
|
+
return moment(row.run_at).format('MMMM Do YYYY, h:mm:ss a');
|
128
|
+
},
|
129
|
+
|
130
|
+
createdAtFormatter(row, column){
|
131
|
+
return moment(row.created_at).format('MMMM Do YYYY, h:mm:ss a');
|
132
|
+
},
|
133
|
+
|
134
|
+
loadJobs(queries) {
|
135
|
+
this.$http.get("/delayed_job/jobs.json", queries).then(response => {
|
136
|
+
this.jobs = response.body;
|
137
|
+
this.loading = false;
|
138
|
+
}, response => {
|
139
|
+
this.loading = false;
|
140
|
+
});
|
141
|
+
}
|
142
|
+
}
|
143
|
+
}
|
144
|
+
</script>
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import Vue from 'vue'
|
2
|
+
import VueResource from 'vue-resource'
|
3
|
+
import ElementUI from 'element-ui'
|
4
|
+
import App from './App.vue'
|
5
|
+
import 'element-ui/lib/theme-default/index.css'
|
6
|
+
import locale from 'element-ui/lib/locale/lang/en'
|
7
|
+
|
8
|
+
Vue.use(ElementUI, { locale })
|
9
|
+
Vue.use(VueResource)
|
10
|
+
|
11
|
+
new Vue({
|
12
|
+
el: '#main',
|
13
|
+
render: h => h(App)
|
14
|
+
})
|