-
Notifications
You must be signed in to change notification settings - Fork 17
/
reqtask.html
127 lines (121 loc) · 3.01 KB
/
reqtask.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>构建请求任务</title>
<style>
button{ padding: 5px 10px;}
textarea{display: inline-block; vertical-align: top;}
.logger{display: inline-block;}
.logger:before{content: 'logger';}
.task {margin: 20px auto;}
.task .oper{margin: 10px auto;}
</style>
</head>
<body>
<div class="task-list">
<button id="addTask">新增任务</button>
</div>
<div class="task-nav">
<h3>任务列表</h3>
<ul>
<li data-id="id">name</li>
</ul>
</div>
<script type="text/template" id='tpl'>
<div class="task" data-id="{{id}}">
<div class="oper">
<button class="deleteTask">删除任务</button>
<button class="runTask">运行任务</button>
</div>
<textarea name="name" rows="8" cols="40">{{task}}</textarea>
<span class="logger"></span>
</div>
</script>
</body>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="http://marcuswestin.github.io/store.js/store.js"></script>
<script>
$(function(){
// function $dom(filter){
// return document.querySelectorAll(filter);
// }
var template = $('#tpl').html();
var $taskList = $('.task-list');
var $addTask = $('#addTask');
function _template(template, data){
var i = 0,
len = data.length,
fragment = '';
function replace(obj){
var t, key, reg;
for(key in obj){
reg = new RegExp('{{' + key + '}}', 'ig');
t = (t || template).replace(reg, obj[key]);
}
return t;
}
for(; i < len; i++){
fragment += replace(data[i]);
}
return fragment;
}
var taskId = 1,curTaskId;
var defaultTask = {
id: taskId,
task: '',
};
var Store = store.get('__js_reqtask') || [];
if(Store && Store.length){
$addTask.after(_template(template, Store));
}else{
$addTask.after(_template(template, [defaultTask]));
}
$('body').on('click', '.runTask', function(e){
var $task = $(this).parent().parent();
var taskStr = $task.find('textarea').val();
curTaskId = parseInt($task.data('id'));
Store.push($.extend({},defaultTask,{
id: curTaskId,
task: taskStr,
}));
store.set('__js_reqtask', Store);
eval(taskStr);
});
$('body').on('click', '.deleteTask', function(e){
var $task = $(this).parent().parent();
$task.remove();
});
$('body').on('click', '.addTask', function(e){
var $task = $(this).parent().parent();
$task.remove();
});
/* 测试数据
var start = +new Date;
var path = 'http://10.0.0.119::3000';
$.ajax({
async: false,
url: path + '/key',
type: "GET",
dataType: 'jsonp',
jsonp: 'callback',
// cache: false,
success: function(key){
$.ajax({
url: path + '/price',
data: {
key: key
},
success: function(data){
var $result = $('#result');
$result.html(data);
var end = +new Date;
console.log( (end-start)/1000 );
},
})
},
})
*/
})
</script>
</html>