ol-base-components 3.1.2 → 3.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ol-base-components",
3
- "version": "3.1.2",
3
+ "version": "3.1.3",
4
4
  "private": false,
5
5
  "main": "src/package/index.js",
6
6
  "bin": {
package/src/App.vue CHANGED
@@ -1,13 +1,14 @@
1
1
  <template>
2
2
  <div id="app">
3
- <!-- <div>table组件案例</div> -->
4
- <!-- <ol-search
3
+ <div>table组件案例</div>
4
+ <ol-search
5
5
  :form-search-data="formSearchData"
6
6
  @handleSearch="handleSearch"
7
7
  @handleReset="handleReset"
8
8
  url="/api/app/admission-info/paged-result"
9
- /> -->
10
- <button @click="aaa">123</button>
9
+ />
10
+ <!-- url="/api/app/admission-info/paged-result" -->
11
+
11
12
  <ol-table
12
13
  :paginations="paginations"
13
14
  :empty-img="tableData.emptyImg"
@@ -23,7 +24,8 @@
23
24
  <el-button @click="onAdd">新建</el-button>
24
25
  <el-button @click="onEdit">编辑</el-button>
25
26
 
26
- <!-- <el-dialog :title="`${this.form.title}`" :visible.sync="dialogVisible" width="80%">
27
+ <!-- 编辑,查看弹窗 -->
28
+ <el-dialog :title="`${this.form.title}`" :visible.sync="dialogVisible" width="80%">
27
29
  <ol-form
28
30
  v-if="dialogVisible"
29
31
  url="/api/app/admission-info/admission-info"
@@ -31,8 +33,32 @@
31
33
  @onCancel="dialogVisible = false"
32
34
  @onSubmit="onSubmit"
33
35
  />
34
- </el-dialog> -->
35
- <!-- <ol-print /> -->
36
+ </el-dialog>
37
+
38
+ <!-- <el-button @click="handlePrint">接口</el-button>
39
+
40
+ <div
41
+ class="ellipsis-container"
42
+ id="ellipsis-container"
43
+ v-for="item in 5"
44
+ :key="item"
45
+ >如何处理文本溢出如何实现单行文本溢出显示省略号</div>
46
+
47
+ <div class="triangle-up"></div>
48
+ <div class="grid-content">
49
+ <div>11</div>
50
+ <div>11</div>
51
+ </div>
52
+
53
+ <div class="container">
54
+ <div class="item">1</div>
55
+ <div class="item item2">2</div>
56
+ <div class="item">3</div>
57
+ </div>
58
+
59
+ <div class="square-container">
60
+ <div class="square"></div>
61
+ </div> -->
36
62
  </div>
37
63
  </template>
38
64
 
@@ -501,276 +527,6 @@ export default {
501
527
  });
502
528
  }
503
529
  },
504
- aaa() {
505
- const printEnpty = this.$hiprint({
506
- grid: true,
507
- printData: {
508
- name: "CcSimple",
509
- barcode: "33321323",
510
- table: [
511
- { id: "1", name: "王小可123", gender: "男", count: "120", amount: "9089元" },
512
- { id: "2", name: "梦之遥", gender: "女", count: "20", amount: "89元" },
513
- ],
514
- table1: [
515
- { id: "1", name: "王小可11", gender: "男", count: "120", amount: "9089元" },
516
- { id: "2", name: "梦之遥", gender: "女", count: "20", amount: "89元" },
517
- ],
518
- },
519
- onPrintData: data => {
520
- return data;
521
- },
522
- onTemplate: data => {
523
- return data;
524
- },
525
- defaultTemplate: {
526
- panels: [
527
- {
528
- index: 0,
529
- name: 1,
530
- paperType: "A4",
531
- height: 297,
532
- width: 210,
533
- paperHeader: 0,
534
- paperFooter: 841.8897637795277,
535
- printElements: [
536
- {
537
- options: {
538
- left: 117,
539
- top: 94.5,
540
- height: 9.75,
541
- width: 120,
542
- field: "name",
543
- testData: "内容",
544
- title: "文本",
545
- qid: "name",
546
- },
547
- printElementType: {
548
- title: "文本",
549
- type: "text",
550
- },
551
- },
552
- {
553
- options: {
554
- left: 160.5,
555
- top: 174,
556
- height: 36,
557
- width: 550,
558
- fields: [],
559
- field: "table",
560
- qid: "table",
561
- columns: [
562
- [
563
- {
564
- width: 137.5,
565
- title: "名称",
566
- field: "name",
567
- checked: true,
568
- columnId: "name",
569
- fixed: false,
570
- rowspan: 1,
571
- colspan: 1,
572
- align: "center",
573
- },
574
- {
575
- width: 137.5,
576
- title: "性别",
577
- field: "gender",
578
- checked: true,
579
- columnId: "gender",
580
- fixed: false,
581
- rowspan: 1,
582
- colspan: 1,
583
- align: "center",
584
- },
585
- {
586
- width: 137.5,
587
- title: "数量",
588
- field: "count",
589
- checked: true,
590
- columnId: "count",
591
- fixed: false,
592
- rowspan: 1,
593
- colspan: 1,
594
- align: "center",
595
- },
596
- {
597
- width: 137.5,
598
- title: "金额",
599
- field: "amount",
600
- checked: true,
601
- columnId: "amount",
602
- fixed: false,
603
- rowspan: 1,
604
- colspan: 1,
605
- align: "center",
606
- },
607
- ],
608
- ],
609
- },
610
- printElementType: {
611
- title: "表格",
612
- type: "table",
613
- editable: true,
614
- columnDisplayEditable: true,
615
- columnDisplayIndexEditable: true,
616
- columnTitleEditable: true,
617
- columnResizable: true,
618
- columnAlignEditable: true,
619
- isEnableEditField: true,
620
- isEnableContextMenu: true,
621
- isEnableInsertRow: true,
622
- isEnableDeleteRow: true,
623
- isEnableInsertColumn: true,
624
- isEnableDeleteColumn: true,
625
- isEnableMergeCell: true,
626
- },
627
- },
628
- ],
629
- paperNumberContinue: true,
630
- watermarkOptions: {},
631
- panelLayoutOptions: {},
632
- },
633
- ],
634
- },
635
- onSubmit: data => {
636
- console.log(6666, data);
637
- },
638
- });
639
-
640
- // this.$hiprint.print({
641
- // printData: {
642
- // name: "CcSimple",
643
- // barcode: "33321323",
644
- // table: [
645
- // { id: "1", name: "王小可123", gender: "男", count: "120", amount: "9089元" },
646
- // { id: "2", name: "梦之遥", gender: "女", count: "20", amount: "89元" },
647
- // ],
648
- // table1: [
649
- // { id: "1", name: "王小可11", gender: "男", count: "120", amount: "9089元" },
650
- // { id: "2", name: "梦之遥", gender: "女", count: "20", amount: "89元" },
651
- // ],
652
- // },
653
- // onPrintData: data => {
654
- // return data;
655
- // },
656
- // onTemplate: data => {
657
- // return data;
658
- // },
659
- // defaultTemplate: {
660
- // panels: [
661
- // {
662
- // index: 0,
663
- // name: 1,
664
- // paperType: "A4",
665
- // height: 297,
666
- // width: 210,
667
- // paperHeader: 0,
668
- // paperFooter: 841.8897637795277,
669
- // printElements: [
670
- // {
671
- // options: {
672
- // left: 117,
673
- // top: 94.5,
674
- // height: 9.75,
675
- // width: 120,
676
- // field: "name",
677
- // testData: "内容",
678
- // title: "文本",
679
- // qid: "name",
680
- // },
681
- // printElementType: {
682
- // title: "文本",
683
- // type: "text",
684
- // },
685
- // },
686
- // {
687
- // options: {
688
- // left: 160.5,
689
- // top: 174,
690
- // height: 36,
691
- // width: 550,
692
- // fields: [],
693
- // field: "table",
694
- // qid: "table",
695
- // columns: [
696
- // [
697
- // {
698
- // width: 137.5,
699
- // title: "名称",
700
- // field: "name",
701
- // checked: true,
702
- // columnId: "name",
703
- // fixed: false,
704
- // rowspan: 1,
705
- // colspan: 1,
706
- // align: "center",
707
- // },
708
- // {
709
- // width: 137.5,
710
- // title: "性别",
711
- // field: "gender",
712
- // checked: true,
713
- // columnId: "gender",
714
- // fixed: false,
715
- // rowspan: 1,
716
- // colspan: 1,
717
- // align: "center",
718
- // },
719
- // {
720
- // width: 137.5,
721
- // title: "数量",
722
- // field: "count",
723
- // checked: true,
724
- // columnId: "count",
725
- // fixed: false,
726
- // rowspan: 1,
727
- // colspan: 1,
728
- // align: "center",
729
- // },
730
- // {
731
- // width: 137.5,
732
- // title: "金额",
733
- // field: "amount",
734
- // checked: true,
735
- // columnId: "amount",
736
- // fixed: false,
737
- // rowspan: 1,
738
- // colspan: 1,
739
- // align: "center",
740
- // },
741
- // ],
742
- // ],
743
- // },
744
- // printElementType: {
745
- // title: "表格",
746
- // type: "table",
747
- // editable: true,
748
- // columnDisplayEditable: true,
749
- // columnDisplayIndexEditable: true,
750
- // columnTitleEditable: true,
751
- // columnResizable: true,
752
- // columnAlignEditable: true,
753
- // isEnableEditField: true,
754
- // isEnableContextMenu: true,
755
- // isEnableInsertRow: true,
756
- // isEnableDeleteRow: true,
757
- // isEnableInsertColumn: true,
758
- // isEnableDeleteColumn: true,
759
- // isEnableMergeCell: true,
760
- // },
761
- // },
762
- // ],
763
- // paperNumberContinue: true,
764
- // watermarkOptions: {},
765
- // panelLayoutOptions: {},
766
- // },
767
- // ],
768
- // },
769
- // onSubmit: data => {
770
- // console.log(6666, data);
771
- // },
772
- // });
773
- },
774
530
  },
775
531
  };
776
532
  </script>
package/src/main.js CHANGED
@@ -2,12 +2,13 @@ import Vue from "vue";
2
2
  import ElementUI from "element-ui";
3
3
  import "element-ui/lib/theme-chalk/index.css";
4
4
  import App from "./App.vue";
5
- import OlCom, { swaggerInstall, Hiprint } from "@/package/index.js";
5
+ import OlCom, { swaggerInstall } from "@/package/index.js";
6
6
  Vue.use(ElementUI);
7
- Vue.use(Hiprint);
8
7
 
9
8
  Vue.use(OlCom);
10
- swaggerInstall("http://220.179.249.140:20025/swagger/v1/swagger.json").then(() => {});
9
+ swaggerInstall("http://220.179.249.140:20019/swagger/v1/swagger.json").then(
10
+ () => {}
11
+ );
11
12
  new Vue({
12
- render: h => h(App),
13
+ render: (h) => h(App),
13
14
  }).$mount("#app");
@@ -18,17 +18,16 @@
18
18
  >
19
19
  <!-- 表头插槽 -->
20
20
  <template v-slot:header>
21
- <el-tooltip
22
- v-if="column.prop"
23
- :content="`${column.label} ${column.prop} ${column.show}`"
24
- placement="top"
25
- >
21
+ <el-tooltip v-if="column.prop" :content="`${column.label} ${column.prop}`" placement="top">
26
22
  <span>{{ column.label }}</span>
27
23
  </el-tooltip>
28
24
  <!-- 多级表头无prop无需提示 -->
29
25
  <span v-else>{{ column.label }}</span>
30
26
  </template>
31
27
 
28
+ <template v-for="(index, name) in $scopedSlots" v-slot:[name]="data">
29
+ <slot :name="name" v-bind="data"></slot>
30
+ </template>
32
31
  <!-- 递归渲染子列 -->
33
32
  <template v-if="column.children && column.children.length">
34
33
  <TableColumn v-for="(child, idx) in column.children" :key="idx" :column="child">
@@ -38,43 +37,41 @@
38
37
  </template>
39
38
  </TableColumn>
40
39
  </template>
41
- <!-- 内容插槽:自定义渲染 -->
42
- <template v-else-if="column.render" v-slot="scope">
43
- <render-dom :render="() => column.render(scope.row)" />
44
- </template>
45
- <template v-else-if="column.renderSlot" v-slot="scope">
46
- <slot :row="scope.row" :name="column.prop" />
40
+ <template v-slot="scope" v-if="!column.children">
41
+ <render-dom v-if="column.render" :render="() => column.render(scope.row)" />
42
+ <slot v-else-if="column.renderSlot" :row="scope.row" :name="column.prop" />
43
+ <span v-else>{{ scope.row[column.prop] }}</span>
47
44
  </template>
48
45
  </el-table-column>
49
46
  </template>
50
47
  <script>
51
- export default {
52
- name: "TableColumn",
53
- components: {
54
- renderDom: {
55
- functional: true,
56
- props: { render: Function },
57
- render(h, ctx) {
58
- return <div>{ctx.props.render()}</div>;
59
- },
48
+ export default {
49
+ name: "TableColumn",
50
+ components: {
51
+ renderDom: {
52
+ functional: true,
53
+ props: { render: Function },
54
+ render(h, ctx) {
55
+ return <div>{ctx.props.render()}</div>;
60
56
  },
61
- TableColumn: null, // 递归自身,见下方
62
- },
63
- props: {
64
- column: { type: Object, required: true },
65
57
  },
66
- data() {
67
- return {};
68
- },
69
- // beforeCreate() {
70
- // // 递归注册自身
71
- // this.$options.components.TableColumn = require("./TableColumn.vue").default;
72
- // },
73
- computed: {
74
- shouldShow() {
75
- if (this.column.hasOwnProperty("show")) return this.column.show;
76
- return true;
77
- },
58
+ TableColumn: null, // 递归自身,见下方
59
+ },
60
+ props: {
61
+ column: { type: Object, required: true },
62
+ },
63
+ data() {
64
+ return {};
65
+ },
66
+ // beforeCreate() {
67
+ // // 递归注册自身
68
+ // this.$options.components.TableColumn = require("./TableColumn.vue").default;
69
+ // },
70
+ computed: {
71
+ shouldShow() {
72
+ if (this.column.hasOwnProperty("show")) return this.column.show;
73
+ return true;
78
74
  },
79
- };
75
+ },
76
+ };
80
77
  </script>
@@ -242,10 +242,6 @@
242
242
  </el-row>
243
243
  </div>
244
244
  <printTemplate v-show="false" class="printTemplate" :print-list-obj="printListObj" />
245
- <el-dialog title="打印" :visible.sync="showPrint">
246
- <div>123</div>
247
- <!-- <ol-print v-if="showPrint" /> -->
248
- </el-dialog>
249
245
  </div>
250
246
  </template>
251
247
  <script>
@@ -436,10 +432,6 @@ export default {
436
432
  type: Function,
437
433
  default: null,
438
434
  },
439
- printUrl: {
440
- type: String,
441
- default: "",
442
- },
443
435
  },
444
436
 
445
437
  data() {
@@ -454,7 +446,6 @@ export default {
454
446
  twinPage: 1,
455
447
  columnsWatcher: null,
456
448
  key: 0,
457
- showPrint: false,
458
449
  };
459
450
  },
460
451
  computed: {
@@ -632,20 +623,17 @@ export default {
632
623
  this.$emit("refreshTable");
633
624
  },
634
625
  printTable() {
635
- // 获取当前带单路由
636
- const url = this.printUrl;
637
- this.showPrint = true;
638
- // console.log("printTable");
639
- // if (this.tableData.rows.length <= 0) return;
640
- // this.printListObj.title = this.$router.history.current.name;
641
- // this.printListObj.tableHeader = this.tableData.columns;
642
- // this.printListObj.tableData = this.tableData.rows;
643
- // console.log(this.printListObj);
644
- // setTimeout(() => {
645
- // $(".printTemplate").show();
646
- // $(".printTemplate").jqprint();
647
- // $(".printTemplate").hide();
648
- // }, 50);
626
+ console.log("printTable");
627
+ if (this.tableData.rows.length <= 0) return;
628
+ this.printListObj.title = this.$router.history.current.name;
629
+ this.printListObj.tableHeader = this.tableData.columns;
630
+ this.printListObj.tableData = this.tableData.rows;
631
+ console.log(this.printListObj);
632
+ setTimeout(() => {
633
+ $(".printTemplate").show();
634
+ $(".printTemplate").jqprint();
635
+ $(".printTemplate").hide();
636
+ }, 50);
649
637
  this.$emit("printTable");
650
638
  },
651
639
  selectAll(val) {
@@ -1,110 +0,0 @@
1
- {
2
- "panels": [
3
- {
4
- "index": 0,
5
- "name": 1,
6
- "paperType": "A4",
7
- "height": 297,
8
- "width": 210,
9
- "paperHeader": 0,
10
- "paperFooter": 841.8897637795277,
11
- "printElements": [
12
- {
13
- "options": {
14
- "left": 117,
15
- "top": 94.5,
16
- "height": 9.75,
17
- "width": 120,
18
- "field": "name",
19
- "testData": "内容",
20
- "title": "文本",
21
- "qid": "name"
22
- },
23
- "printElementType": {
24
- "title": "文本",
25
- "type": "text"
26
- }
27
- },
28
- {
29
- "options": {
30
- "left": 160.5,
31
- "top": 174,
32
- "height": 36,
33
- "width": 550,
34
- "fields": [],
35
- "field": "table",
36
- "qid": "table",
37
- "columns": [
38
- [
39
- {
40
- "width": 137.5,
41
- "title": "名称",
42
- "field": "name",
43
- "checked": true,
44
- "columnId": "name",
45
- "fixed": false,
46
- "rowspan": 1,
47
- "colspan": 1,
48
- "align": "center"
49
- },
50
- {
51
- "width": 137.5,
52
- "title": "性别",
53
- "field": "gender",
54
- "checked": true,
55
- "columnId": "gender",
56
- "fixed": false,
57
- "rowspan": 1,
58
- "colspan": 1,
59
- "align": "center"
60
- },
61
- {
62
- "width": 137.5,
63
- "title": "数量",
64
- "field": "count",
65
- "checked": true,
66
- "columnId": "count",
67
- "fixed": false,
68
- "rowspan": 1,
69
- "colspan": 1,
70
- "align": "center"
71
- },
72
- {
73
- "width": 137.5,
74
- "title": "金额",
75
- "field": "amount",
76
- "checked": true,
77
- "columnId": "amount",
78
- "fixed": false,
79
- "rowspan": 1,
80
- "colspan": 1,
81
- "align": "center"
82
- }
83
- ]
84
- ]
85
- },
86
- "printElementType": {
87
- "title": "表格",
88
- "type": "table",
89
- "editable": true,
90
- "columnDisplayEditable": true,
91
- "columnDisplayIndexEditable": true,
92
- "columnTitleEditable": true,
93
- "columnResizable": true,
94
- "columnAlignEditable": true,
95
- "isEnableEditField": true,
96
- "isEnableContextMenu": true,
97
- "isEnableInsertRow": true,
98
- "isEnableDeleteRow": true,
99
- "isEnableInsertColumn": true,
100
- "isEnableDeleteColumn": true,
101
- "isEnableMergeCell": true
102
- }
103
- }
104
- ],
105
- "paperNumberContinue": true,
106
- "watermarkOptions": {},
107
- "panelLayoutOptions": {}
108
- }
109
- ]
110
- }