general-basic-form 2.0.3 → 2.0.5

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/dist/index.js ADDED
@@ -0,0 +1,452 @@
1
+ import { defineComponent as _, inject as g, resolveComponent as i, openBlock as o, createBlock as s, mergeProps as h, withKeys as O, createSlots as F, renderList as S, withCtx as y, resolveDynamicComponent as D, createCommentVNode as f, ref as k, unref as b, resolveDirective as K, withDirectives as N, createElementBlock as $, createVNode as q, createElementVNode as M, computed as j, onBeforeUnmount as W, normalizeStyle as H, createTextVNode as I, toDisplayString as J, h as X, normalizeProps as Y, guardReactiveProps as Z, provide as z, Fragment as U, renderSlot as x, vShow as ee } from "vue";
2
+ import { useRoute as te } from "vue-router";
3
+ const E = {
4
+ placeholder: "请输入",
5
+ style: "width: 200px",
6
+ clearable: !0
7
+ }, ne = _({
8
+ components: {
9
+ InputArchive: (e) => {
10
+ const { templateEle: n } = e;
11
+ return n();
12
+ }
13
+ },
14
+ props: {
15
+ item: null
16
+ // null就是any
17
+ },
18
+ setup() {
19
+ const e = g("queryParams", {}), n = g("getList"), t = g("size");
20
+ return { queryParams: e, getList: n, size: t };
21
+ },
22
+ data() {
23
+ return {
24
+ inputSetting: {
25
+ ...E,
26
+ ...this.item.inputSetting
27
+ }
28
+ };
29
+ },
30
+ // created() {
31
+ // console.log("new", this.item);
32
+ // console.log("new", this.inputSetting);
33
+ // },
34
+ methods: {
35
+ currentInputComponent() {
36
+ return "input-archive";
37
+ }
38
+ }
39
+ // watch: {
40
+ // item(val) {
41
+ // console.log("item", val);
42
+ // },
43
+ // size(val) {
44
+ // console.log(val);
45
+ // },
46
+ // },
47
+ }), P = (e, n) => {
48
+ const t = e.__vccOpts || e;
49
+ for (const [l, a] of n)
50
+ t[l] = a;
51
+ return t;
52
+ };
53
+ function re(e, n, t, l, a, u) {
54
+ const c = i("el-input");
55
+ return o(), s(c, h({
56
+ onKeydown: O(e.getList, ["enter"]),
57
+ modelValue: e.queryParams[e.item.prop],
58
+ "onUpdate:modelValue": n[0] || (n[0] = (p) => e.queryParams[e.item.prop] = p),
59
+ size: e.size
60
+ }, e.inputSetting), F({ _: 2 }, [
61
+ S(e.item.template, (p, m) => ({
62
+ name: m,
63
+ fn: y(() => [
64
+ p ? (o(), s(D(e.currentInputComponent()), {
65
+ key: m,
66
+ templateEle: p
67
+ }, null, 8, ["templateEle"])) : f("", !0)
68
+ ])
69
+ }))
70
+ ]), 1040, ["onKeydown", "modelValue", "size"]);
71
+ }
72
+ const C = /* @__PURE__ */ P(ne, [["render", re]]), oe = /* @__PURE__ */ _({
73
+ __name: "index",
74
+ props: {
75
+ item: {}
76
+ },
77
+ setup(e) {
78
+ const { item: n } = e, t = g("queryParams", {}), l = g("size"), a = k({
79
+ ...E,
80
+ ...n.inputSetting
81
+ });
82
+ return (u, c) => {
83
+ const p = i("el-input-number");
84
+ return o(), s(p, h({
85
+ modelValue: b(t)[u.item.prop],
86
+ "onUpdate:modelValue": c[0] || (c[0] = (m) => b(t)[u.item.prop] = m),
87
+ size: b(l)
88
+ }, a.value), null, 16, ["modelValue", "size"]);
89
+ };
90
+ }
91
+ }), ae = { class: "input-graphic-verification" }, se = ["src"], le = /* @__PURE__ */ _({
92
+ __name: "index",
93
+ props: {
94
+ item: {}
95
+ },
96
+ setup(e) {
97
+ const { item: n } = e, { graphicSrc: t = "", getGraphic: l = () => {
98
+ } } = n, a = k(!1), u = async () => {
99
+ l && !a.value && (a.value = !0, await l(), a.value = !1);
100
+ };
101
+ return (c, p) => {
102
+ const m = K("loading");
103
+ return N((o(), $("div", ae, [
104
+ q(C, {
105
+ item: c.item,
106
+ class: "input"
107
+ }, null, 8, ["item"]),
108
+ M("img", {
109
+ class: "graphic",
110
+ onClick: u,
111
+ src: b(t)
112
+ }, null, 8, se)
113
+ ])), [
114
+ [m, a.value]
115
+ ]);
116
+ };
117
+ }
118
+ });
119
+ const ie = /* @__PURE__ */ P(le, [["__scopeId", "data-v-768ce181"]]), v = "获取验证码", ue = 60, pe = /* @__PURE__ */ _({
120
+ __name: "verification-button",
121
+ props: {
122
+ getSmscode: { type: Function }
123
+ },
124
+ setup(e) {
125
+ const { getSmscode: n } = e, t = k(v), l = k(null), a = j(() => t.value === v), u = () => {
126
+ l && (clearInterval(l.value), l.value = null, t.value = v);
127
+ }, c = async () => {
128
+ if (t.value === v)
129
+ if (t.value = ue, l.value = setInterval(() => {
130
+ if (Number(t.value) <= 0 || !t.value) {
131
+ u();
132
+ return;
133
+ } else
134
+ t.value = Number(t.value) - 1;
135
+ }, 1e3), n)
136
+ await n() === !1 && u();
137
+ else
138
+ return;
139
+ };
140
+ return W(() => {
141
+ u();
142
+ }), (p, m) => {
143
+ const V = i("el-button");
144
+ return o(), s(V, {
145
+ class: "verifiaction-button",
146
+ style: H({
147
+ color: a.value ? "var(--color-primary, #409EFF)" : "var(--text-color-placeholder, #A8ABB2)",
148
+ cursor: a.value ? "pointer" : "default"
149
+ }),
150
+ onClick: c
151
+ }, {
152
+ default: y(() => [
153
+ I(J(a.value ? v : t.value + "s"), 1)
154
+ ]),
155
+ _: 1
156
+ }, 8, ["style"]);
157
+ };
158
+ }
159
+ });
160
+ const ce = /* @__PURE__ */ P(pe, [["__scopeId", "data-v-4074e137"]]), me = /* @__PURE__ */ _({
161
+ __name: "index",
162
+ props: {
163
+ item: {}
164
+ },
165
+ setup(e) {
166
+ const { item: n } = e, t = n;
167
+ return t.template = {
168
+ append: () => X(ce, {
169
+ getSmscode: t.getSmscode
170
+ })
171
+ }, (l, a) => (o(), s(C, {
172
+ item: b(t),
173
+ class: "input"
174
+ }, null, 8, ["item"]));
175
+ }
176
+ }), de = _({
177
+ components: {
178
+ slotArchive: (e) => {
179
+ const { templateEle: n } = e;
180
+ return n();
181
+ }
182
+ },
183
+ props: {
184
+ item: null
185
+ // null就是any
186
+ },
187
+ setup() {
188
+ },
189
+ data() {
190
+ return {
191
+ dividerSetting: {
192
+ ...this.item.dividerSetting
193
+ }
194
+ };
195
+ },
196
+ methods: {
197
+ currentInputComponent() {
198
+ return "slot-archive";
199
+ }
200
+ }
201
+ });
202
+ function ye(e, n, t, l, a, u) {
203
+ const c = i("el-divider");
204
+ return o(), s(c, Y(Z(e.dividerSetting)), F({ _: 2 }, [
205
+ S(e.item.template, (p, m) => ({
206
+ name: m,
207
+ fn: y(() => [
208
+ p ? (o(), s(D(e.currentInputComponent()), {
209
+ key: m,
210
+ templateEle: p
211
+ }, null, 8, ["templateEle"])) : f("", !0)
212
+ ])
213
+ }))
214
+ ]), 1040);
215
+ }
216
+ const fe = /* @__PURE__ */ P(de, [["render", ye]]), _e = _({
217
+ name: "GeneralBasicForm",
218
+ components: {
219
+ Input: C,
220
+ InputNumber: oe,
221
+ InputGraphicVerification: ie,
222
+ InputMobileVerification: me,
223
+ Divider: fe
224
+ },
225
+ props: {
226
+ showSearch: {
227
+ // 是否展示所有元素
228
+ type: Boolean,
229
+ default: !0
230
+ },
231
+ formOnly: {
232
+ // 是否只展示表单不展示按钮
233
+ type: Boolean,
234
+ default: !1
235
+ },
236
+ getList: {
237
+ // 查找数据调用的函数
238
+ type: Function,
239
+ default: () => {
240
+ }
241
+ },
242
+ afterReset: {
243
+ // 在重置按钮点击完后但还没重新请求时触发的的函数
244
+ type: Function,
245
+ default: () => {
246
+ }
247
+ },
248
+ formItem: {
249
+ // 定义表单的数据
250
+ type: Array,
251
+ default: []
252
+ },
253
+ size: {
254
+ // 控制按钮大小
255
+ type: String,
256
+ default: "medium"
257
+ },
258
+ labelWidth: {
259
+ // 表单文字宽度
260
+ type: String,
261
+ default: "90px"
262
+ },
263
+ noUrlParameters: {
264
+ // 不接受和不改变url的参数
265
+ type: Boolean,
266
+ default: () => !1
267
+ },
268
+ formData: {
269
+ // 外部传入的表单数据,用于回填
270
+ type: Object,
271
+ default: () => {
272
+ }
273
+ }
274
+ },
275
+ data() {
276
+ return {
277
+ selectSetting: {
278
+ placeholder: "请选择",
279
+ clearable: !0,
280
+ style: "width: 200px"
281
+ },
282
+ datePackerSetting: {
283
+ style: "width: 227px",
284
+ "start-placeholder": "开始日期",
285
+ "end-placeholder": "结束日期",
286
+ type: "daterange"
287
+ }
288
+ };
289
+ },
290
+ setup(e) {
291
+ const { size: n, noUrlParameters: t, getList: l } = e, a = te(), u = k({
292
+ ...t ? {} : a == null ? void 0 : a.query
293
+ });
294
+ return z(
295
+ /* 注入名 */
296
+ "queryParams",
297
+ /* 值 */
298
+ u
299
+ ), z(
300
+ /* 注入名 */
301
+ "size",
302
+ /* 值 */
303
+ n
304
+ ), z(
305
+ /* 注入名 */
306
+ "getList",
307
+ /* 值 */
308
+ l
309
+ ), {
310
+ queryParams: u
311
+ };
312
+ },
313
+ watch: {
314
+ formData(e) {
315
+ this.queryParams = {
316
+ ...this.noUrlParameters ? {} : this.queryParams,
317
+ ...e
318
+ };
319
+ }
320
+ },
321
+ methods: {
322
+ /** 搜索按钮操作 */
323
+ handleQuery() {
324
+ var t;
325
+ const e = { page: 1, limit: 10 }, n = {
326
+ ...(t = this.$route) == null ? void 0 : t.query,
327
+ ...this.queryParams,
328
+ ...e
329
+ };
330
+ this.noUrlParameters || this.$router.push({
331
+ query: { ...n }
332
+ }), this.getList({
333
+ ...n
334
+ });
335
+ },
336
+ /** 重置按钮操作 */
337
+ async resetQuery() {
338
+ var n;
339
+ this.$refs.queryFormRef.resetFields();
340
+ const e = { page: 1 };
341
+ this.noUrlParameters || await this.$router.push({
342
+ query: { ...e }
343
+ }), this.queryParams = {
344
+ ...this.noUrlParameters ? {} : (n = this.$route) == null ? void 0 : n.query
345
+ }, this.afterReset(), this.handleQuery();
346
+ }
347
+ }
348
+ });
349
+ function he(e, n, t, l, a, u) {
350
+ const c = i("Input"), p = i("InputGraphicVerification"), m = i("InputMobileVerification"), V = i("Divider"), L = i("el-option"), G = i("el-select"), R = i("el-cascader"), A = i("el-date-picker"), Q = i("InputNumber"), w = i("el-form-item"), B = i("el-button"), T = i("el-form");
351
+ return N((o(), s(T, h({
352
+ model: e.queryParams,
353
+ ref: "queryFormRef",
354
+ inline: "",
355
+ "label-position": "left",
356
+ "label-width": e.labelWidth
357
+ }, e.$attrs), {
358
+ default: y(() => [
359
+ (o(!0), $(U, null, S(e.formItem, (r) => (o(), s(w, {
360
+ label: r.label,
361
+ prop: r.prop,
362
+ key: r.prop,
363
+ rules: r.rules
364
+ }, {
365
+ default: y(() => [
366
+ r.type === "input" ? (o(), s(c, {
367
+ key: 0,
368
+ item: r
369
+ }, null, 8, ["item"])) : f("", !0),
370
+ r.type === "input-graphic-verification" ? (o(), s(p, {
371
+ item: r,
372
+ key: r.key
373
+ }, null, 8, ["item"])) : f("", !0),
374
+ r.type === "input-mobile-verification" ? (o(), s(m, {
375
+ key: 2,
376
+ item: r
377
+ }, null, 8, ["item"])) : f("", !0),
378
+ r.type === "divider" ? (o(), s(V, {
379
+ key: 3,
380
+ item: r
381
+ }, null, 8, ["item"])) : r.type === "select" ? (o(), s(G, h({
382
+ key: 4,
383
+ filterable: "",
384
+ modelValue: e.queryParams[r.prop],
385
+ "onUpdate:modelValue": (d) => e.queryParams[r.prop] = d,
386
+ size: e.size
387
+ }, r.selectSetting || e.selectSetting), {
388
+ default: y(() => [
389
+ (o(!0), $(U, null, S(r.option || [], (d) => (o(), s(L, {
390
+ key: d.value,
391
+ label: d.desc,
392
+ value: d.value
393
+ }, null, 8, ["label", "value"]))), 128))
394
+ ]),
395
+ _: 2
396
+ }, 1040, ["modelValue", "onUpdate:modelValue", "size"])) : r.type === "cascader" ? (o(), s(R, h({
397
+ key: 5,
398
+ filterable: "",
399
+ modelValue: e.queryParams[r.prop],
400
+ "onUpdate:modelValue": (d) => e.queryParams[r.prop] = d,
401
+ size: e.size,
402
+ options: r.options || []
403
+ }, r.selectSetting || e.selectSetting), null, 16, ["modelValue", "onUpdate:modelValue", "size", "options"])) : r.type === "date-picker" ? (o(), s(A, h({
404
+ key: 6,
405
+ modelValue: e.queryParams[r.prop],
406
+ "onUpdate:modelValue": (d) => e.queryParams[r.prop] = d,
407
+ size: e.size
408
+ }, r.datePackerSetting || e.datePackerSetting), null, 16, ["modelValue", "onUpdate:modelValue", "size"])) : f("", !0),
409
+ r.type === "input-number" ? (o(), s(Q, {
410
+ key: 7,
411
+ item: r
412
+ }, null, 8, ["item"])) : f("", !0)
413
+ ]),
414
+ _: 2
415
+ }, 1032, ["label", "prop", "rules"]))), 128)),
416
+ x(e.$slots, "default"),
417
+ e.formOnly ? f("", !0) : (o(), s(w, { key: 0 }, {
418
+ default: y(() => [
419
+ q(B, {
420
+ type: "primary",
421
+ icon: "el-icon-search",
422
+ size: e.size,
423
+ onClick: e.handleQuery
424
+ }, {
425
+ default: y(() => [
426
+ I("查询")
427
+ ]),
428
+ _: 1
429
+ }, 8, ["size", "onClick"]),
430
+ q(B, {
431
+ icon: "el-icon-refresh",
432
+ size: e.size,
433
+ onClick: e.resetQuery
434
+ }, {
435
+ default: y(() => [
436
+ I("重置")
437
+ ]),
438
+ _: 1
439
+ }, 8, ["size", "onClick"])
440
+ ]),
441
+ _: 1
442
+ }))
443
+ ]),
444
+ _: 3
445
+ }, 16, ["model", "label-width"])), [
446
+ [ee, e.showSearch]
447
+ ]);
448
+ }
449
+ const ve = /* @__PURE__ */ P(_e, [["render", he]]), ke = ve;
450
+ export {
451
+ ke as VGeneralBasicForm
452
+ };
@@ -0,0 +1 @@
1
+ (function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vue-router")):typeof define=="function"&&define.amd?define(["exports","vue","vue-router"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.Index={},d.Vue,d["vue-router"]))})(this,function(d,e,g){"use strict";const h={placeholder:"请输入",style:"width: 200px",clearable:!0},C=e.defineComponent({components:{InputArchive:t=>{const{templateEle:n}=t;return n()}},props:{item:null},setup(){const t=e.inject("queryParams",{}),n=e.inject("getList"),o=e.inject("size");return{queryParams:t,getList:n,size:o}},data(){return{inputSetting:{...h,...this.item.inputSetting}}},methods:{currentInputComponent(){return"input-archive"}}}),u=(t,n)=>{const o=t.__vccOpts||t;for(const[a,l]of n)o[a]=l;return o};function V(t,n,o,a,l,s){const c=e.resolveComponent("el-input");return e.openBlock(),e.createBlock(c,e.mergeProps({onKeydown:e.withKeys(t.getList,["enter"]),modelValue:t.queryParams[t.item.prop],"onUpdate:modelValue":n[0]||(n[0]=i=>t.queryParams[t.item.prop]=i),size:t.size},t.inputSetting),e.createSlots({_:2},[e.renderList(t.item.template,(i,p)=>({name:p,fn:e.withCtx(()=>[i?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.currentInputComponent()),{key:p,templateEle:i},null,8,["templateEle"])):e.createCommentVNode("",!0)])}))]),1040,["onKeydown","modelValue","size"])}const y=u(C,[["render",V]]),b=e.defineComponent({__name:"index",props:{item:{}},setup(t){const{item:n}=t,o=e.inject("queryParams",{}),a=e.inject("size"),l=e.ref({...h,...n.inputSetting});return(s,c)=>{const i=e.resolveComponent("el-input-number");return e.openBlock(),e.createBlock(i,e.mergeProps({modelValue:e.unref(o)[s.item.prop],"onUpdate:modelValue":c[0]||(c[0]=p=>e.unref(o)[s.item.prop]=p),size:e.unref(a)},l.value),null,16,["modelValue","size"])}}}),P={class:"input-graphic-verification"},S=["src"],z=e.defineComponent({__name:"index",props:{item:{}},setup(t){const{item:n}=t,{graphicSrc:o="",getGraphic:a=()=>{}}=n,l=e.ref(!1),s=async()=>{a&&!l.value&&(l.value=!0,await a(),l.value=!1)};return(c,i)=>{const p=e.resolveDirective("loading");return e.withDirectives((e.openBlock(),e.createElementBlock("div",P,[e.createVNode(y,{item:c.item,class:"input"},null,8,["item"]),e.createElementVNode("img",{class:"graphic",onClick:s,src:e.unref(o)},null,8,S)])),[[p,l.value]])}}}),M="",q=u(z,[["__scopeId","data-v-768ce181"]]),f="获取验证码",$=60,w=e.defineComponent({__name:"verification-button",props:{getSmscode:{type:Function}},setup(t){const{getSmscode:n}=t,o=e.ref(f),a=e.ref(null),l=e.computed(()=>o.value===f),s=()=>{a&&(clearInterval(a.value),a.value=null,o.value=f)},c=async()=>{if(o.value===f)if(o.value=$,a.value=setInterval(()=>{if(Number(o.value)<=0||!o.value){s();return}else o.value=Number(o.value)-1},1e3),n)await n()===!1&&s();else return};return e.onBeforeUnmount(()=>{s()}),(i,p)=>{const _=e.resolveComponent("el-button");return e.openBlock(),e.createBlock(_,{class:"verifiaction-button",style:e.normalizeStyle({color:l.value?"var(--color-primary, #409EFF)":"var(--text-color-placeholder, #A8ABB2)",cursor:l.value?"pointer":"default"}),onClick:c},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.value?f:o.value+"s"),1)]),_:1},8,["style"])}}}),K="",I=u(w,[["__scopeId","data-v-4074e137"]]),N=e.defineComponent({__name:"index",props:{item:{}},setup(t){const{item:n}=t,o=n;return o.template={append:()=>e.h(I,{getSmscode:o.getSmscode})},(a,l)=>(e.openBlock(),e.createBlock(y,{item:e.unref(o),class:"input"},null,8,["item"]))}}),F=e.defineComponent({components:{slotArchive:t=>{const{templateEle:n}=t;return n()}},props:{item:null},setup(){},data(){return{dividerSetting:{...this.item.dividerSetting}}},methods:{currentInputComponent(){return"slot-archive"}}});function U(t,n,o,a,l,s){const c=e.resolveComponent("el-divider");return e.openBlock(),e.createBlock(c,e.normalizeProps(e.guardReactiveProps(t.dividerSetting)),e.createSlots({_:2},[e.renderList(t.item.template,(i,p)=>({name:p,fn:e.withCtx(()=>[i?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.currentInputComponent()),{key:p,templateEle:i},null,8,["templateEle"])):e.createCommentVNode("",!0)])}))]),1040)}const D=u(F,[["render",U]]),L=e.defineComponent({name:"GeneralBasicForm",components:{Input:y,InputNumber:b,InputGraphicVerification:q,InputMobileVerification:N,Divider:D},props:{showSearch:{type:Boolean,default:!0},formOnly:{type:Boolean,default:!1},getList:{type:Function,default:()=>{}},afterReset:{type:Function,default:()=>{}},formItem:{type:Array,default:[]},size:{type:String,default:"medium"},labelWidth:{type:String,default:"90px"},noUrlParameters:{type:Boolean,default:()=>!1},formData:{type:Object,default:()=>{}}},data(){return{selectSetting:{placeholder:"请选择",clearable:!0,style:"width: 200px"},datePackerSetting:{style:"width: 227px","start-placeholder":"开始日期","end-placeholder":"结束日期",type:"daterange"}}},setup(t){const{size:n,noUrlParameters:o,getList:a}=t,l=g.useRoute(),s=e.ref({...o?{}:l==null?void 0:l.query});return e.provide("queryParams",s),e.provide("size",n),e.provide("getList",a),{queryParams:s}},watch:{formData(t){this.queryParams={...this.noUrlParameters?{}:this.queryParams,...t}}},methods:{handleQuery(){var o;const t={page:1,limit:10},n={...(o=this.$route)==null?void 0:o.query,...this.queryParams,...t};this.noUrlParameters||this.$router.push({query:{...n}}),this.getList({...n})},async resetQuery(){var n;this.$refs.queryFormRef.resetFields();const t={page:1};this.noUrlParameters||await this.$router.push({query:{...t}}),this.queryParams={...this.noUrlParameters?{}:(n=this.$route)==null?void 0:n.query},this.afterReset(),this.handleQuery()}}});function E(t,n,o,a,l,s){const c=e.resolveComponent("Input"),i=e.resolveComponent("InputGraphicVerification"),p=e.resolveComponent("InputMobileVerification"),_=e.resolveComponent("Divider"),G=e.resolveComponent("el-option"),j=e.resolveComponent("el-select"),R=e.resolveComponent("el-cascader"),A=e.resolveComponent("el-date-picker"),O=e.resolveComponent("InputNumber"),k=e.resolveComponent("el-form-item"),B=e.resolveComponent("el-button"),Q=e.resolveComponent("el-form");return e.withDirectives((e.openBlock(),e.createBlock(Q,e.mergeProps({model:t.queryParams,ref:"queryFormRef",inline:"","label-position":"left","label-width":t.labelWidth},t.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.formItem,r=>(e.openBlock(),e.createBlock(k,{label:r.label,prop:r.prop,key:r.prop,rules:r.rules},{default:e.withCtx(()=>[r.type==="input"?(e.openBlock(),e.createBlock(c,{key:0,item:r},null,8,["item"])):e.createCommentVNode("",!0),r.type==="input-graphic-verification"?(e.openBlock(),e.createBlock(i,{item:r,key:r.key},null,8,["item"])):e.createCommentVNode("",!0),r.type==="input-mobile-verification"?(e.openBlock(),e.createBlock(p,{key:2,item:r},null,8,["item"])):e.createCommentVNode("",!0),r.type==="divider"?(e.openBlock(),e.createBlock(_,{key:3,item:r},null,8,["item"])):r.type==="select"?(e.openBlock(),e.createBlock(j,e.mergeProps({key:4,filterable:"",modelValue:t.queryParams[r.prop],"onUpdate:modelValue":m=>t.queryParams[r.prop]=m,size:t.size},r.selectSetting||t.selectSetting),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.option||[],m=>(e.openBlock(),e.createBlock(G,{key:m.value,label:m.desc,value:m.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue","size"])):r.type==="cascader"?(e.openBlock(),e.createBlock(R,e.mergeProps({key:5,filterable:"",modelValue:t.queryParams[r.prop],"onUpdate:modelValue":m=>t.queryParams[r.prop]=m,size:t.size,options:r.options||[]},r.selectSetting||t.selectSetting),null,16,["modelValue","onUpdate:modelValue","size","options"])):r.type==="date-picker"?(e.openBlock(),e.createBlock(A,e.mergeProps({key:6,modelValue:t.queryParams[r.prop],"onUpdate:modelValue":m=>t.queryParams[r.prop]=m,size:t.size},r.datePackerSetting||t.datePackerSetting),null,16,["modelValue","onUpdate:modelValue","size"])):e.createCommentVNode("",!0),r.type==="input-number"?(e.openBlock(),e.createBlock(O,{key:7,item:r},null,8,["item"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop","rules"]))),128)),e.renderSlot(t.$slots,"default"),t.formOnly?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(k,{key:0},{default:e.withCtx(()=>[e.createVNode(B,{type:"primary",icon:"el-icon-search",size:t.size,onClick:t.handleQuery},{default:e.withCtx(()=>[e.createTextVNode("查询")]),_:1},8,["size","onClick"]),e.createVNode(B,{icon:"el-icon-refresh",size:t.size,onClick:t.resetQuery},{default:e.withCtx(()=>[e.createTextVNode("重置")]),_:1},8,["size","onClick"])]),_:1}))]),_:3},16,["model","label-width"])),[[e.vShow,t.showSearch]])}const T=u(L,[["render",E]]);d.VGeneralBasicForm=T,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
package/dist/style.css ADDED
@@ -0,0 +1 @@
1
+ .input-graphic-verification[data-v-768ce181]{display:flex;gap:12px;width:100%}.input-graphic-verification .input[data-v-768ce181]{flex:auto}.input-graphic-verification .graphic[data-v-768ce181]{width:109px;height:43px;object-fit:fill;flex:none}.verifiaction-button[data-v-4074e137]{width:109px}
package/package.json CHANGED
@@ -1,15 +1,16 @@
1
1
  {
2
2
  "name": "general-basic-form",
3
- "version": "2.0.3",
3
+ "version": "2.0.5",
4
4
  "description": "",
5
- "main": "./dist/index.umd.js",
5
+ "main": "./dist/index.umd.cjs",
6
+ "type": "module",
6
7
  "scripts": {
7
8
  "build": "cross-env CURRENT_ENV=prod run-p type-check build-only",
8
9
  "test:e2e": "playwright test",
9
10
  "build-only": "vite build",
10
11
  "type-check": "tsc --noEmit -p tsconfig.json --composite false",
11
12
  "link": "tsx script/link.ts && yarn link",
12
- "unlink": "tsx script/unlink.ts && yarn unlink"
13
+ "unlink": "tsx script/unlink.ts && yarn unlink && run-p build"
13
14
  },
14
15
  "keywords": [
15
16
  "general-basic-form",
@@ -31,8 +32,9 @@
31
32
  "@vitejs/plugin-legacy": "^4.1.1",
32
33
  "@vitejs/plugin-vue": "^4.2.3",
33
34
  "@vitejs/plugin-vue-jsx": "^3.0.1",
34
- "cross-env": "^7.0.3",
35
35
  "chalk": "^2.4.2",
36
+ "cross-env": "^7.0.3",
37
+ "less": "^4.2.0",
36
38
  "npm-run-all": "^4.1.5",
37
39
  "tsx": "^4.0.0",
38
40
  "typescript": "^5.2.2",
@@ -43,14 +45,14 @@
43
45
  "vue": ">=3.3.4",
44
46
  "vue-router": ">=4.2.4"
45
47
  },
46
- "module": "./dist/index.mjs",
48
+ "typings": "./dist/index.d.ts",
49
+ "module": "./dist/index.js",
47
50
  "exports": {
48
51
  ".": {
49
- "import": "./dist/index.mjs",
50
- "require": "./dist/index.umd.js"
52
+ "import": "./dist/index.js",
53
+ "require": "./dist/index.umd.cjs"
51
54
  }
52
55
  },
53
- "typings": "./dist/index.d.ts",
54
56
  "files": [
55
57
  "/dist"
56
58
  ]
package/dist/index.mjs DELETED
@@ -1,281 +0,0 @@
1
- import { defineComponent as v, resolveComponent as u, openBlock as n, createBlock as s, mergeProps as c, withKeys as C, createSlots as F, renderList as g, withCtx as i, resolveDynamicComponent as B, createCommentVNode as d, withDirectives as I, createElementBlock as _, Fragment as z, renderSlot as L, createVNode as k, createTextVNode as V, vShow as O } from "vue";
2
- const Q = v({
3
- components: {
4
- InputArchive: (e) => {
5
- const { templateEle: l } = e;
6
- return l();
7
- }
8
- },
9
- props: {
10
- item: null,
11
- // null就是any
12
- queryParams: { type: [Object, String], required: !0 },
13
- getList: { type: Function, required: !0 },
14
- size: { type: String, required: !0 }
15
- },
16
- data() {
17
- return {
18
- inputSetting: {
19
- placeholder: "请输入",
20
- style: "width: 200px",
21
- clearable: !0
22
- }
23
- };
24
- },
25
- created() {
26
- console.log("new");
27
- },
28
- methods: {
29
- currentInputComponent() {
30
- return "input-archive";
31
- }
32
- },
33
- watch: {
34
- item(e) {
35
- console.log(e);
36
- },
37
- size(e) {
38
- console.log(e);
39
- }
40
- }
41
- }), S = (e, l) => {
42
- const r = e.__vccOpts || e;
43
- for (const [y, o] of l)
44
- r[y] = o;
45
- return r;
46
- };
47
- function D(e, l, r, y, o, h) {
48
- const f = u("el-input");
49
- return n(), s(f, c({
50
- onKeydown: C(e.getList, ["enter"]),
51
- modelValue: e.queryParams[e.item.prop],
52
- "onUpdate:modelValue": l[0] || (l[0] = (p) => e.queryParams[e.item.prop] = p),
53
- size: e.size
54
- }, e.item.inputSetting || e.inputSetting), F({ _: 2 }, [
55
- g(e.item.template, (p, m) => ({
56
- name: m,
57
- fn: i(() => [
58
- p ? (n(), s(B(e.currentInputComponent()), {
59
- key: m,
60
- templateEle: p
61
- }, null, 8, ["templateEle"])) : d("", !0)
62
- ])
63
- }))
64
- ]), 1040, ["onKeydown", "modelValue", "size"]);
65
- }
66
- const R = /* @__PURE__ */ S(Q, [["render", D]]), G = {
67
- name: "GeneralBasicForm",
68
- components: {
69
- Input: R
70
- },
71
- props: {
72
- showSearch: {
73
- // 是否展示所有元素
74
- type: Boolean,
75
- default: !0
76
- },
77
- formOnly: {
78
- // 是否只展示表单不展示按钮
79
- type: Boolean,
80
- default: !1
81
- },
82
- getList: {
83
- // 查找数据调用的函数
84
- type: Function,
85
- default: () => {
86
- }
87
- },
88
- afterReset: {
89
- // 在重置按钮点击完后但还没重新请求时触发的的函数
90
- type: Function,
91
- default: () => {
92
- }
93
- },
94
- formItem: {
95
- // 定义表单的数据
96
- type: Array,
97
- default: []
98
- },
99
- size: {
100
- // 控制按钮大小
101
- type: String,
102
- default: "medium"
103
- },
104
- labelWidth: {
105
- // 表单文字宽度
106
- type: String,
107
- default: "90px"
108
- },
109
- noUrlParameters: {
110
- // 不接受和不改变url的参数
111
- type: Boolean,
112
- default: () => !1
113
- },
114
- formData: {
115
- // 外部传入的表单数据,用于回填
116
- type: Object,
117
- default: () => {
118
- }
119
- }
120
- },
121
- data() {
122
- var e;
123
- return {
124
- queryParams: {
125
- ...this.noUrlParameters ? {} : (e = this.$route) == null ? void 0 : e.query
126
- },
127
- // form表单数据
128
- selectSetting: {
129
- placeholder: "请选择",
130
- clearable: !0,
131
- style: "width: 200px"
132
- },
133
- datePackerSetting: {
134
- style: "width: 227px",
135
- "start-placeholder": "开始日期",
136
- "end-placeholder": "结束日期",
137
- type: "daterange"
138
- }
139
- };
140
- },
141
- // setup(props) {
142
- //设置默认值
143
- // console.log(props);
144
- // // const { formItem } = toRefs(props);
145
- // const { formItem } = props;
146
- // console.log(formItem);
147
- // const queryParams = {};
148
- // formItem.forEach((item) => {
149
- // queryParams[item.prop] = "";
150
- // });
151
- // return {
152
- // queryParams,
153
- // };
154
- // },
155
- watch: {
156
- formData(e) {
157
- this.queryParams = {
158
- ...this.noUrlParameters ? {} : this.queryParams,
159
- ...e
160
- };
161
- }
162
- },
163
- methods: {
164
- /** 搜索按钮操作 */
165
- handleQuery() {
166
- var r;
167
- const e = { page: 1, limit: 10 }, l = {
168
- ...(r = this.$route) == null ? void 0 : r.query,
169
- ...this.queryParams,
170
- ...e
171
- };
172
- this.noUrlParameters || this.$router.push({
173
- query: { ...l }
174
- }), this.getList({
175
- ...l
176
- });
177
- },
178
- /** 重置按钮操作 */
179
- async resetQuery() {
180
- var l;
181
- this.$refs.queryFormRef.resetFields();
182
- const e = { page: 1 };
183
- this.noUrlParameters || await this.$router.push({
184
- query: { ...e }
185
- }), this.queryParams = {
186
- ...this.noUrlParameters ? {} : (l = this.$route) == null ? void 0 : l.query
187
- }, this.afterReset(), this.handleQuery();
188
- }
189
- }
190
- }, K = { key: 0 };
191
- function N(e, l, r, y, o, h) {
192
- const f = u("el-option"), p = u("el-select"), m = u("el-cascader"), b = u("el-date-picker"), w = u("el-input-number"), P = u("el-form-item"), q = u("el-button"), U = u("el-form");
193
- return I((n(), s(U, c({
194
- model: o.queryParams,
195
- ref: "queryFormRef",
196
- inline: "",
197
- "label-position": "left",
198
- "label-width": r.labelWidth
199
- }, e.$attrs), {
200
- default: i(() => [
201
- (n(!0), _(z, null, g(r.formItem, (t) => (n(), s(P, {
202
- label: t.label,
203
- prop: t.prop,
204
- key: t.prop,
205
- rules: t.rules
206
- }, {
207
- default: i(() => [
208
- t.type === "input" ? (n(), _("div", K)) : t.type === "select" ? (n(), s(p, c({
209
- key: 1,
210
- filterable: "",
211
- modelValue: o.queryParams[t.prop],
212
- "onUpdate:modelValue": (a) => o.queryParams[t.prop] = a,
213
- size: r.size
214
- }, t.selectSetting || o.selectSetting), {
215
- default: i(() => [
216
- (n(!0), _(z, null, g(t.option || [], (a) => (n(), s(f, {
217
- key: a.value,
218
- label: a.desc,
219
- value: a.value
220
- }, null, 8, ["label", "value"]))), 128))
221
- ]),
222
- _: 2
223
- }, 1040, ["modelValue", "onUpdate:modelValue", "size"])) : t.type === "cascader" ? (n(), s(m, c({
224
- key: 2,
225
- filterable: "",
226
- modelValue: o.queryParams[t.prop],
227
- "onUpdate:modelValue": (a) => o.queryParams[t.prop] = a,
228
- size: r.size,
229
- options: t.options || []
230
- }, t.selectSetting || o.selectSetting), null, 16, ["modelValue", "onUpdate:modelValue", "size", "options"])) : t.type === "date-picker" ? (n(), s(b, c({
231
- key: 3,
232
- modelValue: o.queryParams[t.prop],
233
- "onUpdate:modelValue": (a) => o.queryParams[t.prop] = a,
234
- size: r.size
235
- }, t.datePackerSetting || o.datePackerSetting), null, 16, ["modelValue", "onUpdate:modelValue", "size"])) : d("", !0),
236
- t.type === "input-number" ? (n(), s(w, c({
237
- key: 4,
238
- modelValue: o.queryParams[t.prop],
239
- "onUpdate:modelValue": (a) => o.queryParams[t.prop] = a,
240
- size: r.size
241
- }, t.inputSetting || e.inputSetting), null, 16, ["modelValue", "onUpdate:modelValue", "size"])) : d("", !0)
242
- ]),
243
- _: 2
244
- }, 1032, ["label", "prop", "rules"]))), 128)),
245
- L(e.$slots, "default"),
246
- r.formOnly ? d("", !0) : (n(), s(P, { key: 0 }, {
247
- default: i(() => [
248
- k(q, {
249
- type: "primary",
250
- icon: "el-icon-search",
251
- size: r.size,
252
- onClick: h.handleQuery
253
- }, {
254
- default: i(() => [
255
- V("查询")
256
- ]),
257
- _: 1
258
- }, 8, ["size", "onClick"]),
259
- k(q, {
260
- icon: "el-icon-refresh",
261
- size: r.size,
262
- onClick: h.resetQuery
263
- }, {
264
- default: i(() => [
265
- V("重置")
266
- ]),
267
- _: 1
268
- }, 8, ["size", "onClick"])
269
- ]),
270
- _: 1
271
- }))
272
- ]),
273
- _: 3
274
- }, 16, ["model", "label-width"])), [
275
- [O, r.showSearch]
276
- ]);
277
- }
278
- const j = /* @__PURE__ */ S(G, [["render", N]]), E = j;
279
- export {
280
- E as VGeneralBasicForm
281
- };
package/dist/index.umd.js DELETED
@@ -1 +0,0 @@
1
- (function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.Index={},s.Vue))})(this,function(s,e){"use strict";const h=e.defineComponent({components:{InputArchive:t=>{const{templateEle:l}=t;return l()}},props:{item:null,queryParams:{type:[Object,String],required:!0},getList:{type:Function,required:!0},size:{type:String,required:!0}},data(){return{inputSetting:{placeholder:"请输入",style:"width: 200px",clearable:!0}}},created(){console.log("new")},methods:{currentInputComponent(){return"input-archive"}},watch:{item(t){console.log(t)},size(t){console.log(t)}}}),u=(t,l)=>{const r=t.__vccOpts||t;for(const[p,n]of l)r[p]=n;return r};function k(t,l,r,p,n,m){const d=e.resolveComponent("el-input");return e.openBlock(),e.createBlock(d,e.mergeProps({onKeydown:e.withKeys(t.getList,["enter"]),modelValue:t.queryParams[t.item.prop],"onUpdate:modelValue":l[0]||(l[0]=i=>t.queryParams[t.item.prop]=i),size:t.size},t.item.inputSetting||t.inputSetting),e.createSlots({_:2},[e.renderList(t.item.template,(i,c)=>({name:c,fn:e.withCtx(()=>[i?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.currentInputComponent()),{key:c,templateEle:i},null,8,["templateEle"])):e.createCommentVNode("",!0)])}))]),1040,["onKeydown","modelValue","size"])}const _={name:"GeneralBasicForm",components:{Input:u(h,[["render",k]])},props:{showSearch:{type:Boolean,default:!0},formOnly:{type:Boolean,default:!1},getList:{type:Function,default:()=>{}},afterReset:{type:Function,default:()=>{}},formItem:{type:Array,default:[]},size:{type:String,default:"medium"},labelWidth:{type:String,default:"90px"},noUrlParameters:{type:Boolean,default:()=>!1},formData:{type:Object,default:()=>{}}},data(){var t;return{queryParams:{...this.noUrlParameters?{}:(t=this.$route)==null?void 0:t.query},selectSetting:{placeholder:"请选择",clearable:!0,style:"width: 200px"},datePackerSetting:{style:"width: 227px","start-placeholder":"开始日期","end-placeholder":"结束日期",type:"daterange"}}},watch:{formData(t){this.queryParams={...this.noUrlParameters?{}:this.queryParams,...t}}},methods:{handleQuery(){var r;const t={page:1,limit:10},l={...(r=this.$route)==null?void 0:r.query,...this.queryParams,...t};this.noUrlParameters||this.$router.push({query:{...l}}),this.getList({...l})},async resetQuery(){var l;this.$refs.queryFormRef.resetFields();const t={page:1};this.noUrlParameters||await this.$router.push({query:{...t}}),this.queryParams={...this.noUrlParameters?{}:(l=this.$route)==null?void 0:l.query},this.afterReset(),this.handleQuery()}}},g={key:0};function B(t,l,r,p,n,m){const d=e.resolveComponent("el-option"),i=e.resolveComponent("el-select"),c=e.resolveComponent("el-cascader"),V=e.resolveComponent("el-date-picker"),q=e.resolveComponent("el-input-number"),y=e.resolveComponent("el-form-item"),f=e.resolveComponent("el-button"),C=e.resolveComponent("el-form");return e.withDirectives((e.openBlock(),e.createBlock(C,e.mergeProps({model:n.queryParams,ref:"queryFormRef",inline:"","label-position":"left","label-width":r.labelWidth},t.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.formItem,o=>(e.openBlock(),e.createBlock(y,{label:o.label,prop:o.prop,key:o.prop,rules:o.rules},{default:e.withCtx(()=>[o.type==="input"?(e.openBlock(),e.createElementBlock("div",g)):o.type==="select"?(e.openBlock(),e.createBlock(i,e.mergeProps({key:1,filterable:"",modelValue:n.queryParams[o.prop],"onUpdate:modelValue":a=>n.queryParams[o.prop]=a,size:r.size},o.selectSetting||n.selectSetting),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.option||[],a=>(e.openBlock(),e.createBlock(d,{key:a.value,label:a.desc,value:a.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue","size"])):o.type==="cascader"?(e.openBlock(),e.createBlock(c,e.mergeProps({key:2,filterable:"",modelValue:n.queryParams[o.prop],"onUpdate:modelValue":a=>n.queryParams[o.prop]=a,size:r.size,options:o.options||[]},o.selectSetting||n.selectSetting),null,16,["modelValue","onUpdate:modelValue","size","options"])):o.type==="date-picker"?(e.openBlock(),e.createBlock(V,e.mergeProps({key:3,modelValue:n.queryParams[o.prop],"onUpdate:modelValue":a=>n.queryParams[o.prop]=a,size:r.size},o.datePackerSetting||n.datePackerSetting),null,16,["modelValue","onUpdate:modelValue","size"])):e.createCommentVNode("",!0),o.type==="input-number"?(e.openBlock(),e.createBlock(q,e.mergeProps({key:4,modelValue:n.queryParams[o.prop],"onUpdate:modelValue":a=>n.queryParams[o.prop]=a,size:r.size},o.inputSetting||t.inputSetting),null,16,["modelValue","onUpdate:modelValue","size"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop","rules"]))),128)),e.renderSlot(t.$slots,"default"),r.formOnly?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(y,{key:0},{default:e.withCtx(()=>[e.createVNode(f,{type:"primary",icon:"el-icon-search",size:r.size,onClick:m.handleQuery},{default:e.withCtx(()=>[e.createTextVNode("查询")]),_:1},8,["size","onClick"]),e.createVNode(f,{icon:"el-icon-refresh",size:r.size,onClick:m.resetQuery},{default:e.withCtx(()=>[e.createTextVNode("重置")]),_:1},8,["size","onClick"])]),_:1}))]),_:3},16,["model","label-width"])),[[e.vShow,r.showSearch]])}const P=u(_,[["render",B]]);s.VGeneralBasicForm=P,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});