@ajaxjs/util 1.1.1 → 1.1.2
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.
- package/README.md +55 -6
- package/dist/index.esm.js +525 -0
- package/dist/index.umd.js +536 -0
- package/dist/{util → src/core}/cookies.d.ts +18 -18
- package/dist/{util → src/core}/dom.d.ts +17 -17
- package/dist/{util → src/core}/utils.d.ts +51 -51
- package/dist/{util → src/core}/xhr-config.d.ts +22 -22
- package/dist/{util → src/core}/xhr.d.ts +71 -71
- package/dist/src/index.d.ts +5 -0
- package/package.json +39 -43
- package/{dist/util/cookies.js → src/core/cookies.ts} +15 -18
- package/{dist/util/dom.js → src/core/dom.ts} +17 -14
- package/{dist/util/utils.js → src/core/utils.ts} +82 -77
- package/src/core/xhr-config.ts +25 -0
- package/{dist/util/xhr.js → src/core/xhr.ts} +128 -94
- package/src/index.ts +6 -0
- package/LICENSE +0 -201
- package/dist/index.d.ts +0 -38
- package/dist/index.js +0 -71
- package/dist/index.js.map +0 -1
- package/dist/main.d.ts +0 -1
- package/dist/main.js +0 -16
- package/dist/main.js.map +0 -1
- package/dist/router/index.d.ts +0 -3
- package/dist/router/index.js +0 -44
- package/dist/router/index.js.map +0 -1
- package/dist/router.d.ts +0 -3
- package/dist/router.js +0 -44
- package/dist/router.js.map +0 -1
- package/dist/shims-vue.d.ts +0 -4
- package/dist/style/common-functions.less +0 -294
- package/dist/style/reset.less +0 -19
- package/dist/util/cookies.js.map +0 -1
- package/dist/util/dom.js.map +0 -1
- package/dist/util/utils.js.map +0 -1
- package/dist/util/xhr-config.js +0 -3
- package/dist/util/xhr-config.js.map +0 -1
- package/dist/util/xhr.js.map +0 -1
- package/dist/widget/AccordionMenu.vue +0 -140
- package/dist/widget/AdjustFontSize.vue +0 -65
- package/dist/widget/Article.vue +0 -59
- package/dist/widget/EmptyContent.d.ts +0 -5
- package/dist/widget/EmptyContent.js +0 -7
- package/dist/widget/EmptyContent.js.map +0 -1
- package/dist/widget/Expander.vue +0 -65
- package/dist/widget/FileUploader/FileUploader.d.ts +0 -70
- package/dist/widget/FileUploader/FileUploader.js +0 -139
- package/dist/widget/FileUploader/FileUploader.js.map +0 -1
- package/dist/widget/FileUploader/FileUploader.less +0 -68
- package/dist/widget/FileUploader/FileUploader.ts +0 -156
- package/dist/widget/FileUploader/FileUploader.vue +0 -43
- package/dist/widget/HtmlEditor/HtmlEditor.d.ts +0 -70
- package/dist/widget/HtmlEditor/HtmlEditor.js +0 -287
- package/dist/widget/HtmlEditor/HtmlEditor.js.map +0 -1
- package/dist/widget/HtmlEditor/HtmlEditor.less +0 -345
- package/dist/widget/HtmlEditor/HtmlEditor.ts +0 -339
- package/dist/widget/HtmlEditor/HtmlEditor.vue +0 -70
- package/dist/widget/HtmlEditor/html-editor-HtmlSanitizer.js +0 -103
- package/dist/widget/ImageEnlarger.vue +0 -105
- package/dist/widget/OpacityBanner.vue +0 -125
- package/dist/widget/ProcessLine.vue +0 -133
- package/dist/widget/Resize.d.ts +0 -51
- package/dist/widget/Resize.js +0 -133
- package/dist/widget/Resize.js.map +0 -1
- package/dist/widget/Resize.ts +0 -152
- package/dist/widget/Resize.vue +0 -104
- package/dist/widget/TreeSelector.vue +0 -4
- package/dist/widget/calendar/BetweenDate.vue +0 -63
- package/dist/widget/calendar/Calendar.d.ts +0 -55
- package/dist/widget/calendar/Calendar.js +0 -145
- package/dist/widget/calendar/Calendar.js.map +0 -1
- package/dist/widget/calendar/Calendar.less +0 -210
- package/dist/widget/calendar/Calendar.ts +0 -167
- package/dist/widget/calendar/Calendar.vue +0 -52
- package/dist/widget/calendar/CalendarInput.vue +0 -71
- package/dist/widget/form/validator.d.ts +0 -70
- package/dist/widget/form/validator.js +0 -220
- package/dist/widget/form/validator.js.map +0 -1
- package/dist/widget/form/validator.ts +0 -289
- package/dist/widget/play-ground/sku.vue +0 -93
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<ul class="aj-opacity-banner">
|
|
3
|
-
<slot></slot>
|
|
4
|
-
</ul>
|
|
5
|
-
</template>
|
|
6
|
-
|
|
7
|
-
<script lang="ts">
|
|
8
|
-
/**
|
|
9
|
-
* 渐显 banner
|
|
10
|
-
* 注意:定时器保存在 DOM 元素的属性上,是否会内存泄漏呢?
|
|
11
|
-
*/
|
|
12
|
-
export default {
|
|
13
|
-
props: {
|
|
14
|
-
delay: { default: 3000 }, // 延时
|
|
15
|
-
fps: { default: 25 }, // 帧速
|
|
16
|
-
},
|
|
17
|
-
data(): any {
|
|
18
|
-
return {
|
|
19
|
-
active: 0, // 当前索引
|
|
20
|
-
};
|
|
21
|
-
},
|
|
22
|
-
mounted(): void {
|
|
23
|
-
this.list = this.$el.querySelectorAll("li"); // 各帧
|
|
24
|
-
this.list[0].style.opacity = "1";
|
|
25
|
-
this.run();
|
|
26
|
-
},
|
|
27
|
-
methods: {
|
|
28
|
-
/**
|
|
29
|
-
* 播放动画
|
|
30
|
-
*
|
|
31
|
-
* @param this
|
|
32
|
-
*/
|
|
33
|
-
run(): void {
|
|
34
|
-
this.timer = window.setInterval(() => {
|
|
35
|
-
let active: number = this.active;
|
|
36
|
-
this.clear();
|
|
37
|
-
active += 1;
|
|
38
|
-
this.active = active % this.list.length;
|
|
39
|
-
this.animate(100);
|
|
40
|
-
}, this.delay);
|
|
41
|
-
},
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* 下一帧
|
|
45
|
-
*
|
|
46
|
-
* @param this
|
|
47
|
-
*/
|
|
48
|
-
per(): void {
|
|
49
|
-
let active: number = this.active;
|
|
50
|
-
this.clear();
|
|
51
|
-
active -= 1;
|
|
52
|
-
active = active % this.list.length;
|
|
53
|
-
|
|
54
|
-
if (active < 0) active = this.list.length - 1;
|
|
55
|
-
|
|
56
|
-
this.active = active;
|
|
57
|
-
this.animate(100);
|
|
58
|
-
},
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* 内容淡出
|
|
62
|
-
*/
|
|
63
|
-
clear(): void {
|
|
64
|
-
this.animate(0);
|
|
65
|
-
},
|
|
66
|
-
|
|
67
|
-
/**
|
|
68
|
-
*
|
|
69
|
-
* @param params
|
|
70
|
-
*/
|
|
71
|
-
animate(params: number): void {
|
|
72
|
-
var el: HTMLLIElement = this.list[this.active],
|
|
73
|
-
fps: number = 1000 / this.fps;
|
|
74
|
-
// @ts-ignore
|
|
75
|
-
window.clearTimeout(el.timer);
|
|
76
|
-
|
|
77
|
-
window.setTimeout(function loop() {
|
|
78
|
-
var i: number = getOpacity(el);
|
|
79
|
-
let speed: number = (params - i) / 8;
|
|
80
|
-
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
|
|
81
|
-
// console.log("i=" + i + "; speed="+ speed+"; s="+s+"; k="+k);
|
|
82
|
-
i += speed;
|
|
83
|
-
el.style.opacity = String(i / 100);
|
|
84
|
-
// @ts-ignore
|
|
85
|
-
window.clearTimeout(el.timer);
|
|
86
|
-
// params.complete && params.complete.call(elem);
|
|
87
|
-
// @ts-ignore
|
|
88
|
-
el.timer = window.setTimeout(loop, fps);
|
|
89
|
-
}, fps);
|
|
90
|
-
},
|
|
91
|
-
},
|
|
92
|
-
};
|
|
93
|
-
|
|
94
|
-
/**
|
|
95
|
-
* 获取元素的透明度
|
|
96
|
-
*
|
|
97
|
-
* @param el
|
|
98
|
-
*/
|
|
99
|
-
function getOpacity(el: Element): number {
|
|
100
|
-
let v = Number(getComputedStyle(el)["opacity"]);
|
|
101
|
-
v *= 100;
|
|
102
|
-
|
|
103
|
-
return parseFloat(v + "") || 0;
|
|
104
|
-
}
|
|
105
|
-
</script>
|
|
106
|
-
|
|
107
|
-
<style lang="less" scoped>
|
|
108
|
-
.aj-opacity-banner {
|
|
109
|
-
position: relative;
|
|
110
|
-
min-height: 90px;
|
|
111
|
-
|
|
112
|
-
li {
|
|
113
|
-
position: absolute;
|
|
114
|
-
top: 0;
|
|
115
|
-
left: 0;
|
|
116
|
-
opacity: 0;
|
|
117
|
-
width: 100%;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
img {
|
|
121
|
-
// border-top:solid 20px #00416d;
|
|
122
|
-
width: 100%;
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
</style>
|
|
@@ -1,133 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="aj-process-line">
|
|
3
|
-
<div class="process-line">
|
|
4
|
-
<div v-for="(item, index) in items" :key="index" :class="{current: index == current, done: index < current}">
|
|
5
|
-
<span>{{index + 1}}</span>
|
|
6
|
-
<p>{{item}}</p>
|
|
7
|
-
</div>
|
|
8
|
-
</div>
|
|
9
|
-
</div>
|
|
10
|
-
</template>
|
|
11
|
-
|
|
12
|
-
<script lang="ts">
|
|
13
|
-
/**
|
|
14
|
-
* 进度条
|
|
15
|
-
*/
|
|
16
|
-
export default {
|
|
17
|
-
props: {
|
|
18
|
-
items: {
|
|
19
|
-
type: Array,
|
|
20
|
-
default(): string[] {
|
|
21
|
-
return ["Step 1", "Step 2", "Step 3"];
|
|
22
|
-
},
|
|
23
|
-
},
|
|
24
|
-
},
|
|
25
|
-
data():any {
|
|
26
|
-
return {
|
|
27
|
-
current: 0,
|
|
28
|
-
};
|
|
29
|
-
},
|
|
30
|
-
methods: {
|
|
31
|
-
/**
|
|
32
|
-
*
|
|
33
|
-
* @param i
|
|
34
|
-
*/
|
|
35
|
-
go(i: number): void {
|
|
36
|
-
this.current = i;
|
|
37
|
-
},
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
*
|
|
41
|
-
*/
|
|
42
|
-
perv(): void {
|
|
43
|
-
let perv: number = this.current - 1;
|
|
44
|
-
if (perv < 0) perv = this.items.length - 1;
|
|
45
|
-
|
|
46
|
-
this.go(perv);
|
|
47
|
-
},
|
|
48
|
-
|
|
49
|
-
/**
|
|
50
|
-
*
|
|
51
|
-
*/
|
|
52
|
-
next(): void {
|
|
53
|
-
let next: number = this.current + 1;
|
|
54
|
-
if (this.items.length == next) next = 0; // 循环
|
|
55
|
-
|
|
56
|
-
this.go(next);
|
|
57
|
-
},
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
</script>
|
|
61
|
-
|
|
62
|
-
<style lang="less" scoped>
|
|
63
|
-
.aj-process-line {
|
|
64
|
-
display: flex;
|
|
65
|
-
padding: 5%;
|
|
66
|
-
justify-content: center;
|
|
67
|
-
|
|
68
|
-
.process-line {
|
|
69
|
-
font-size: 18px;
|
|
70
|
-
color: lightgray;
|
|
71
|
-
font-weight: bold;
|
|
72
|
-
|
|
73
|
-
& > div {
|
|
74
|
-
float: left;
|
|
75
|
-
width: 156px;
|
|
76
|
-
text-align: center;
|
|
77
|
-
position: relative;
|
|
78
|
-
|
|
79
|
-
&.current {
|
|
80
|
-
color: black;
|
|
81
|
-
|
|
82
|
-
span {
|
|
83
|
-
background-color: gray;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
&.done {
|
|
88
|
-
// color: lighten(@mainColor, 80%);
|
|
89
|
-
span {
|
|
90
|
-
// background-color: lighten(@mainColor, 50%);
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
&::after {
|
|
94
|
-
// background-color: lighten(@mainColor, 50%);
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
p {
|
|
99
|
-
font-size: 1rem;
|
|
100
|
-
letter-spacing: 3px;
|
|
101
|
-
padding-top: 5%;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
span {
|
|
105
|
-
display: inline-block;
|
|
106
|
-
width: 32px;
|
|
107
|
-
height: 32px;
|
|
108
|
-
border-radius: 50%;
|
|
109
|
-
color: #fff;
|
|
110
|
-
line-height: 32px;
|
|
111
|
-
font-size: 16px;
|
|
112
|
-
background-color: lightgray;
|
|
113
|
-
position: relative;
|
|
114
|
-
z-index: 1;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
&:last-child::after {
|
|
118
|
-
display: none;
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
&::after {
|
|
122
|
-
content: "";
|
|
123
|
-
position: absolute;
|
|
124
|
-
top: 14px;
|
|
125
|
-
left: 94px;
|
|
126
|
-
width: 124px;
|
|
127
|
-
height: 4px;
|
|
128
|
-
background-color: lightgray;
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
</style>
|
package/dist/widget/Resize.d.ts
DELETED
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
declare const _default: {
|
|
2
|
-
data(): {
|
|
3
|
-
styleWidth: number;
|
|
4
|
-
styleHeight: number;
|
|
5
|
-
styleLeft: number;
|
|
6
|
-
styleTop: number;
|
|
7
|
-
sideLeft: number;
|
|
8
|
-
sideRight: number;
|
|
9
|
-
sideUp: number;
|
|
10
|
-
sideDown: number;
|
|
11
|
-
fixLeft: number;
|
|
12
|
-
fixTop: number;
|
|
13
|
-
fn: any;
|
|
14
|
-
LockX: boolean;
|
|
15
|
-
LockY: boolean;
|
|
16
|
-
Lock: boolean;
|
|
17
|
-
scale: {
|
|
18
|
-
enable: boolean;
|
|
19
|
-
ratio: number;
|
|
20
|
-
left: number;
|
|
21
|
-
top: number;
|
|
22
|
-
};
|
|
23
|
-
min: {
|
|
24
|
-
enable: boolean;
|
|
25
|
-
height: number;
|
|
26
|
-
width: number;
|
|
27
|
-
};
|
|
28
|
-
max: {
|
|
29
|
-
enable: boolean;
|
|
30
|
-
height: number;
|
|
31
|
-
width: number;
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
methods: {
|
|
35
|
-
/**
|
|
36
|
-
* 准备拖动
|
|
37
|
-
*/
|
|
38
|
-
start(e: MouseEvent, fn: Function): void;
|
|
39
|
-
resize(e: MouseEvent): void;
|
|
40
|
-
stop(): void;
|
|
41
|
-
up(e: MouseEvent): void;
|
|
42
|
-
down(e: MouseEvent): void;
|
|
43
|
-
right(e: MouseEvent): void;
|
|
44
|
-
left(e: MouseEvent): void;
|
|
45
|
-
rightDown(e: MouseEvent): void;
|
|
46
|
-
rightUp(e: MouseEvent): void;
|
|
47
|
-
leftDown(e: MouseEvent): void;
|
|
48
|
-
leftUp(e: MouseEvent): void;
|
|
49
|
-
};
|
|
50
|
-
};
|
|
51
|
-
export default _default;
|
package/dist/widget/Resize.js
DELETED
|
@@ -1,133 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.default = {
|
|
4
|
-
data() {
|
|
5
|
-
return {
|
|
6
|
-
styleWidth: 0,
|
|
7
|
-
styleHeight: 0,
|
|
8
|
-
styleLeft: 0,
|
|
9
|
-
styleTop: 0,
|
|
10
|
-
sideLeft: 0,
|
|
11
|
-
sideRight: 0,
|
|
12
|
-
sideUp: 0,
|
|
13
|
-
sideDown: 0,
|
|
14
|
-
fixLeft: 0,
|
|
15
|
-
fixTop: 0,
|
|
16
|
-
fn: null,
|
|
17
|
-
LockX: false,
|
|
18
|
-
LockY: false,
|
|
19
|
-
Lock: false,
|
|
20
|
-
scale: {
|
|
21
|
-
enable: true,
|
|
22
|
-
ratio: 0,
|
|
23
|
-
left: 0,
|
|
24
|
-
top: 0,
|
|
25
|
-
},
|
|
26
|
-
min: {
|
|
27
|
-
enable: false,
|
|
28
|
-
height: 100,
|
|
29
|
-
width: 200,
|
|
30
|
-
},
|
|
31
|
-
max: {
|
|
32
|
-
enable: false,
|
|
33
|
-
height: 300,
|
|
34
|
-
width: 500,
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
},
|
|
38
|
-
methods: {
|
|
39
|
-
/**
|
|
40
|
-
* 准备拖动
|
|
41
|
-
*/
|
|
42
|
-
start(e, fn) {
|
|
43
|
-
this.styleWidth = this.$el.clientWidth;
|
|
44
|
-
this.styleHeight = this.$el.clientHeight;
|
|
45
|
-
this.styleLeft = this.$el.offsetLeft; // 记录鼠标相对拖放对象的位置
|
|
46
|
-
this.styleTop = this.$el.offsetTop;
|
|
47
|
-
this.sideLeft = e.clientX - this.styleWidth;
|
|
48
|
-
this.sideRight = e.clientX + this.styleWidth;
|
|
49
|
-
this.sideUp = e.clientY - this.styleHeight;
|
|
50
|
-
this.sideDown = e.clientY + this.styleHeight;
|
|
51
|
-
this.fixLeft = this.styleWidth + this.styleLeft;
|
|
52
|
-
this.fixTop = this.styleHeight + this.styleTop;
|
|
53
|
-
this.fn = fn;
|
|
54
|
-
if (this.scale.enable) {
|
|
55
|
-
this.scale.ratio = Math.max(this.scale.ratio, 0) || this.styleWidth / this.styleHeight; //设置比例
|
|
56
|
-
this.scale.left = this.styleLeft + this.styleWidth / 2; // left 和 top 的定位坐标
|
|
57
|
-
this.scale.top = this.styleTop + this.styleHeight / 2;
|
|
58
|
-
}
|
|
59
|
-
document.addEventListener("mousemove", this.resize); // mousemove 时移动 mouseup 时停止
|
|
60
|
-
document.addEventListener("mouseup", this.stop);
|
|
61
|
-
},
|
|
62
|
-
// 缩放
|
|
63
|
-
resize(e) {
|
|
64
|
-
window.getSelection().removeAllRanges(); // 清除选择
|
|
65
|
-
this.fn(e);
|
|
66
|
-
if (this.min.enable) {
|
|
67
|
-
if (this.styleHeight <= this.min.height)
|
|
68
|
-
return;
|
|
69
|
-
if (this.styleWidth <= this.min.width)
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
if (this.max.enable) {
|
|
73
|
-
if (this.styleHeight >= this.max.height)
|
|
74
|
-
return;
|
|
75
|
-
if (this.styleWidth >= this.max.width)
|
|
76
|
-
return;
|
|
77
|
-
}
|
|
78
|
-
let s = this.$el.style;
|
|
79
|
-
s.width = this.styleWidth + "px";
|
|
80
|
-
s.height = this.styleHeight + "px";
|
|
81
|
-
s.top = this.styleTop + "px";
|
|
82
|
-
s.left = this.styleLeft + "px";
|
|
83
|
-
},
|
|
84
|
-
// 停止缩放
|
|
85
|
-
stop() {
|
|
86
|
-
document.removeEventListener("mousemove", this.resize);
|
|
87
|
-
document.removeEventListener("mouseup", this.stop);
|
|
88
|
-
},
|
|
89
|
-
//缩放程序
|
|
90
|
-
//上
|
|
91
|
-
up(e) {
|
|
92
|
-
this.styleHeight = Math.max(this.sideDown - e.clientY, 0);
|
|
93
|
-
this.styleTop = this.fixTop - this.styleHeight;
|
|
94
|
-
this.styleLeft = this.scale.left - this.styleWidth / 2;
|
|
95
|
-
console.log(this.styleLeft);
|
|
96
|
-
},
|
|
97
|
-
//下
|
|
98
|
-
down(e) {
|
|
99
|
-
this.styleHeight = Math.max(e.clientY - this.sideUp, 0);
|
|
100
|
-
this.styleLeft = this.scale.left - this.styleWidth / 2;
|
|
101
|
-
},
|
|
102
|
-
//右
|
|
103
|
-
right(e) {
|
|
104
|
-
this.styleWidth = Math.max(e.clientX - this.sideLeft, 0);
|
|
105
|
-
},
|
|
106
|
-
//左
|
|
107
|
-
left(e) {
|
|
108
|
-
this.styleWidth = Math.max(this.sideRight - e.clientX, 0);
|
|
109
|
-
this.styleLeft = this.fixLeft - this.styleWidth;
|
|
110
|
-
},
|
|
111
|
-
//右下
|
|
112
|
-
rightDown(e) {
|
|
113
|
-
this.right(e);
|
|
114
|
-
this.down(e);
|
|
115
|
-
},
|
|
116
|
-
//右上
|
|
117
|
-
rightUp(e) {
|
|
118
|
-
this.right(e);
|
|
119
|
-
this.up(e);
|
|
120
|
-
},
|
|
121
|
-
//左下
|
|
122
|
-
leftDown(e) {
|
|
123
|
-
this.left(e);
|
|
124
|
-
this.down(e);
|
|
125
|
-
},
|
|
126
|
-
//左上
|
|
127
|
-
leftUp(e) {
|
|
128
|
-
this.left(e);
|
|
129
|
-
this.up(e);
|
|
130
|
-
},
|
|
131
|
-
},
|
|
132
|
-
};
|
|
133
|
-
//# sourceMappingURL=Resize.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Resize.js","sourceRoot":"","sources":["../../src/widget/Resize.ts"],"names":[],"mappings":"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"}
|
package/dist/widget/Resize.ts
DELETED
|
@@ -1,152 +0,0 @@
|
|
|
1
|
-
export default {
|
|
2
|
-
data() {
|
|
3
|
-
return {
|
|
4
|
-
styleWidth: 0,// 样式参数值
|
|
5
|
-
styleHeight: 0,
|
|
6
|
-
styleLeft: 0,
|
|
7
|
-
styleTop: 0,
|
|
8
|
-
sideLeft: 0, // 四条边定位坐标
|
|
9
|
-
sideRight: 0,
|
|
10
|
-
sideUp: 0,
|
|
11
|
-
sideDown: 0,
|
|
12
|
-
fixLeft: 0, // top 和 left 定位参数
|
|
13
|
-
fixTop: 0,
|
|
14
|
-
fn: null,
|
|
15
|
-
|
|
16
|
-
LockX: false,// 是否锁定水平方向拖放
|
|
17
|
-
LockY: false,// 是否锁定垂直方向拖放
|
|
18
|
-
Lock: false,// 是否锁定
|
|
19
|
-
|
|
20
|
-
scale: { // 按比例缩放
|
|
21
|
-
enable: true, // 是否按比例缩放
|
|
22
|
-
ratio: 0, // 设置比例(宽/高)
|
|
23
|
-
left: 0,
|
|
24
|
-
top: 0,
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
min: { // 最小控制
|
|
28
|
-
enable: false,
|
|
29
|
-
height: 100,
|
|
30
|
-
width: 200,
|
|
31
|
-
},
|
|
32
|
-
max: { // 最大控制
|
|
33
|
-
enable: false,
|
|
34
|
-
height: 300,
|
|
35
|
-
width: 500,
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
};
|
|
39
|
-
},
|
|
40
|
-
methods: {
|
|
41
|
-
/**
|
|
42
|
-
* 准备拖动
|
|
43
|
-
*/
|
|
44
|
-
start(e: MouseEvent, fn: Function): void {
|
|
45
|
-
this.styleWidth = this.$el.clientWidth;
|
|
46
|
-
this.styleHeight = this.$el.clientHeight;
|
|
47
|
-
this.styleLeft = this.$el.offsetLeft; // 记录鼠标相对拖放对象的位置
|
|
48
|
-
this.styleTop = this.$el.offsetTop;
|
|
49
|
-
|
|
50
|
-
this.sideLeft = e.clientX - this.styleWidth;
|
|
51
|
-
this.sideRight = e.clientX + this.styleWidth;
|
|
52
|
-
this.sideUp = e.clientY - this.styleHeight;
|
|
53
|
-
this.sideDown = e.clientY + this.styleHeight;
|
|
54
|
-
|
|
55
|
-
this.fixLeft = this.styleWidth + this.styleLeft;
|
|
56
|
-
this.fixTop = this.styleHeight + this.styleTop;
|
|
57
|
-
this.fn = fn;
|
|
58
|
-
|
|
59
|
-
if (this.scale.enable) {
|
|
60
|
-
this.scale.ratio = Math.max(this.scale.ratio, 0) || this.styleWidth / this.styleHeight; //设置比例
|
|
61
|
-
this.scale.left = this.styleLeft + this.styleWidth / 2;// left 和 top 的定位坐标
|
|
62
|
-
this.scale.top = this.styleTop + this.styleHeight / 2;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
document.addEventListener("mousemove", this.resize);// mousemove 时移动 mouseup 时停止
|
|
66
|
-
document.addEventListener("mouseup", this.stop);
|
|
67
|
-
},
|
|
68
|
-
|
|
69
|
-
// 缩放
|
|
70
|
-
resize(e: MouseEvent): void {
|
|
71
|
-
window.getSelection().removeAllRanges(); // 清除选择
|
|
72
|
-
this.fn(e);
|
|
73
|
-
|
|
74
|
-
if (this.min.enable) {
|
|
75
|
-
if (this.styleHeight <= this.min.height)
|
|
76
|
-
return;
|
|
77
|
-
if (this.styleWidth <= this.min.width)
|
|
78
|
-
return;
|
|
79
|
-
}
|
|
80
|
-
if (this.max.enable) {
|
|
81
|
-
if (this.styleHeight >= this.max.height)
|
|
82
|
-
return;
|
|
83
|
-
if (this.styleWidth >= this.max.width)
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
let s = this.$el.style;
|
|
88
|
-
s.width = this.styleWidth + "px";
|
|
89
|
-
s.height = this.styleHeight + "px";
|
|
90
|
-
s.top = this.styleTop + "px";
|
|
91
|
-
s.left = this.styleLeft + "px";
|
|
92
|
-
},
|
|
93
|
-
|
|
94
|
-
// 停止缩放
|
|
95
|
-
stop(): void {
|
|
96
|
-
document.removeEventListener("mousemove", this.resize);
|
|
97
|
-
document.removeEventListener("mouseup", this.stop);
|
|
98
|
-
},
|
|
99
|
-
|
|
100
|
-
//缩放程序
|
|
101
|
-
|
|
102
|
-
//上
|
|
103
|
-
up(e: MouseEvent): void {
|
|
104
|
-
this.styleHeight = Math.max(this.sideDown - e.clientY, 0);
|
|
105
|
-
this.styleTop = this.fixTop - this.styleHeight;
|
|
106
|
-
this.styleLeft = this.scale.left - this.styleWidth / 2;
|
|
107
|
-
console.log(this.styleLeft)
|
|
108
|
-
},
|
|
109
|
-
|
|
110
|
-
//下
|
|
111
|
-
down(e: MouseEvent): void {
|
|
112
|
-
this.styleHeight = Math.max(e.clientY - this.sideUp, 0);
|
|
113
|
-
this.styleLeft = this.scale.left - this.styleWidth / 2;
|
|
114
|
-
|
|
115
|
-
},
|
|
116
|
-
|
|
117
|
-
//右
|
|
118
|
-
right(e: MouseEvent): void {
|
|
119
|
-
this.styleWidth = Math.max(e.clientX - this.sideLeft, 0);
|
|
120
|
-
},
|
|
121
|
-
|
|
122
|
-
//左
|
|
123
|
-
left(e: MouseEvent): void {
|
|
124
|
-
this.styleWidth = Math.max(this.sideRight - e.clientX, 0);
|
|
125
|
-
this.styleLeft = this.fixLeft - this.styleWidth;
|
|
126
|
-
},
|
|
127
|
-
|
|
128
|
-
//右下
|
|
129
|
-
rightDown(e: MouseEvent): void {
|
|
130
|
-
this.right(e);
|
|
131
|
-
this.down(e);
|
|
132
|
-
},
|
|
133
|
-
|
|
134
|
-
//右上
|
|
135
|
-
rightUp(e: MouseEvent): void {
|
|
136
|
-
this.right(e);
|
|
137
|
-
this.up(e);
|
|
138
|
-
},
|
|
139
|
-
|
|
140
|
-
//左下
|
|
141
|
-
leftDown(e: MouseEvent): void {
|
|
142
|
-
this.left(e);
|
|
143
|
-
this.down(e);
|
|
144
|
-
},
|
|
145
|
-
|
|
146
|
-
//左上
|
|
147
|
-
leftUp(e: MouseEvent): void {
|
|
148
|
-
this.left(e);
|
|
149
|
-
this.up(e);
|
|
150
|
-
},
|
|
151
|
-
},
|
|
152
|
-
};
|
package/dist/widget/Resize.vue
DELETED
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<!-- 拖拉缩放效果 -->
|
|
3
|
-
<div class="resize-box">
|
|
4
|
-
<div class="rRightDown" @mousedown="start($event, rightDown)"> </div>
|
|
5
|
-
<div class="rLeftDown" @mousedown="start($event, leftDown)"> </div>
|
|
6
|
-
<div class="rRightUp" @mousedown="start($event, rightUp)"> </div>
|
|
7
|
-
<div class="rLeftUp" @mousedown="start($event, leftUp)"> </div>
|
|
8
|
-
<div class="rRight" @mousedown="start($event, right)"> </div>
|
|
9
|
-
<div class="rLeft" @mousedown="start($event, left)"> </div>
|
|
10
|
-
<div class="rDown" @mousedown="start($event, down)"></div>
|
|
11
|
-
<div class="rUp" @mousedown="start($event, up)"> </div>
|
|
12
|
-
</div>
|
|
13
|
-
</template>
|
|
14
|
-
|
|
15
|
-
<script lang="ts" src="./Resize.ts"></script>
|
|
16
|
-
|
|
17
|
-
<style lang="less" scoped>
|
|
18
|
-
.rRightDown,
|
|
19
|
-
.rLeftDown,
|
|
20
|
-
.rLeftUp,
|
|
21
|
-
.rRightUp,
|
|
22
|
-
.rRight,
|
|
23
|
-
.rLeft,
|
|
24
|
-
.rUp,
|
|
25
|
-
.rDown {
|
|
26
|
-
position: absolute;
|
|
27
|
-
background: #c00;
|
|
28
|
-
width: 7px;
|
|
29
|
-
height: 7px;
|
|
30
|
-
z-index: 5;
|
|
31
|
-
font-size: 0;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.rLeftDown, .rRightUp {
|
|
35
|
-
cursor: ne-resize;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.rRightDown, .rLeftUp {
|
|
39
|
-
cursor: nw-resize;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
.rRight, .rLeft {
|
|
43
|
-
cursor: e-resize;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
.rUp, .rDown {
|
|
47
|
-
cursor: n-resize;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.rLeftDown {
|
|
51
|
-
left: -4px;
|
|
52
|
-
bottom: -4px;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.rRightUp {
|
|
56
|
-
right: -4px;
|
|
57
|
-
top: -4px;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.rRightDown {
|
|
61
|
-
right: -4px;
|
|
62
|
-
bottom: -4px;
|
|
63
|
-
background-color: 0f;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.rLeftUp {
|
|
67
|
-
left: -4px;
|
|
68
|
-
top: -4px;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
.rRight {
|
|
72
|
-
right: -4px;
|
|
73
|
-
top: 50%;
|
|
74
|
-
margin-top: -4px;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
.rLeft {
|
|
78
|
-
left: -4px;
|
|
79
|
-
top: 50%;
|
|
80
|
-
margin-top: -4px;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
.rUp {
|
|
84
|
-
top: -4px;
|
|
85
|
-
left: 50%;
|
|
86
|
-
margin-left: -4px;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.rDown {
|
|
90
|
-
bottom: -4px;
|
|
91
|
-
left: 50%;
|
|
92
|
-
margin-left: -4px;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.resize-box {
|
|
96
|
-
border: 1px solid gray;
|
|
97
|
-
width: 100px;
|
|
98
|
-
height: 60px;
|
|
99
|
-
top: 150px;
|
|
100
|
-
left: 550px;
|
|
101
|
-
background: #fff;
|
|
102
|
-
position: absolute;
|
|
103
|
-
}
|
|
104
|
-
</style>
|