n20-project-component 1.0.0 → 1.0.1
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 +132 -44
- package/dist/n20-project-component.common.js +24 -28
- package/dist/n20-project-component.css +1 -1
- package/dist/n20-project-component.umd.js +24 -28
- package/dist/n20-project-component.umd.min.js +1 -1
- package/package.json +1 -1
- package/src/components/N20CopyText/index.vue +3 -41
package/README.md
CHANGED
|
@@ -1,6 +1,76 @@
|
|
|
1
1
|
# n20-project-component
|
|
2
2
|
|
|
3
|
-
PC 端 Vue 2 + Element UI
|
|
3
|
+
PC 端 Vue 2 + Element UI 通用组件库，公司内部项目复用。
|
|
4
|
+
|
|
5
|
+
## 组件列表
|
|
6
|
+
|
|
7
|
+
| 组件 | 说明 | 状态 |
|
|
8
|
+
|------|------|------|
|
|
9
|
+
| N20CopyText | 点击复制文本，弹出「已复制」反馈 | ✅ 已完成 |
|
|
10
|
+
| N20FloatingToolbar | 选中文字后浮现操作工具条 | 🔲 待开发 |
|
|
11
|
+
| N20Marquee | 滚动通知条（水平/垂直） | 🔲 待开发 |
|
|
12
|
+
| N20FrequentWords | 常用词输入，自动记录到本地缓存 | 🔲 待开发 |
|
|
13
|
+
| N20BatchInput | 批量输入，粘贴自动拆分为多个标签 | 🔲 待开发 |
|
|
14
|
+
|
|
15
|
+
---
|
|
16
|
+
|
|
17
|
+
## 发布
|
|
18
|
+
|
|
19
|
+
### 前置条件
|
|
20
|
+
|
|
21
|
+
- Node 14+
|
|
22
|
+
- npm 账号（[注册地址](https://www.npmjs.com/signup)）
|
|
23
|
+
- npm 账号需开启 2FA 或创建 Granular Access Token
|
|
24
|
+
|
|
25
|
+
### 构建
|
|
26
|
+
|
|
27
|
+
```bash
|
|
28
|
+
npm run build
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
构建产物在 `dist/` 目录下：
|
|
32
|
+
|
|
33
|
+
```
|
|
34
|
+
dist/
|
|
35
|
+
├── n20-project-component.umd.min.js # UMD 压缩版
|
|
36
|
+
├── n20-project-component.umd.js # UMD 开发版
|
|
37
|
+
├── n20-project-component.common.js # CommonJS
|
|
38
|
+
└── n20-project-component.css # 样式文件
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
### 发布到 npm
|
|
42
|
+
|
|
43
|
+
```bash
|
|
44
|
+
# 首次使用先登录
|
|
45
|
+
npm login
|
|
46
|
+
|
|
47
|
+
# 发布（需要 2FA 验证码）
|
|
48
|
+
npm publish --otp=你的6位验证码
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
如果用 Access Token 方式发布：
|
|
52
|
+
|
|
53
|
+
```bash
|
|
54
|
+
npm publish --access public --//registry.npmjs.org/:_authToken=你的token
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
### 更新版本
|
|
58
|
+
|
|
59
|
+
```bash
|
|
60
|
+
# 补丁版本 1.0.0 → 1.0.1
|
|
61
|
+
npm version patch
|
|
62
|
+
|
|
63
|
+
# 次版本 1.0.0 → 1.1.0
|
|
64
|
+
npm version minor
|
|
65
|
+
|
|
66
|
+
# 主版本 1.0.0 → 2.0.0
|
|
67
|
+
npm version major
|
|
68
|
+
|
|
69
|
+
# 然后发布
|
|
70
|
+
npm publish --otp=验证码
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
---
|
|
4
74
|
|
|
5
75
|
## 安装
|
|
6
76
|
|
|
@@ -8,9 +78,13 @@ PC 端 Vue 2 + Element UI 组件库，供公司内部项目复用。
|
|
|
8
78
|
npm install n20-project-component
|
|
9
79
|
```
|
|
10
80
|
|
|
81
|
+
---
|
|
82
|
+
|
|
11
83
|
## 使用
|
|
12
84
|
|
|
13
|
-
###
|
|
85
|
+
### 全量引入
|
|
86
|
+
|
|
87
|
+
在 `main.js` 中：
|
|
14
88
|
|
|
15
89
|
```javascript
|
|
16
90
|
import Vue from 'vue'
|
|
@@ -20,72 +94,86 @@ import 'n20-project-component/dist/n20-project-component.css'
|
|
|
20
94
|
Vue.use(N20Components)
|
|
21
95
|
```
|
|
22
96
|
|
|
23
|
-
|
|
97
|
+
之后在任意 `.vue` 文件中直接使用：
|
|
98
|
+
|
|
99
|
+
```vue
|
|
100
|
+
<N20CopyText text="BILL-2024-001">BILL-2024-001</N20CopyText>
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
### 按需引入
|
|
24
104
|
|
|
25
105
|
```javascript
|
|
26
|
-
import {
|
|
106
|
+
import { N20CopyText } from 'n20-project-component'
|
|
27
107
|
import 'n20-project-component/dist/n20-project-component.css'
|
|
28
108
|
|
|
109
|
+
// 全局注册
|
|
110
|
+
Vue.component('N20CopyText', N20CopyText)
|
|
111
|
+
|
|
112
|
+
// 或在组件内局部注册
|
|
29
113
|
export default {
|
|
30
|
-
components: {
|
|
114
|
+
components: { N20CopyText }
|
|
31
115
|
}
|
|
32
116
|
```
|
|
33
117
|
|
|
34
|
-
|
|
118
|
+
---
|
|
35
119
|
|
|
36
|
-
|
|
37
|
-
# 安装依赖
|
|
38
|
-
npm install
|
|
120
|
+
## 组件文档
|
|
39
121
|
|
|
40
|
-
|
|
41
|
-
npm run dev
|
|
42
|
-
|
|
43
|
-
# 构建组件库
|
|
44
|
-
npm run build
|
|
45
|
-
```
|
|
122
|
+
### N20CopyText
|
|
46
123
|
|
|
47
|
-
|
|
124
|
+
点击复制文本到剪贴板，显示「已复制」反馈气泡。
|
|
48
125
|
|
|
49
|
-
|
|
126
|
+
#### 基础用法
|
|
50
127
|
|
|
128
|
+
```vue
|
|
129
|
+
<N20CopyText text="需要复制的内容">显示的文字</N20CopyText>
|
|
51
130
|
```
|
|
52
|
-
|
|
53
|
-
|
|
131
|
+
|
|
132
|
+
#### 在表格中使用
|
|
133
|
+
|
|
134
|
+
```vue
|
|
135
|
+
<el-table-column label="单据编号">
|
|
136
|
+
<template slot-scope="{ row }">
|
|
137
|
+
<N20CopyText :text="row.billNo">{{ row.billNo }}</N20CopyText>
|
|
138
|
+
</template>
|
|
139
|
+
</el-table-column>
|
|
54
140
|
```
|
|
55
141
|
|
|
56
|
-
|
|
142
|
+
#### Props
|
|
57
143
|
|
|
58
|
-
|
|
59
|
-
|
|
144
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
145
|
+
|------|------|------|--------|
|
|
146
|
+
| text | 要复制的文本，留空则取 slot 内容 | String / Number | '' |
|
|
147
|
+
| successTip | 复制成功提示 | String | '已复制' |
|
|
148
|
+
| showIcon | 是否显示复制图标 | Boolean | true |
|
|
149
|
+
| iconPosition | 图标位置 left / right | String | 'right' |
|
|
150
|
+
| disabled | 是否禁用 | Boolean | false |
|
|
60
151
|
|
|
61
|
-
|
|
62
|
-
const components = {
|
|
63
|
-
// ...
|
|
64
|
-
MyComponent,
|
|
65
|
-
}
|
|
152
|
+
#### Events
|
|
66
153
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
}
|
|
72
|
-
```
|
|
154
|
+
| 事件名 | 说明 | 参数 |
|
|
155
|
+
|--------|------|------|
|
|
156
|
+
| copy | 复制成功 | (text) |
|
|
157
|
+
| error | 复制失败 | (error) |
|
|
73
158
|
|
|
74
|
-
|
|
159
|
+
---
|
|
75
160
|
|
|
76
|
-
##
|
|
161
|
+
## 本地开发
|
|
77
162
|
|
|
78
163
|
```bash
|
|
79
|
-
#
|
|
80
|
-
npm
|
|
164
|
+
# 安装依赖
|
|
165
|
+
npm install
|
|
81
166
|
|
|
82
|
-
#
|
|
83
|
-
npm
|
|
84
|
-
```
|
|
167
|
+
# 启动开发调试（examples 目录）
|
|
168
|
+
npm run dev
|
|
85
169
|
|
|
86
|
-
|
|
170
|
+
# 构建
|
|
171
|
+
npm run build
|
|
172
|
+
```
|
|
87
173
|
|
|
88
|
-
|
|
174
|
+
新增组件步骤：
|
|
89
175
|
|
|
90
|
-
|
|
91
|
-
|
|
176
|
+
1. 在 `src/components/` 下创建组件目录和 `index.vue`
|
|
177
|
+
2. 在 `src/index.js` 中导入并注册
|
|
178
|
+
3. 在 `examples/App.vue` 中添加使用示例
|
|
179
|
+
4. `npm run dev` 调试验证
|
|
@@ -87,13 +87,6 @@ module.exports =
|
|
|
87
87
|
/************************************************************************/
|
|
88
88
|
/******/ ({
|
|
89
89
|
|
|
90
|
-
/***/ "00be":
|
|
91
|
-
/***/ (function(module, exports, __webpack_require__) {
|
|
92
|
-
|
|
93
|
-
// extracted by mini-css-extract-plugin
|
|
94
|
-
|
|
95
|
-
/***/ }),
|
|
96
|
-
|
|
97
90
|
/***/ "021e":
|
|
98
91
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
99
92
|
|
|
@@ -105,15 +98,22 @@ module.exports =
|
|
|
105
98
|
|
|
106
99
|
/***/ }),
|
|
107
100
|
|
|
108
|
-
/***/ "
|
|
101
|
+
/***/ "3f46":
|
|
109
102
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
110
103
|
|
|
111
104
|
"use strict";
|
|
112
|
-
/* harmony import */ var
|
|
113
|
-
/* harmony import */ var
|
|
105
|
+
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("c5db");
|
|
106
|
+
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
|
|
114
107
|
/* unused harmony reexport * */
|
|
115
108
|
|
|
116
109
|
|
|
110
|
+
/***/ }),
|
|
111
|
+
|
|
112
|
+
/***/ "c5db":
|
|
113
|
+
/***/ (function(module, exports, __webpack_require__) {
|
|
114
|
+
|
|
115
|
+
// extracted by mini-css-extract-plugin
|
|
116
|
+
|
|
117
117
|
/***/ }),
|
|
118
118
|
|
|
119
119
|
/***/ "f14e":
|
|
@@ -150,7 +150,7 @@ if (typeof window !== 'undefined') {
|
|
|
150
150
|
// Indicate to webpack that this file can be concatenated
|
|
151
151
|
/* harmony default export */ var setPublicPath = (null);
|
|
152
152
|
|
|
153
|
-
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"
|
|
153
|
+
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"733de36c-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/DemoButton/index.vue?vue&type=template&id=1c0b7107&scoped=true
|
|
154
154
|
var render = function render() {
|
|
155
155
|
var _vm = this,
|
|
156
156
|
_c = _vm._self._c;
|
|
@@ -347,8 +347,8 @@ var component = normalizeComponent(
|
|
|
347
347
|
)
|
|
348
348
|
|
|
349
349
|
/* harmony default export */ var DemoButton = (component.exports);
|
|
350
|
-
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"
|
|
351
|
-
var
|
|
350
|
+
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"733de36c-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/N20CopyText/index.vue?vue&type=template&id=35583176&scoped=true
|
|
351
|
+
var N20CopyTextvue_type_template_id_35583176_scoped_true_render = function render() {
|
|
352
352
|
var _vm = this,
|
|
353
353
|
_c = _vm._self._c;
|
|
354
354
|
return _c('span', {
|
|
@@ -369,23 +369,17 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_render = function rende
|
|
|
369
369
|
style: {
|
|
370
370
|
order: _vm.iconPosition === 'left' ? -1 : 1
|
|
371
371
|
}
|
|
372
|
-
}) : _vm._e()
|
|
373
|
-
attrs: {
|
|
374
|
-
"name": "n20-copy-fade"
|
|
375
|
-
}
|
|
376
|
-
}, [_vm.copied ? _c('span', {
|
|
377
|
-
staticClass: "n20-copy-text__tip"
|
|
378
|
-
}, [_vm._v(_vm._s(_vm.successTip))]) : _vm._e()])], 1);
|
|
372
|
+
}) : _vm._e()]);
|
|
379
373
|
};
|
|
380
|
-
var
|
|
374
|
+
var N20CopyTextvue_type_template_id_35583176_scoped_true_staticRenderFns = [];
|
|
381
375
|
|
|
382
|
-
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=template&id=
|
|
376
|
+
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=template&id=35583176&scoped=true
|
|
383
377
|
|
|
384
378
|
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/N20CopyText/index.vue?vue&type=script&lang=js
|
|
385
379
|
/**
|
|
386
380
|
* N20CopyText - 点击复制文本组件
|
|
387
381
|
*
|
|
388
|
-
*
|
|
382
|
+
* 点击后将指定文本复制到剪贴板，通过 Element Message 显示成功反馈。
|
|
389
383
|
*
|
|
390
384
|
* @example
|
|
391
385
|
* <N20CopyText :text="row.billNo">{{ row.billNo }}</N20CopyText>
|
|
@@ -453,11 +447,13 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_staticRenderFns = [];
|
|
|
453
447
|
document.body.removeChild(textarea);
|
|
454
448
|
}
|
|
455
449
|
this.copied = true;
|
|
450
|
+
this.$message.success(this.successTip);
|
|
456
451
|
this.$emit('copy', String(copyText));
|
|
457
452
|
this.timer = setTimeout(() => {
|
|
458
453
|
this.copied = false;
|
|
459
454
|
}, 2000);
|
|
460
455
|
} catch (err) {
|
|
456
|
+
this.$message.error('复制失败');
|
|
461
457
|
this.$emit('error', err);
|
|
462
458
|
}
|
|
463
459
|
}
|
|
@@ -465,8 +461,8 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_staticRenderFns = [];
|
|
|
465
461
|
});
|
|
466
462
|
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=script&lang=js
|
|
467
463
|
/* harmony default export */ var components_N20CopyTextvue_type_script_lang_js = (N20CopyTextvue_type_script_lang_js);
|
|
468
|
-
// EXTERNAL MODULE: ./src/components/N20CopyText/index.vue?vue&type=style&index=0&id=
|
|
469
|
-
var
|
|
464
|
+
// EXTERNAL MODULE: ./src/components/N20CopyText/index.vue?vue&type=style&index=0&id=35583176&prod&lang=scss&scoped=true
|
|
465
|
+
var N20CopyTextvue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true = __webpack_require__("3f46");
|
|
470
466
|
|
|
471
467
|
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue
|
|
472
468
|
|
|
@@ -479,11 +475,11 @@ var N20CopyTextvue_type_style_index_0_id_540c418a_prod_lang_scss_scoped_true = _
|
|
|
479
475
|
|
|
480
476
|
var N20CopyText_component = normalizeComponent(
|
|
481
477
|
components_N20CopyTextvue_type_script_lang_js,
|
|
482
|
-
|
|
483
|
-
|
|
478
|
+
N20CopyTextvue_type_template_id_35583176_scoped_true_render,
|
|
479
|
+
N20CopyTextvue_type_template_id_35583176_scoped_true_staticRenderFns,
|
|
484
480
|
false,
|
|
485
481
|
null,
|
|
486
|
-
"
|
|
482
|
+
"35583176",
|
|
487
483
|
null
|
|
488
484
|
|
|
489
485
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.n20-demo-button[data-v-1c0b7107]{border-radius:4px;font-size:14px}.n20-copy-text[data-v-
|
|
1
|
+
.n20-demo-button[data-v-1c0b7107]{border-radius:4px;font-size:14px}.n20-copy-text[data-v-35583176]{display:inline-flex;align-items:center;gap:4px;cursor:pointer}.n20-copy-text:hover .n20-copy-text__icon[data-v-35583176]{opacity:1}.n20-copy-text__content[data-v-35583176]{display:inline}.n20-copy-text__icon[data-v-35583176]{font-size:14px;color:#909399;opacity:.4;transition:all .2s ease}.n20-copy-text__icon.el-icon-check[data-v-35583176]{color:#67c23a;opacity:1}
|
|
@@ -96,13 +96,6 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
|
96
96
|
/************************************************************************/
|
|
97
97
|
/******/ ({
|
|
98
98
|
|
|
99
|
-
/***/ "00be":
|
|
100
|
-
/***/ (function(module, exports, __webpack_require__) {
|
|
101
|
-
|
|
102
|
-
// extracted by mini-css-extract-plugin
|
|
103
|
-
|
|
104
|
-
/***/ }),
|
|
105
|
-
|
|
106
99
|
/***/ "021e":
|
|
107
100
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
108
101
|
|
|
@@ -114,15 +107,22 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
|
114
107
|
|
|
115
108
|
/***/ }),
|
|
116
109
|
|
|
117
|
-
/***/ "
|
|
110
|
+
/***/ "3f46":
|
|
118
111
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
119
112
|
|
|
120
113
|
"use strict";
|
|
121
|
-
/* harmony import */ var
|
|
122
|
-
/* harmony import */ var
|
|
114
|
+
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("c5db");
|
|
115
|
+
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_9_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_9_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_9_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_9_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
|
|
123
116
|
/* unused harmony reexport * */
|
|
124
117
|
|
|
125
118
|
|
|
119
|
+
/***/ }),
|
|
120
|
+
|
|
121
|
+
/***/ "c5db":
|
|
122
|
+
/***/ (function(module, exports, __webpack_require__) {
|
|
123
|
+
|
|
124
|
+
// extracted by mini-css-extract-plugin
|
|
125
|
+
|
|
126
126
|
/***/ }),
|
|
127
127
|
|
|
128
128
|
/***/ "f14e":
|
|
@@ -159,7 +159,7 @@ if (typeof window !== 'undefined') {
|
|
|
159
159
|
// Indicate to webpack that this file can be concatenated
|
|
160
160
|
/* harmony default export */ var setPublicPath = (null);
|
|
161
161
|
|
|
162
|
-
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"
|
|
162
|
+
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"733de36c-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/DemoButton/index.vue?vue&type=template&id=1c0b7107&scoped=true
|
|
163
163
|
var render = function render() {
|
|
164
164
|
var _vm = this,
|
|
165
165
|
_c = _vm._self._c;
|
|
@@ -356,8 +356,8 @@ var component = normalizeComponent(
|
|
|
356
356
|
)
|
|
357
357
|
|
|
358
358
|
/* harmony default export */ var DemoButton = (component.exports);
|
|
359
|
-
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"
|
|
360
|
-
var
|
|
359
|
+
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"733de36c-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/N20CopyText/index.vue?vue&type=template&id=35583176&scoped=true
|
|
360
|
+
var N20CopyTextvue_type_template_id_35583176_scoped_true_render = function render() {
|
|
361
361
|
var _vm = this,
|
|
362
362
|
_c = _vm._self._c;
|
|
363
363
|
return _c('span', {
|
|
@@ -378,23 +378,17 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_render = function rende
|
|
|
378
378
|
style: {
|
|
379
379
|
order: _vm.iconPosition === 'left' ? -1 : 1
|
|
380
380
|
}
|
|
381
|
-
}) : _vm._e()
|
|
382
|
-
attrs: {
|
|
383
|
-
"name": "n20-copy-fade"
|
|
384
|
-
}
|
|
385
|
-
}, [_vm.copied ? _c('span', {
|
|
386
|
-
staticClass: "n20-copy-text__tip"
|
|
387
|
-
}, [_vm._v(_vm._s(_vm.successTip))]) : _vm._e()])], 1);
|
|
381
|
+
}) : _vm._e()]);
|
|
388
382
|
};
|
|
389
|
-
var
|
|
383
|
+
var N20CopyTextvue_type_template_id_35583176_scoped_true_staticRenderFns = [];
|
|
390
384
|
|
|
391
|
-
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=template&id=
|
|
385
|
+
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=template&id=35583176&scoped=true
|
|
392
386
|
|
|
393
387
|
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/N20CopyText/index.vue?vue&type=script&lang=js
|
|
394
388
|
/**
|
|
395
389
|
* N20CopyText - 点击复制文本组件
|
|
396
390
|
*
|
|
397
|
-
*
|
|
391
|
+
* 点击后将指定文本复制到剪贴板，通过 Element Message 显示成功反馈。
|
|
398
392
|
*
|
|
399
393
|
* @example
|
|
400
394
|
* <N20CopyText :text="row.billNo">{{ row.billNo }}</N20CopyText>
|
|
@@ -462,11 +456,13 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_staticRenderFns = [];
|
|
|
462
456
|
document.body.removeChild(textarea);
|
|
463
457
|
}
|
|
464
458
|
this.copied = true;
|
|
459
|
+
this.$message.success(this.successTip);
|
|
465
460
|
this.$emit('copy', String(copyText));
|
|
466
461
|
this.timer = setTimeout(() => {
|
|
467
462
|
this.copied = false;
|
|
468
463
|
}, 2000);
|
|
469
464
|
} catch (err) {
|
|
465
|
+
this.$message.error('复制失败');
|
|
470
466
|
this.$emit('error', err);
|
|
471
467
|
}
|
|
472
468
|
}
|
|
@@ -474,8 +470,8 @@ var N20CopyTextvue_type_template_id_540c418a_scoped_true_staticRenderFns = [];
|
|
|
474
470
|
});
|
|
475
471
|
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue?vue&type=script&lang=js
|
|
476
472
|
/* harmony default export */ var components_N20CopyTextvue_type_script_lang_js = (N20CopyTextvue_type_script_lang_js);
|
|
477
|
-
// EXTERNAL MODULE: ./src/components/N20CopyText/index.vue?vue&type=style&index=0&id=
|
|
478
|
-
var
|
|
473
|
+
// EXTERNAL MODULE: ./src/components/N20CopyText/index.vue?vue&type=style&index=0&id=35583176&prod&lang=scss&scoped=true
|
|
474
|
+
var N20CopyTextvue_type_style_index_0_id_35583176_prod_lang_scss_scoped_true = __webpack_require__("3f46");
|
|
479
475
|
|
|
480
476
|
// CONCATENATED MODULE: ./src/components/N20CopyText/index.vue
|
|
481
477
|
|
|
@@ -488,11 +484,11 @@ var N20CopyTextvue_type_style_index_0_id_540c418a_prod_lang_scss_scoped_true = _
|
|
|
488
484
|
|
|
489
485
|
var N20CopyText_component = normalizeComponent(
|
|
490
486
|
components_N20CopyTextvue_type_script_lang_js,
|
|
491
|
-
|
|
492
|
-
|
|
487
|
+
N20CopyTextvue_type_template_id_35583176_scoped_true_render,
|
|
488
|
+
N20CopyTextvue_type_template_id_35583176_scoped_true_staticRenderFns,
|
|
493
489
|
false,
|
|
494
490
|
null,
|
|
495
|
-
"
|
|
491
|
+
"35583176",
|
|
496
492
|
null
|
|
497
493
|
|
|
498
494
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(t
|
|
1
|
+
(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["n20-project-component"]=t():e["n20-project-component"]=t()})("undefined"!==typeof self?self:this,(function(){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var i=t[o]={i:o,l:!1,exports:{}};return e[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(o,i,function(t){return e[t]}.bind(null,i));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s="fb15")}({"021e":function(e,t,n){"use strict";n("f14e")},"3f46":function(e,t,n){"use strict";n("c5db")},c5db:function(e,t,n){},f14e:function(e,t,n){},fb15:function(e,t,n){"use strict";if(n.r(t),n.d(t,"DemoButton",(function(){return d})),n.d(t,"N20CopyText",(function(){return _})),"undefined"!==typeof window){var o=window.document.currentScript,i=o&&o.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);i&&(n.p=i[1])}var r=function(){var e=this,t=e._self._c;return t("el-button",{staticClass:"n20-demo-button",attrs:{type:e.type,size:e.size,disabled:e.disabled,loading:e.loading,icon:e.icon},on:{click:e.handleClick}},[e._t("default",(function(){return[e._v(e._s(e.text))]}))],2)},s=[],c={name:"N20DemoButton",props:{text:{type:String,default:"按钮"},type:{type:String,default:"primary"},size:{type:String,default:""},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{type:String,default:""}},methods:{handleClick(e){this.$emit("click",e)}}},a=c;n("021e");function u(e,t,n,o,i,r,s,c){var a,u="function"===typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=n,u._compiled=!0),o&&(u.functional=!0),r&&(u._scopeId="data-v-"+r),s?(a=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},u._ssrRegister=a):i&&(a=c?function(){i.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:i),a)if(u.functional){u._injectStyles=a;var l=u.render;u.render=function(e,t){return a.call(t),l(e,t)}}else{var d=u.beforeCreate;u.beforeCreate=d?[].concat(d,a):[a]}return{exports:e,options:u}}var l=u(a,r,s,!1,null,"1c0b7107",null),d=l.exports,f=function(){var e=this,t=e._self._c;return t("span",{staticClass:"n20-copy-text",on:{click:function(t){return t.stopPropagation(),e.handleCopy.apply(null,arguments)}}},[t("span",{ref:"content",staticClass:"n20-copy-text__content"},[e._t("default",(function(){return[e._v(e._s(e.text))]}))],2),e.showIcon?t("i",{class:["n20-copy-text__icon",e.copied?"el-icon-check":"el-icon-document-copy"],style:{order:"left"===e.iconPosition?-1:1}}):e._e()])},p=[],y={name:"N20CopyText",props:{text:{type:[String,Number],default:""},successTip:{type:String,default:"已复制"},showIcon:{type:Boolean,default:!0},iconPosition:{type:String,default:"right",validator:e=>["left","right"].includes(e)},disabled:{type:Boolean,default:!1}},data(){return{copied:!1,timer:null}},beforeDestroy(){clearTimeout(this.timer)},methods:{async handleCopy(){if(this.disabled||this.copied)return;const e=this.text||this.$refs.content&&this.$refs.content.innerText||"";if(e)try{if(navigator.clipboard&&window.isSecureContext)await navigator.clipboard.writeText(String(e));else{const t=document.createElement("textarea");t.value=String(e),t.style.position="fixed",t.style.left="-9999px",document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}this.copied=!0,this.$message.success(this.successTip),this.$emit("copy",String(e)),this.timer=setTimeout(()=>{this.copied=!1},2e3)}catch(t){this.$message.error("复制失败"),this.$emit("error",t)}}}},m=y,h=(n("3f46"),u(m,f,p,!1,null,"35583176",null)),_=h.exports;const b={DemoButton:d,N20CopyText:_},x=e=>{x.installed||(x.installed=!0,Object.values(b).forEach(t=>{e.component(t.name,t)}))};"undefined"!==typeof window&&window.Vue&&x(window.Vue);var v={install:x,...b};t["default"]=v}})}));
|
package/package.json
CHANGED
|
@@ -8,9 +8,6 @@
|
|
|
8
8
|
:class="['n20-copy-text__icon', copied ? 'el-icon-check' : 'el-icon-document-copy']"
|
|
9
9
|
:style="{ order: iconPosition === 'left' ? -1 : 1 }"
|
|
10
10
|
/>
|
|
11
|
-
<transition name="n20-copy-fade">
|
|
12
|
-
<span v-if="copied" class="n20-copy-text__tip">{{ successTip }}</span>
|
|
13
|
-
</transition>
|
|
14
11
|
</span>
|
|
15
12
|
</template>
|
|
16
13
|
|
|
@@ -18,7 +15,7 @@
|
|
|
18
15
|
/**
|
|
19
16
|
* N20CopyText - 点击复制文本组件
|
|
20
17
|
*
|
|
21
|
-
*
|
|
18
|
+
* 点击后将指定文本复制到剪贴板，通过 Element Message 显示成功反馈。
|
|
22
19
|
*
|
|
23
20
|
* @example
|
|
24
21
|
* <N20CopyText :text="row.billNo">{{ row.billNo }}</N20CopyText>
|
|
@@ -89,12 +86,14 @@ export default {
|
|
|
89
86
|
}
|
|
90
87
|
|
|
91
88
|
this.copied = true
|
|
89
|
+
this.$message.success(this.successTip)
|
|
92
90
|
this.$emit('copy', String(copyText))
|
|
93
91
|
|
|
94
92
|
this.timer = setTimeout(() => {
|
|
95
93
|
this.copied = false
|
|
96
94
|
}, 2000)
|
|
97
95
|
} catch (err) {
|
|
96
|
+
this.$message.error('复制失败')
|
|
98
97
|
this.$emit('error', err)
|
|
99
98
|
}
|
|
100
99
|
}
|
|
@@ -108,7 +107,6 @@ export default {
|
|
|
108
107
|
align-items: center;
|
|
109
108
|
gap: 4px;
|
|
110
109
|
cursor: pointer;
|
|
111
|
-
position: relative;
|
|
112
110
|
|
|
113
111
|
&:hover {
|
|
114
112
|
.n20-copy-text__icon {
|
|
@@ -131,41 +129,5 @@ export default {
|
|
|
131
129
|
opacity: 1;
|
|
132
130
|
}
|
|
133
131
|
}
|
|
134
|
-
|
|
135
|
-
&__tip {
|
|
136
|
-
position: absolute;
|
|
137
|
-
top: -28px;
|
|
138
|
-
left: 50%;
|
|
139
|
-
transform: translateX(-50%);
|
|
140
|
-
background: #67C23A;
|
|
141
|
-
color: #fff;
|
|
142
|
-
font-size: 12px;
|
|
143
|
-
padding: 2px 8px;
|
|
144
|
-
border-radius: 4px;
|
|
145
|
-
white-space: nowrap;
|
|
146
|
-
pointer-events: none;
|
|
147
|
-
|
|
148
|
-
&::after {
|
|
149
|
-
content: '';
|
|
150
|
-
position: absolute;
|
|
151
|
-
bottom: -4px;
|
|
152
|
-
left: 50%;
|
|
153
|
-
transform: translateX(-50%);
|
|
154
|
-
border-left: 4px solid transparent;
|
|
155
|
-
border-right: 4px solid transparent;
|
|
156
|
-
border-top: 4px solid #67C23A;
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
.n20-copy-fade-enter-active,
|
|
162
|
-
.n20-copy-fade-leave-active {
|
|
163
|
-
transition: opacity 0.3s ease, transform 0.3s ease;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.n20-copy-fade-enter,
|
|
167
|
-
.n20-copy-fade-leave-to {
|
|
168
|
-
opacity: 0;
|
|
169
|
-
transform: translateX(-50%) translateY(4px);
|
|
170
132
|
}
|
|
171
133
|
</style>
|