@neatui/vue 1.2.20 → 1.2.22
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/package.json
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
@mouseover="hovershow"
|
|
15
15
|
@mouseout="hoverhide"
|
|
16
16
|
>
|
|
17
|
-
<div ref="box" :ui-tips-box="state.pos" :class="tipBoxClass" :style="tipBoxStyle">
|
|
17
|
+
<div ref="box" :ui-tips-box="state.pos" :class="tipBoxClass" :style="tipBoxStyle" @mousedown="downdom">
|
|
18
18
|
<slot name="tips"></slot>
|
|
19
19
|
<div ui-tips-arrow=""></div>
|
|
20
20
|
</div>
|
|
@@ -67,7 +67,8 @@
|
|
|
67
67
|
view: 0,
|
|
68
68
|
show: 0,
|
|
69
69
|
pos: props.pos,
|
|
70
|
-
hover: 0
|
|
70
|
+
hover: 0,
|
|
71
|
+
tipdom: false
|
|
71
72
|
});
|
|
72
73
|
|
|
73
74
|
const showTimer: any = ref(null);
|
|
@@ -131,11 +132,24 @@
|
|
|
131
132
|
|
|
132
133
|
// 取消
|
|
133
134
|
const cancel = ({ target }: any = {}) => {
|
|
134
|
-
if (tip.value && !tip.value?.contains(target) && dom.value && !dom.value.contains(target)) {
|
|
135
|
+
if (tip.value && !state.tipdom && !tip.value?.contains(target) && dom.value && !dom.value.contains(target) && !tip.value.querySelector('input:focus')) {
|
|
135
136
|
state.show = 0;
|
|
136
137
|
}
|
|
137
138
|
};
|
|
138
139
|
|
|
140
|
+
const downdom = (ev: any) => {
|
|
141
|
+
state.tipdom = true;
|
|
142
|
+
document.addEventListener(
|
|
143
|
+
'mouseup',
|
|
144
|
+
() => {
|
|
145
|
+
setTimeout(() => {
|
|
146
|
+
state.tipdom = false;
|
|
147
|
+
}, 10);
|
|
148
|
+
},
|
|
149
|
+
true
|
|
150
|
+
);
|
|
151
|
+
};
|
|
152
|
+
|
|
139
153
|
onMounted(() => {
|
|
140
154
|
document.addEventListener('click', cancel, true);
|
|
141
155
|
});
|
|
@@ -1,16 +1,19 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div :am-view="view" :am-mode="mode" class="
|
|
2
|
+
<div :am-view="view" :am-mode="mode" class="iroute-view pr full bg-back" :view-full="full ? 1 : 0" @animationend="anim">
|
|
3
3
|
<div :class="listClass" :style="listStyle" am-view-item="list">
|
|
4
4
|
<slot name="list" :mode="mode"></slot>
|
|
5
5
|
</div>
|
|
6
6
|
<div :class="itemClass" :style="itemStyle" am-view-item="item" ref="itemRef" v-if="view === 'iteming' || view === 'listing' || view === 'item'">
|
|
7
|
-
<
|
|
7
|
+
<div class="iroute-view-dark" @click="cancel"></div>
|
|
8
|
+
<div class="iroute-view-body" :style="mode === 'preview' || mode === 'pop-up' ? 'box-shadow: rgba(0, 0, 0, 0.08) -5px 0px 10px 0px;' : 'width: 100%;'">
|
|
9
|
+
<slot name="item" :mode="mode"></slot>
|
|
10
|
+
</div>
|
|
8
11
|
</div>
|
|
9
12
|
</div>
|
|
10
13
|
</template>
|
|
11
14
|
<script setup lang="ts">
|
|
12
15
|
import { deepcopy } from '@fekit/utils';
|
|
13
|
-
import {
|
|
16
|
+
import { ref, watch, provide, reactive } from 'vue';
|
|
14
17
|
import { useRoute, useRouter } from 'vue-router';
|
|
15
18
|
const route = useRoute();
|
|
16
19
|
const router = useRouter();
|
|
@@ -93,39 +96,32 @@
|
|
|
93
96
|
watch(() => route.query[props.queryName], a);
|
|
94
97
|
a();
|
|
95
98
|
|
|
96
|
-
const itemRef: any = ref(null);
|
|
97
99
|
// 取消
|
|
98
100
|
const cancel = ({ target }: any = {}) => {
|
|
99
|
-
const
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
const layers: any = document.querySelectorAll('.fekit-layer');
|
|
103
|
-
if (
|
|
104
|
-
itemRef.value &&
|
|
105
|
-
!itemRef.value.contains(target) &&
|
|
106
|
-
!ifollow?.contains(target) &&
|
|
107
|
-
!fekit?.contains(target) &&
|
|
108
|
-
Array.from(layers).every((t: any) => !t.contains(target)) &&
|
|
109
|
-
Array.from(toasts).every((t: any) => !t.contains(target))
|
|
110
|
-
) {
|
|
111
|
-
const _query = { ...route.query };
|
|
112
|
-
delete _query[props.queryName];
|
|
113
|
-
router.push({ path: route.path, query: _query });
|
|
114
|
-
}
|
|
101
|
+
const _query = { ...route.query };
|
|
102
|
+
delete _query[props.queryName];
|
|
103
|
+
router.push({ path: route.path, query: _query });
|
|
115
104
|
};
|
|
116
|
-
onMounted(() => {
|
|
117
|
-
if (props.mode === 'preview' || props.mode === 'pop-up') {
|
|
118
|
-
document.addEventListener('click', cancel, true);
|
|
119
|
-
}
|
|
120
|
-
});
|
|
121
|
-
onUnmounted(() => {
|
|
122
|
-
if (props.mode === 'preview' || props.mode === 'pop-up') {
|
|
123
|
-
document.removeEventListener('click', cancel, true);
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
105
|
</script>
|
|
127
106
|
|
|
128
107
|
<style lang="scss">
|
|
108
|
+
.iroute-view-dark {
|
|
109
|
+
position: absolute;
|
|
110
|
+
width: 100%;
|
|
111
|
+
height: 100%;
|
|
112
|
+
left: 0;
|
|
113
|
+
top: 0;
|
|
114
|
+
}
|
|
115
|
+
.iroute-view-body {
|
|
116
|
+
z-index: 1;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
[am-mode='preview'] {
|
|
120
|
+
.iroute-view-body > * {
|
|
121
|
+
height: 100%;
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
|
|
129
125
|
// 默认模式
|
|
130
126
|
[am-view][am-mode~='default'] {
|
|
131
127
|
overflow: hidden;
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<ul ui-flex="row lm" v-bind="{ ...attrs }">
|
|
3
|
-
|
|
4
|
-
state.files
|
|
5
|
-
}}
|
|
6
|
-
<li v-for="(file, idx) in state.files" :key="idx" ui-flex="col cm" class="bg-fore ny-mm w-mm h-mm b-solid b-line b-xs">
|
|
2
|
+
<ul ui-flex="row lm :wrap" class="mb-ss-sub mr-ss-sub" v-bind="{ ...attrs }">
|
|
3
|
+
<li v-for="(file, idx) in state.files" :key="idx" ui-flex="col cm" class="flex-fixed bg-fore n-sl w-ms h-ms b-solid b-line b-xs">
|
|
7
4
|
<img v-if="file.type === 'image'" :src="file.path" alt="" />
|
|
8
|
-
<
|
|
9
|
-
<svg t="1705645350800" class="w-
|
|
5
|
+
<template v-else-if="file.type === 'pdf'">
|
|
6
|
+
<svg t="1705645350800" class="w-ss h-ss" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1913">
|
|
10
7
|
<path
|
|
11
8
|
d="M205.5 64H665l232 232v639c0 13.807-11.193 25-25 25H205.5c-13.807 0-25-11.193-25-25V89c0-13.807 11.193-25 25-25z m449.145 25H205.5v846H872V306.355L654.645 89z"
|
|
12
9
|
fill="#B7B7BD"
|
|
@@ -25,9 +22,9 @@
|
|
|
25
22
|
p-id="1922"
|
|
26
23
|
></path>
|
|
27
24
|
</svg>
|
|
28
|
-
</
|
|
29
|
-
<
|
|
30
|
-
<svg t="1705645380770" class="w-
|
|
25
|
+
</template>
|
|
26
|
+
<template v-else-if="file.type === 'xlsx'">
|
|
27
|
+
<svg t="1705645380770" class="w-ss h-ss" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2060">
|
|
31
28
|
<path
|
|
32
29
|
d="M205.799024 64.936585H664.850732l231.773658 231.773659v638.376585c0 13.79353-11.18208 24.97561-24.97561 24.97561H205.799024c-13.79353 0-24.97561-11.18208-24.975609-24.97561V89.912195c0-13.79353 11.18208-24.97561 24.975609-24.97561z m448.70681 24.97561H205.799024v845.174634H871.64878V307.055141L654.505834 89.912195z"
|
|
33
30
|
fill="#B7B7BD"
|
|
@@ -74,9 +71,9 @@
|
|
|
74
71
|
p-id="2069"
|
|
75
72
|
></path>
|
|
76
73
|
</svg>
|
|
77
|
-
</
|
|
78
|
-
<
|
|
79
|
-
<svg t="1705645401993" class="w-
|
|
74
|
+
</template>
|
|
75
|
+
<template v-else-if="file.type === 'docx'">
|
|
76
|
+
<svg t="1705645401993" class="w-ss h-ss" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2207">
|
|
80
77
|
<path
|
|
81
78
|
d="M205.5 64H665l232 232v639c0 13.807-11.193 25-25 25H205.5c-13.807 0-25-11.193-25-25V89c0-13.807 11.193-25 25-25z m449.145 25H205.5v846H872V306.355L654.645 89z"
|
|
82
79
|
fill="#B7B7BD"
|
|
@@ -95,9 +92,9 @@
|
|
|
95
92
|
p-id="2216"
|
|
96
93
|
></path>
|
|
97
94
|
</svg>
|
|
98
|
-
</
|
|
99
|
-
<
|
|
100
|
-
<svg t="1705645414803" class="w-
|
|
95
|
+
</template>
|
|
96
|
+
<template v-else-if="file.type === 'pptx'">
|
|
97
|
+
<svg t="1705645414803" class="w-ss h-ss" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2354">
|
|
101
98
|
<path
|
|
102
99
|
d="M205.5 64H665l232 232v639c0 13.807-11.193 25-25 25H205.5c-13.807 0-25-11.193-25-25V89c0-13.807 11.193-25 25-25z m449.145 25H205.5v846H872V306.355L654.645 89z"
|
|
103
100
|
fill="#B7B7BD"
|
|
@@ -116,9 +113,9 @@
|
|
|
116
113
|
p-id="2363"
|
|
117
114
|
></path>
|
|
118
115
|
</svg>
|
|
119
|
-
</
|
|
120
|
-
<
|
|
121
|
-
<svg t="1705645436666" class="w-
|
|
116
|
+
</template>
|
|
117
|
+
<template v-else>
|
|
118
|
+
<svg t="1705645436666" class="w-ss h-ss" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2501">
|
|
122
119
|
<path
|
|
123
120
|
d="M205.5 64H665l232 232v639c0 13.807-11.193 25-25 25H205.5c-13.807 0-25-11.193-25-25V89c0-13.807 11.193-25 25-25z m449.145 25H205.5v846H872V306.355L654.645 89z"
|
|
124
121
|
fill="#B7B7BD"
|
|
@@ -137,18 +134,18 @@
|
|
|
137
134
|
p-id="2510"
|
|
138
135
|
></path>
|
|
139
136
|
</svg>
|
|
140
|
-
</
|
|
141
|
-
<p>{{ file.name }}</p>
|
|
137
|
+
</template>
|
|
138
|
+
<p ui-omit="1" class="fs-ss ac">{{ file.name }}</p>
|
|
142
139
|
</li>
|
|
143
140
|
<li v-if="(!multiple && state.files && state.files.length === 0) || (multiple && (!limit || (limit && state.files && state.files.length < limit)))">
|
|
144
141
|
<slot>
|
|
145
|
-
<label ui-flex="row cm" ui-form="@a type:upload tips:hover" :class="`upload bg-fore b-solid b-
|
|
142
|
+
<label ui-flex="row cm" ui-form="@a type:upload tips:hover" :class="`upload w-ms h-ms n-sl bg-fore b-solid b-line b-xs ${uploadClass}`" :style="uploadStyle">
|
|
146
143
|
<div v-if="tips" ui-form-tips>
|
|
147
144
|
{{ tips }}
|
|
148
145
|
</div>
|
|
149
146
|
<input style="display: none" type="file" class="pa input" :multiple="multiple" @change="change" />
|
|
150
147
|
<div class="co-note ac input-icon">
|
|
151
|
-
<svg t="1705642180833"
|
|
148
|
+
<svg t="1705642180833" style="width: 1em; height: 1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4215">
|
|
152
149
|
<path
|
|
153
150
|
d="M906.212134 565.732986 565.732986 565.732986 565.732986 906.212134C565.732986 926.013685 541.666486 959.972 511.97312 959.972 482.297674 959.972 458.213254 926.013685 458.213254 906.212134L458.213254 565.732986 117.734106 565.732986C97.950475 565.732986 63.97424 541.666486 63.97424 511.97312 63.97424 482.279754 97.950475 458.213254 117.734106 458.213254L458.213254 458.213254 458.213254 117.734106C458.213254 97.950475 482.297674 63.97424 511.97312 63.97424 541.666486 63.97424 565.732986 97.950475 565.732986 117.734106L565.732986 458.213254 906.212134 458.213254C925.995765 458.213254 959.972 482.279754 959.972 511.97312 959.972 541.666486 925.995765 565.732986 906.212134 565.732986Z"
|
|
154
151
|
p-id="4216"
|
|
@@ -174,8 +171,8 @@
|
|
|
174
171
|
interface Props {
|
|
175
172
|
modelValue?: string | any[];
|
|
176
173
|
// 文件限制数量
|
|
177
|
-
limit
|
|
178
|
-
attrs
|
|
174
|
+
limit?: number;
|
|
175
|
+
attrs?: object;
|
|
179
176
|
uploadClass?: string;
|
|
180
177
|
uploadStyle?: string;
|
|
181
178
|
id?: string;
|
|
@@ -189,7 +186,7 @@
|
|
|
189
186
|
// 上传路径
|
|
190
187
|
action?: string;
|
|
191
188
|
// 请求上传接口
|
|
192
|
-
upload
|
|
189
|
+
upload?: (formData: FormData) => Promise<any>;
|
|
193
190
|
}
|
|
194
191
|
|
|
195
192
|
const props = withDefaults(defineProps<Props>(), {
|
|
@@ -221,9 +218,9 @@
|
|
|
221
218
|
// });
|
|
222
219
|
// };
|
|
223
220
|
|
|
224
|
-
const uploadClick = () => {
|
|
225
|
-
|
|
226
|
-
};
|
|
221
|
+
// const uploadClick = () => {
|
|
222
|
+
// LayerById(layerId).show();
|
|
223
|
+
// };
|
|
227
224
|
|
|
228
225
|
// const update = () => {
|
|
229
226
|
// emit('update:modelValue', isArray(props.modelValue) ? files.value : files.value.length > 0 ? files.value[0].imgUrl : '');
|
|
@@ -246,7 +243,7 @@
|
|
|
246
243
|
type = 'pdf';
|
|
247
244
|
} else if (_file.type === 'text/html') {
|
|
248
245
|
type = 'html';
|
|
249
|
-
} else if (_file.type.startsWith('image/')) {
|
|
246
|
+
} else if (_file.type.startsWith('image/') && _file.type !== 'image/vnd.adobe.photoshop') {
|
|
250
247
|
type = 'image';
|
|
251
248
|
}
|
|
252
249
|
const file: any = { name: _file.name, type, path: URL.createObjectURL(_file), url: await props.upload(_file) };
|