@leevan/jtui 2.0.9 → 2.0.12

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/examples/App.vue CHANGED
@@ -18,11 +18,7 @@
18
18
  </el-menu>
19
19
  </el-aside>
20
20
  <el-main>
21
- <table-ptbg v-if="menuIdx == 1"></table-ptbg>
22
- <table-dsj v-if="menuIdx == 2"></table-dsj>
23
- <table-fzbg v-if="menuIdx == 3"></table-fzbg>
24
- <table-tree v-if="menuIdx == 4"></table-tree>
25
- <tree-table v-if="menuIdx == 5"></tree-table>
21
+ <component :is="menuIdx"></component>
26
22
  </el-main>
27
23
  </el-container>
28
24
  </div>
@@ -34,13 +30,17 @@ import tableDsj from './tableTest/table-dsj.vue';
34
30
  import tableFzbg from './tableTest/table-fzbg.vue';
35
31
  import tableTree from './tableTest/table-tree.vue';
36
32
  import treeTable from './tableTest/tree-table.vue';
33
+ import moreCharts from './echarts/moreCharts.vue';
34
+ import LForm from './form/form.vue'
37
35
  export default {
38
36
  components:{
39
37
  tablePtbg,
40
38
  tableDsj,
41
39
  tableFzbg,
42
40
  tableTree,
43
- treeTable
41
+ treeTable,
42
+ moreCharts,
43
+ LForm
44
44
  },
45
45
  name: 'App',
46
46
  created(){
@@ -51,26 +51,34 @@ export default {
51
51
  menu:[
52
52
  {
53
53
  name:'普通表格',
54
- idx:'1'
54
+ idx:'table-ptbg'
55
55
  },
56
56
  {
57
57
  name:'大数据表格',
58
- idx:'2'
58
+ idx:'table-dsj'
59
59
  },
60
60
  {
61
61
  name:'分组表格',
62
- idx:'3'
62
+ idx:'table-fzbg'
63
63
  },
64
64
  {
65
65
  name:'树',
66
- idx:'4'
66
+ idx:'table-tree'
67
67
  },
68
68
  {
69
69
  name:'树表',
70
- idx:'5'
70
+ idx:'tree-table'
71
+ },
72
+ {
73
+ name:'多个图表',
74
+ idx:'more-charts'
75
+ },
76
+ {
77
+ name:'表单',
78
+ idx:'l-form'
71
79
  }
72
80
  ],
73
- menuIdx:'1'
81
+ menuIdx:'more-charts'
74
82
  }
75
83
  },
76
84
  methods: {
@@ -0,0 +1,159 @@
1
+ <!--
2
+ * @Author: leevan
3
+ * @Date: 2022-03-07 17:00:56
4
+ * @LastEditTime: 2022-03-07 21:09:34
5
+ * @LastEditors: leevan
6
+ * @FilePath: /jtui-pc/examples/echarts/moreCharts.vue
7
+ -->
8
+ <template>
9
+ <div style="height:400px;width:100%">
10
+ <div
11
+ class="chart"
12
+ v-for="(item, index) in datas"
13
+ :key="index"
14
+ :style="{
15
+ height: datas.length > 2 ? '49%' : '100%',
16
+ width: datas.length > 1 ? '49%' : '100%',
17
+ }"
18
+ >
19
+ {{item.isShow}}
20
+ <jt-echarts-pc
21
+ v-if="item.isShow"
22
+ :ref="`myChart` + index"
23
+ :formattingTime="true"
24
+ :dateInterval="'minute'"
25
+ :echartsOption="item.chartData"
26
+ :seriesData="item.serdata"
27
+ :moduleName="'yc-gkcscx-echart' + index"
28
+ :ID="'yc-gkcscx-echarts' + index"
29
+ :echartWidth="'100%'"
30
+ :echartHeight="'100%'"
31
+ :setStyleTools="true"
32
+ >
33
+ </jt-echarts-pc>
34
+ </div>
35
+ </div>
36
+ </template>
37
+
38
+ <script>
39
+ export default {
40
+ data() {
41
+ return {
42
+ isShow:false,
43
+ datas: [
44
+ {
45
+ chartData: {
46
+ option: {
47
+ title: {},
48
+ xAxis: { type: "", data: [] },
49
+ yAxis: { type: "value" },
50
+ series: [],
51
+ grid: {
52
+ left: "3%",
53
+ right: "6%",
54
+ bottom: "10%",
55
+ containLabel: true,
56
+ },
57
+ },
58
+ },
59
+ serdata: [
60
+ {
61
+ xcol: "TM",
62
+ data: [
63
+ ["2022-03-06 00:00:00", 30],
64
+ ["2022-03-06 01:00:00", 30],
65
+ ["2022-03-06 02:00:00", 30],
66
+ ["2022-03-06 03:00:00", 30],
67
+ ["2022-03-06 04:00:00", 30],
68
+ ["2022-03-06 05:00:00", 30],
69
+ ["2022-03-06 06:00:00", 30],
70
+ ["2022-03-06 07:00:00", 30],
71
+ ["2022-03-06 09:00:00", 30],
72
+ ["2022-03-06 10:00:00", 30],
73
+ ["2022-03-06 11:00:00", 31],
74
+ ["2022-03-06 12:00:00", 30],
75
+ ["2022-03-06 13:00:00", 30],
76
+ ["2022-03-06 14:00:00", 30],
77
+ ["2022-03-06 15:00:00", 30],
78
+ ["2022-03-06 16:00:00", 31],
79
+ ["2022-03-06 17:00:00", 31],
80
+ ["2022-03-06 18:00:00", 31],
81
+ ["2022-03-06 19:00:00", 31],
82
+ ["2022-03-06 21:00:00", 30],
83
+ ["2022-03-06 22:00:00", 31],
84
+ ["2022-03-06 23:00:00", 31],
85
+ ],
86
+ name: "GSM信号强度",
87
+ xcol_type: "String",
88
+ ycol: "VL",
89
+ ycol_type: "String",
90
+ },
91
+ ],
92
+ isShow:false,
93
+ },
94
+ {
95
+ chartData: {
96
+ option: {
97
+ title: {},
98
+ xAxis: { type: "", data: [] },
99
+ yAxis: { type: "value" },
100
+ series: [],
101
+ grid: {
102
+ left: "3%",
103
+ right: "6%",
104
+ bottom: "10%",
105
+ containLabel: true,
106
+ },
107
+ },
108
+ },
109
+ serdata: [
110
+ {
111
+ xcol: "TM",
112
+ data: [
113
+ ["2022-03-06 00:00:00", 4.1],
114
+ ["2022-03-06 01:00:00", 4.1],
115
+ ["2022-03-06 02:00:00", 4.1],
116
+ ["2022-03-06 03:00:00", 4.1],
117
+ ["2022-03-06 04:00:00", 4.1],
118
+ ["2022-03-06 05:00:00", 4.1],
119
+ ["2022-03-06 06:00:00", 4.1],
120
+ ["2022-03-06 07:00:00", 4.1],
121
+ ["2022-03-06 09:00:00", 4.2],
122
+ ["2022-03-06 10:00:00", 4.2],
123
+ ["2022-03-06 11:00:00", 4.2],
124
+ ["2022-03-06 12:00:00", 4.1],
125
+ ["2022-03-06 13:00:00", 4.2],
126
+ ["2022-03-06 14:00:00", 4.1],
127
+ ["2022-03-06 15:00:00", 4.1],
128
+ ["2022-03-06 16:00:00", 4.1],
129
+ ["2022-03-06 17:00:00", 4.1],
130
+ ["2022-03-06 18:00:00", 4.1],
131
+ ["2022-03-06 19:00:00", 4.1],
132
+ ["2022-03-06 21:00:00", 4.1],
133
+ ["2022-03-06 22:00:00", 4.1],
134
+ ["2022-03-06 23:00:00", 4.1],
135
+ ],
136
+ name: "电池电压",
137
+ xcol_type: "String",
138
+ ycol: "VL",
139
+ ycol_type: "String",
140
+ },
141
+ ],
142
+ isShow:false
143
+ },
144
+ ],
145
+ };
146
+ },
147
+ mounted(){
148
+ for(let i=0;i<this.datas.length;i++){
149
+ setTimeout(()=>{
150
+ this.datas[i].isShow = true;
151
+ },i*10)
152
+ }
153
+
154
+ }
155
+ };
156
+ </script>
157
+
158
+ <style lang="scss" scoped>
159
+ </style>
@@ -0,0 +1,61 @@
1
+ <!--
2
+ * @Author: leevan
3
+ * @Date: 2022-03-09 15:49:08
4
+ * @LastEditTime: 2022-03-09 19:21:19
5
+ * @LastEditors: leevan
6
+ * @FilePath: /jtui-pc/examples/form/form.vue
7
+ -->
8
+ <template>
9
+ <div>
10
+ <button @click="printData">打印数据</button>
11
+ <jt-form-pc
12
+ id="onDutyPoepleSignIn"
13
+ ref="onDutyPoepleSignIn"
14
+ :model="model"
15
+ :formConfig="formConfig"
16
+ :rules="rules"
17
+ >
18
+ </jt-form-pc>
19
+ </div>
20
+ </template>
21
+
22
+ <script>
23
+ export default {
24
+ data() {
25
+ return {
26
+ model: {
27
+ select: [],
28
+ },
29
+ formConfig: [
30
+ {
31
+ label: "选择器",
32
+ modelKey: "select",
33
+ type: "select",
34
+ width: 200,
35
+ isCreate:true,
36
+ multiple:true,
37
+ options: [
38
+ {
39
+ value: "0",
40
+ label: "黄金糕",
41
+ },
42
+ {
43
+ value: "1",
44
+ label: "双皮奶",
45
+ },
46
+ ],
47
+ },
48
+ ],
49
+ rules: {},
50
+ };
51
+ },
52
+ methods:{
53
+ printData(){
54
+ console.log(this.model);
55
+ }
56
+ }
57
+ };
58
+ </script>
59
+
60
+ <style lang="scss" scoped>
61
+ </style>
@@ -2,6 +2,7 @@
2
2
  <div style="height:100%">
3
3
  <div style="margin-bottom:12px;">
4
4
  <el-button size="mini" @click="exportTableData">导出数据</el-button>
5
+ <el-button size="mini" @click="exportDataExcel">直接导出数据</el-button>
5
6
  <el-button size="mini" @click="importData">导入数据</el-button>
6
7
  <el-button size="mini" @click="clearData">清空数据</el-button>
7
8
  <el-switch
@@ -144,6 +145,10 @@ import { data23 , data13 } from '../../packages/jt-table-pc/data2';
144
145
  exportTableData(){
145
146
  this.$refs.tablePtbg.exportTableData();
146
147
  },
148
+ exportDataExcel(){
149
+ debugger;
150
+ this.$refs.tablePtbg.exportData({ type: 'csv' });
151
+ },
147
152
  //导入数据
148
153
  importData(){
149
154
  this.$refs.tablePtbg.importTableData();
@@ -1,13 +1,24 @@
1
+ <!--
2
+ * @Author: leevan
3
+ * @Date: 2022-01-15 17:02:55
4
+ * @LastEditTime: 2022-03-03 14:10:39
5
+ * @LastEditors: leevan
6
+ * @FilePath: /jtui-pc/examples/tableTest/table-tree.vue
7
+ -->
1
8
  <template>
2
9
  <div style="position:relative;height:600px">
3
- <jt-table-pc
4
- id="table_tree"
5
- ref="table_tree"
6
- :data="data[0]"
7
- tableType="tree"
8
- :handlerConfig="handlerConfig"
9
- @treeTxtClick="treeTxtClick"
10
- :treeTypeConfig="treeTypeConfig"></jt-table-pc>
10
+ <el-button @click="getCurrent">获取选中</el-button>
11
+ <div style="position:relative;margin-top:10px;height:600px">
12
+ <jt-table-pc
13
+ id="table_tree"
14
+ ref="table_tree"
15
+ :data="data[0]"
16
+ tableType="tree"
17
+ :handlerConfig="handlerConfig"
18
+ @treeTxtClick="treeTxtClick"
19
+ :treeTypeConfig="treeTypeConfig"></jt-table-pc>
20
+ </div>
21
+
11
22
  </div>
12
23
  </template>
13
24
 
@@ -41,6 +52,9 @@
41
52
  methods:{
42
53
  treeTxtClick(row,treePath){
43
54
  console.log(row,treePath);
55
+ },
56
+ getCurrent(){
57
+
44
58
  }
45
59
  }
46
60
  }
@@ -1,6 +1,15 @@
1
+ <!--
2
+ * @Author: leevan
3
+ * @Date: 2022-03-09 19:26:41
4
+ * @LastEditTime: 2022-03-12 22:22:23
5
+ * @LastEditors: leevan
6
+ * @FilePath: /jtui-pc/examples/tableTest/tree-table.vue
7
+ -->
1
8
  <template>
2
9
  <div style="position:relative;height:600px">
3
- <jt-table-pc
10
+ <el-button @click="getCurrent">获取选中</el-button>
11
+ <div style="position:relative;margin-top:10px;height:600px">
12
+ <jt-table-pc
4
13
  id="tree_table"
5
14
  ref="tree_table"
6
15
  :data="data[0]"
@@ -8,6 +17,8 @@
8
17
  :handlerConfig="handlerConfig"
9
18
  :treeTypeConfig="treeTypeConfig"
10
19
  @handlerClick="handlerClick"></jt-table-pc>
20
+ </div>
21
+
11
22
  </div>
12
23
  </template>
13
24
 
@@ -45,12 +56,13 @@ import { data } from '../data2.js';
45
56
  methods:{
46
57
  async handlerClick(value,row,rowIndex){
47
58
  if(value == 'stcd_search'){
48
- await this.$refs.tree_table.setTreeTempData([
49
- {"path":"NB_ADDVCD_DS?nbcode=/srdao/sqdb/ST_PPTN_05&stlbz=T","inBottons":[{"funcode":"stcd_ppcdreflash","color":"#409EFF","size":14,"name":"刷新","icon":"iconzengjia"},{"funcode":"stcd_search","color":"#409EFF","size":14,"name":"检索","icon":"iconzengjia"}],"name":"我是父组件检索加载的-[/srjtcontrol/nb/PN05ToPPTN]","pjcd":""}
50
- ]);
59
+ await this.$refs.tree_table.setTreeTempData();
51
60
  this.$refs.tree_table.reloadTreeChilds(row);
52
61
  }
53
- }
62
+ } ,
63
+ getCurrent(){
64
+ console.log(this.$refs.tree_table.jtTable().getCheckboxRecords());
65
+ }
54
66
  }
55
67
  }
56
68
  </script>