renusify 1.4.1 → 1.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/components/chart/worldMap.vue +1110 -0
  2. package/components/codeEditor/highlightCss.vue +10 -112
  3. package/components/codeEditor/highlightHtml.vue +17 -162
  4. package/components/codeEditor/highlightJs.vue +14 -243
  5. package/components/codeEditor/index.vue +25 -3
  6. package/components/codeEditor/mixin.js +172 -0
  7. package/components/cropper/index.vue +2 -1
  8. package/components/form/json/index.vue +113 -65
  9. package/components/img/index.vue +5 -4
  10. package/components/index.js +1 -0
  11. package/components/modal/index.vue +57 -11
  12. package/components/modal/style.scss +13 -11
  13. package/components/searchBox/index.vue +1 -1
  14. package/components/slider/index.vue +39 -15
  15. package/components/table/index.vue +13 -13
  16. package/directive/drag/index.js +5 -5
  17. package/directive/sortable/index.js +3 -3
  18. package/directive/title/index.js +2 -3
  19. package/directive/touch/index.js +2 -4
  20. package/package.json +1 -1
  21. package/tools/helper.js +1 -42
package/components/codeEditor/highlightCss.vue CHANGED
@@ -13,11 +13,14 @@
13
13
  </template>
14
14
 
15
15
  <script>
16
+ import mixin from './mixin'
17
+
16
18
  export default {
17
19
  name: "highlight-css",
18
20
  props: {
19
21
  modelValue: String,
20
22
  },
23
+ mixins: [mixin],
21
24
  data() {
22
25
  return {
23
26
  d: this.modelValue,
@@ -38,128 +41,23 @@ export default {
38
41
  if (!this.d) {
39
42
  return "";
40
43
  }
41
- const data = this.d.split("");
42
- let res = "";
43
- let in_quta = false;
44
- data.forEach((c) => {
45
- if (["=", "&"].includes(c)) {
46
- res += '<span class="color-blue code-editor-span">' + c + "</span>";
47
- } else if ([",", ";", ":"].includes(c)) {
48
- res += '<span class="color-orange code-editor-span">' + c + "</span>";
49
- } else if (parseInt(c) > -1) {
50
- res += '<span class="color-number code-editor-span">' + c + "</span>";
51
- } else if ((c === '"' || c === "'" || c === "`") && !in_quta) {
52
- in_quta = c;
53
- res += '<span class="color-green code-editor-span">' + c;
54
- } else if (c === in_quta) {
55
- in_quta = false;
56
- res += c + "</span>";
57
- } else {
58
- res += c;
59
- }
60
- });
61
-
44
+ let res = this.d
45
+ res = this.re_quote(res);
46
+ res = this.re_func(res);
62
47
  res = this.re_class(res);
63
48
  res = this.re_id(res);
64
49
  res = this.re_comment(res);
65
-
50
+ res = this.re_special(res, /([{};,:])/g, 'color-func2');
66
51
  return res;
67
52
  },
68
53
  },
69
54
  methods: {
70
- setTab(event) {
71
- if (event.key === "'" || event.key === '"') {
72
- const end = event.target.selectionEnd;
73
- event.preventDefault()
74
- document.execCommand('insertText', false, event.key.repeat(2));
75
- event.target.selectionEnd = end + 1;
76
- return false;
77
- }
78
- if (event.key === "{") {
79
- const end = event.target.selectionEnd;
80
- event.preventDefault()
81
- document.execCommand('insertText', false, '{}');
82
- event.target.selectionEnd = end + 1;
83
- return false;
84
- }
85
- if (event.key === "(") {
86
- const end = event.target.selectionEnd;
87
- event.preventDefault()
88
- document.execCommand('insertText', false, '()');
89
- event.target.selectionEnd = end + 1;
90
- return false;
91
- }
92
- if (event.key === "[") {
93
- const end = event.target.selectionEnd;
94
- event.preventDefault()
95
- document.execCommand('insertText', false, '[]');
96
- event.target.selectionEnd = end + 1;
97
- return false;
98
- }
99
- if (event.keyCode === 9) {
100
- event.preventDefault()
101
- document.execCommand('insertText', false, ' '.repeat(4));
102
- return false;
103
- }
104
- if (event.keyCode === 13) {
105
- event.preventDefault()
106
- let n = event.target.value.substr(0, event.target.selectionStart).split('\n')
107
- n = n[n.length - 1].split('')
108
- let w = ''
109
- for (let i = 0; i < n.length; i++) {
110
- if (n[i] === ' ') {
111
- w += ' '
112
- } else {
113
- break
114
- }
115
- }
116
-
117
- document.execCommand('insertText', false, '\n' + w);
118
- return false;
119
- }
120
- return true
121
- },
122
55
  re_class(res) {
123
- let regex = /\.-?[_a-zA-Z]+[_a-zA-Z0-9-]*\s*\{/g;
124
- let matched = res.matchAll(regex);
125
- for (const match of matched) {
126
- res = this.$helper.replacer(
127
- res,
128
- match[0],
129
- '<span class="color-func2 code-editor-span">' +
130
- match[0].slice(0, match[0].indexOf("{")) +
131
- "</span>{"
132
- );
133
- }
134
- return res;
56
+ return res = res.replace(/(\.+[_a-zA-Z0-9-:#{}$].*)\{/g, '<span class="color-func2 code-editor-span">$1</span>{')
135
57
  },
136
58
  re_id(res) {
137
- let regex = /#-?[_a-zA-Z]+[_a-zA-Z0-9-]*\s*\{/g;
138
- let matched = res.matchAll(regex);
139
- for (const match of matched) {
140
- res = this.$helper.replacer(
141
- res,
142
- match[0],
143
- '<span class="color-func2 code-editor-span">' +
144
- match[0].slice(0, match[0].indexOf("{")) +
145
- "</span>{"
146
- );
147
- }
148
- return res;
149
- },
150
- re_comment(res) {
151
- //eslint-disable-next-line
152
- let regex = /(\/\*[\w\'\s\r\n\*]*\*\/)|(\/\/[\w\s\']*)/g;
153
- let matched = res.matchAll(regex);
154
- for (const match of matched) {
155
- res = this.$helper.replacer(
156
- res,
157
- match[0],
158
- '<span class="color-comment code-editor-span">' + match[0] + "</span>"
159
- );
160
- }
161
- return res;
162
- },
59
+ return res = res.replace(/(#+[_a-zA-Z0-9-:#{}$].*)\{/g, '<span class="color-func2 code-editor-span">$1</span>{')
60
+ }
163
61
  },
164
62
  };
165
63
  </script>
package/components/codeEditor/highlightHtml.vue CHANGED
@@ -6,18 +6,21 @@
6
6
  autocomplete="off"
7
7
  autocorrect="off"
8
8
  spellcheck="false"
9
- @keydown="setTab"
9
+ @keydown="setKey"
10
10
  ></textarea>
11
11
  <div class="text-preview" v-html="build"></div>
12
12
  </div>
13
13
  </template>
14
14
 
15
15
  <script>
16
+ import mixin from './mixin'
17
+
16
18
  export default {
17
19
  name: "highlight-html",
18
20
  props: {
19
21
  modelValue: String,
20
22
  },
23
+ mixins: [mixin],
21
24
  data() {
22
25
  return {
23
26
  d: this.modelValue,
@@ -42,56 +45,25 @@ export default {
42
45
  let data = this.d;
43
46
  data = this.$helper.replacer(data, "<", "&lt;");
44
47
  data = this.$helper.replacer(data, ">", "&gt;");
45
- data = data.split("");
46
- let res = "";
47
- let in_quta = false;
48
- data.forEach((c) => {
49
- if (c === "=") {
50
- res += '<span class="color-blue">=</span>';
51
- } else if ((c === '"' || c === "'") && !in_quta) {
52
- in_quta = c;
53
- res += '<span class="color-green">' + c;
54
- } else if (c === in_quta) {
55
- in_quta = false;
56
- res += c + "</span>";
57
- } else {
58
- res += c;
59
- }
60
- });
61
-
62
- res = this.$helper.replacer(
63
- res,
64
- "&lt;",
65
- '<span class="color-orange code-editor-span">&lt;'
66
- );
67
- res = this.$helper.replacer(res, "&gt;", "&gt;</span>");
68
- res = this.$helper.replacer(
69
- res,
70
- "{{",
71
- '<span class="color-blue code-editor-span">{{'
72
- );
73
- res = this.$helper.replacer(res, "}}", "}}</span>");
48
+ let res = data;
49
+ res = this.re_quote(res)
74
50
 
75
- let regex = /\+(.*?)\+/g;
76
- let matched = res.matchAll(regex);
77
- for (const match of matched) {
78
- res = this.$helper.replacer(
79
- res,
80
- match[0],
81
- '<span class="color-blue code-editor-span">' + match[0] + "</span>"
82
- );
83
- }
84
- res = this.re_words(res);
85
51
  res = this.re_comment(res);
86
52
  res = this.re_func(res);
53
+
54
+ res = res.replace(/(&lt;+[\s\S]+&gt;)/g, '<span class="color-orange code-editor-span">$1</span>')
55
+ res = res.replace(/(\{\{+[\s\S]+}})/g, '<span class="color-blue code-editor-span">$1</span>')
87
56
  return res;
88
57
  },
89
58
  },
90
59
  methods: {
91
- setTab(event) {
60
+ setKey(event) {
92
61
  if (event.key === "<") {
93
62
  this.openTag = event.target.selectionEnd
94
63
  return false
64
+ } else if (event.key === "/" && this.openTag !== null && this.openTag + 1 === event.target.selectionEnd) {
65
+ this.openTag = null
66
+ return false
95
67
  } else if (event.key === ">" && this.openTag !== null) {
96
68
  const end = event.target.selectionEnd;
97
69
  const sel = event.target.value.substring(this.openTag + 1, end).trim().split(' ')[0];
@@ -103,129 +75,12 @@ export default {
103
75
  return false
104
76
  }
105
77
 
106
- if (event.key === "'" || event.key === '"' || event.key === '`') {
107
- const end = event.target.selectionEnd;
108
- event.preventDefault()
109
- document.execCommand('insertText', false, event.key.repeat(2));
110
- event.target.selectionEnd = end + 1;
111
- return false;
112
- }
113
- if (event.key === "{") {
114
- const end = event.target.selectionEnd;
115
- event.preventDefault()
116
- document.execCommand('insertText', false, '{}');
117
- event.target.selectionEnd = end + 1;
118
- return false;
119
- }
120
- if (event.key === "(") {
121
- const end = event.target.selectionEnd;
122
- event.preventDefault()
123
- document.execCommand('insertText', false, '()');
124
- event.target.selectionEnd = end + 1;
125
- return false;
126
- }
127
- if (event.key === "[") {
128
- const end = event.target.selectionEnd;
129
- event.preventDefault()
130
- document.execCommand('insertText', false, '[]');
131
- event.target.selectionEnd = end + 1;
132
- return false;
133
- }
134
- if (event.keyCode === 9) {
135
- event.preventDefault()
136
- document.execCommand('insertText', false, ' '.repeat(4));
137
- return false;
138
- }
139
- if (event.keyCode === 13) {
140
- event.preventDefault()
141
- let n = event.target.value.substr(0, event.target.selectionStart).split('\n')
142
- n = n[n.length - 1].split('')
143
- let w = ''
144
- for (let i = 0; i < n.length; i++) {
145
- if (n[i] === ' ') {
146
- w += ' '
147
- } else {
148
- break
149
- }
150
- }
151
-
152
- document.execCommand('insertText', false, '\n' + w);
153
- return false;
154
- }
155
- return true
156
- },
157
- re_words(res) {
158
- res = this.$helper.replacer(
159
- res,
160
- " window.",
161
- ' <span class="color-orange code-editor-span">window</span>.'
162
- );
163
- res = this.$helper.replacer(
164
- res,
165
- " new ",
166
- ' <span class="color-orange code-editor-span">new</span> '
167
- );
168
- res = this.$helper.replacer(
169
- res,
170
- " true",
171
- ' <span class="color-orange code-editor-span">true</span>'
172
- );
173
- res = this.$helper.replacer(
174
- res,
175
- " false",
176
- ' <span class="color-orange code-editor-span">false</span>'
177
- );
178
-
179
- return res;
78
+ return this.setTab(event)
180
79
  },
181
80
  re_comment(res) {
182
- let regex = /&lt;!--(.*?)--&gt;/g;
183
- let matched = res.matchAll(regex);
184
- for (const match of matched) {
185
- res = this.$helper.replacer(
186
- res,
187
- match[0],
188
- '<span class="color-comment code-editor-span">' + match[0] + "</span>"
189
- );
190
- }
191
- return res;
192
- },
193
- re_func(res) {
194
- //function like Date()
195
- let regex = /([a-zA-Z_{1}][a-zA-Z0-9_]+)[ ]{0,1}(?=\()/g;
196
- let matched = res.matchAll(regex);
197
- for (const match of matched) {
198
- res = this.$helper.replacer(
199
- res,
200
- match[0],
201
- '<span class="color-func2 code-editor-span">' + match[0] + "</span>"
202
- );
203
- }
204
-
205
- //function like $r $d()
206
- regex = /(\$([a-zA-z0-9]*)[.|(])/g;
207
- matched = res.matchAll(regex);
208
- for (const match of matched) {
209
- res = this.$helper.replacer(
210
- res,
211
- match[0].substr(0, match[0].length - 1),
212
- '<span class="color-func code-editor-span">' +
213
- match[0].substr(0, match[0].length - 1) +
214
- "</span>"
215
- );
216
- }
217
- res = this.$helper.replacer(
218
- res,
219
- "(",
220
- '<span class="color-func2 code-editor-span">(</span>'
221
- );
222
- res = this.$helper.replacer(
223
- res,
224
- ")",
225
- '<span class="color-func2 code-editor-span">)</span>'
226
- );
227
- return res;
228
- },
81
+ let regex = /(&lt;!--+[\s\S]+--&gt;)/g;
82
+ return res.replace(regex, '<span class="color-comment code-editor-span">$1</span>')
83
+ }
229
84
  },
230
85
  };
231
86
  </script>
package/components/codeEditor/highlightJs.vue CHANGED
@@ -13,11 +13,14 @@
13
13
  </template>
14
14
 
15
15
  <script>
16
+ import mixin from './mixin'
17
+
16
18
  export default {
17
19
  name: "highlight-script",
18
20
  props: {
19
21
  modelValue: String,
20
22
  },
23
+ mixins: [mixin],
21
24
  data() {
22
25
  return {
23
26
  d: this.modelValue,
@@ -38,255 +41,23 @@ export default {
38
41
  if (!this.d) {
39
42
  return "";
40
43
  }
41
- let data = this.d.split("");
42
- let str = this.d.trim();
43
-
44
- if (str.substr(0, 1) === "{") {
45
- str = str.substr(1, str.length - 2);
46
- }
47
- let res = "";
48
-
49
- let in_quta = false;
50
- data.forEach((c) => {
51
- if (["=", "&", "{", "}", "<", ">"].includes(c)) {
52
- res += '<span class="color-blue code-editor-span">' + c + "</span>";
53
- } else if ([",", ";", ":"].includes(c)) {
54
- res += '<span class="color-orange code-editor-span">' + c + "</span>";
55
- } else if (parseInt(c) > -1) {
56
- res += '<span class="color-number code-editor-span">' + c + "</span>";
57
- } else if ((c === '"' || c === "'" || c === "`") && !in_quta) {
58
- in_quta = c;
59
- res += '<span class="color-green code-editor-span">' + c;
60
- } else if (c === in_quta) {
61
- in_quta = false;
62
- res += c + "</span>";
63
- } else {
64
- res += c;
65
- }
66
- });
67
44
 
68
- res = this.re_words(res);
45
+ let res = this.d;
46
+ res = this.$helper.replacer(res, "<", "&lt;");
47
+ res = this.$helper.replacer(res, ">", "&gt;");
48
+ res = this.re_quote(res);
49
+ res = this.re_special(res, /([{}\[\]])/g);
50
+ res = this.re_words(res, ['import', 'from', 'delete', 'window', 'new', 'var', 'let', 'const', 'return', 'true', 'false', 'this', 'null', 'String', 'Boolean', 'Object']);
69
51
  res = this.re_comment(res);
70
52
  res = this.re_func(res);
53
+ res = this.re_number(res);
54
+ res = this.re_special(res, /([(),])/g, 'color-func2');
55
+ res = res.replace(/(&lt;)/g, '<span class="color-orange code-editor-span">$1</span>')
56
+ res = res.replace(/(&gt;)/g, '<span class="color-orange code-editor-span">$1</span>')
71
57
 
72
- // main function vuejs methods created ,...
73
- this.strToObj(str).forEach((item) => {
74
- if (item) {
75
- res = this.$helper.replacer(
76
- res,
77
- item,
78
- '<span class="color-func code-editor-span">' + item + "</span>"
79
- );
80
- }
81
- });
82
-
83
- return res;
84
- },
85
- },
86
- methods: {
87
- setTab(event) {
88
- if (event.key === "'" || event.key === '"' || event.key === '`') {
89
- const end = event.target.selectionEnd;
90
- event.preventDefault()
91
- document.execCommand('insertText', false, event.key.repeat(2));
92
- event.target.selectionEnd = end + 1;
93
- return false;
94
- }
95
- if (event.key === "{") {
96
- const end = event.target.selectionEnd;
97
- event.preventDefault()
98
- document.execCommand('insertText', false, '{}');
99
- event.target.selectionEnd = end + 1;
100
- return false;
101
- }
102
- if (event.key === "(") {
103
- const end = event.target.selectionEnd;
104
- event.preventDefault()
105
- document.execCommand('insertText', false, '()');
106
- event.target.selectionEnd = end + 1;
107
- return false;
108
- }
109
- if (event.key === "[") {
110
- const end = event.target.selectionEnd;
111
- event.preventDefault()
112
- document.execCommand('insertText', false, '[]');
113
- event.target.selectionEnd = end + 1;
114
- return false;
115
- }
116
- if (event.keyCode === 9) {
117
- event.preventDefault()
118
- document.execCommand('insertText', false, ' '.repeat(4));
119
- return false;
120
- }
121
- if (event.keyCode === 13) {
122
- event.preventDefault()
123
- let n = event.target.value.substr(0, event.target.selectionStart).split('\n')
124
- n = n[n.length - 1].split('')
125
- let w = ''
126
- for (let i = 0; i < n.length; i++) {
127
- if (n[i] === ' ') {
128
- w += ' '
129
- } else {
130
- break
131
- }
132
- }
133
-
134
- document.execCommand('insertText', false, '\n' + w);
135
- return false;
136
- }
137
- return true
138
- },
139
- strToObj(str) {
140
- str = this.$helper.replacer(str, " ", "");
141
- str = this.$helper.replacer(str, "\n", "");
142
- str = this.$helper.replacer(str, "\r", "");
143
- let open = 0;
144
- let pre = 0;
145
- let to = 0;
146
- let items = [];
147
- const s = str;
148
- s.split("").forEach((c, i) => {
149
- to++;
150
- if (c === "{") {
151
- open++;
152
- }
153
- if (c === "}") {
154
- open--;
155
- }
156
- if (open === 0 && c === ",") {
157
- let new_str = str.substr(pre, to - 1);
158
- const o = new_str.indexOf(":");
159
- const f = new_str.indexOf("(");
160
- if ((f > 0 && f < o) || o < 0) {
161
- new_str = new_str.substr(0, f);
162
- } else {
163
- new_str = new_str.substr(0, o);
164
- }
165
- items.push(new_str);
166
- pre = i + 1;
167
- to = 0;
168
- }
169
- });
170
- let new_str = str.substr(pre, str.length);
171
- const o = new_str.indexOf(":");
172
- const f = new_str.indexOf("(");
173
- if ((f > 0 && f < o) || o < 0) {
174
- new_str = new_str.substr(0, f);
175
- } else {
176
- new_str = new_str.substr(0, o);
177
- }
178
- items.push(new_str);
179
- return items;
180
- },
181
- re_words(res) {
182
- res = this.$helper.replacer(
183
- res,
184
- "import ",
185
- '<span class="color-orange code-editor-span">import</span> '
186
- );
187
- res = this.$helper.replacer(
188
- res,
189
- " from ",
190
- ' <span class="color-orange code-editor-span">from</span> '
191
- );
192
- res = this.$helper.replacer(
193
- res,
194
- " window.",
195
- ' <span class="color-orange code-editor-span">window</span>.'
196
- );
197
- res = this.$helper.replacer(
198
- res,
199
- " new ",
200
- ' <span class="color-orange code-editor-span">new</span> '
201
- );
202
- res = this.$helper.replacer(
203
- res,
204
- " var ",
205
- ' <span class="color-orange code-editor-span">var</span> '
206
- );
207
- res = this.$helper.replacer(
208
- res,
209
- " let ",
210
- ' <span class="color-orange code-editor-span">let</span> '
211
- );
212
- res = this.$helper.replacer(
213
- res,
214
- " const ",
215
- ' <span class="color-orange code-editor-span">const</span> '
216
- );
217
- res = this.$helper.replacer(
218
- res,
219
- " return ",
220
- ' <span class="color-orange code-editor-span">return</span> '
221
- );
222
- res = this.$helper.replacer(
223
- res,
224
- " true",
225
- ' <span class="color-orange code-editor-span">true</span>'
226
- );
227
- res = this.$helper.replacer(
228
- res,
229
- " false",
230
- ' <span class="color-orange code-editor-span">false</span>'
231
- );
232
- res = this.$helper.replacer(
233
- res,
234
- " this.",
235
- ' <span class="color-orange code-editor-span">this</span>.'
236
- );
237
-
238
- return res;
239
- },
240
- re_comment(res) {
241
- //eslint-disable-next-line
242
- let regex = /(\/\*[\w\'\s\r\n\*]*\*\/)|(\/\/[\w\s\']*)/g;
243
- let matched = res.matchAll(regex);
244
- for (const match of matched) {
245
- res = this.$helper.replacer(
246
- res,
247
- match[0],
248
- '<span class="color-comment code-editor-span">' + match[0] + "</span>"
249
- );
250
- }
251
58
  return res;
252
59
  },
253
- re_func(res) {
254
- //function like Date()
255
- let regex = /([a-zA-Z_{1}][a-zA-Z0-9_]+)[ ]{0,1}(?=\()/g;
256
- let matched = res.matchAll(regex);
257
- for (const match of matched) {
258
- res = this.$helper.replacer(
259
- res,
260
- match[0],
261
- '<span class="color-func2 code-editor-span">' + match[0] + "</span>"
262
- );
263
- }
264
-
265
- //function like $r $d()
266
- regex = /(\$([a-zA-z0-9]*)[.|(])/g;
267
- matched = res.matchAll(regex);
268
- for (const match of matched) {
269
- res = this.$helper.replacer(
270
- res,
271
- match[0].substr(0, match[0].length - 1),
272
- '<span class="color-func code-editor-span">' +
273
- match[0].substr(0, match[0].length - 1) +
274
- "</span>"
275
- );
276
- }
277
- res = this.$helper.replacer(
278
- res,
279
- "(",
280
- '<span class="color-func2 code-editor-span">(</span>'
281
- );
282
- res = this.$helper.replacer(
283
- res,
284
- ")",
285
- '<span class="color-func2 code-editor-span">)</span>'
286
- );
287
- return res;
288
- },
289
- },
60
+ }
290
61
  };
291
62
  </script>
292
63