@lambo-design/schema-paging-table 1.0.0-beta.3 → 1.0.0-beta.30

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.
Files changed (2) hide show
  1. package/package.json +14 -6
  2. package/src/index.vue +507 -358
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lambo-design/schema-paging-table",
3
- "version": "1.0.0-beta.3",
3
+ "version": "1.0.0-beta.30",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "author": "lambo",
@@ -10,10 +10,18 @@
10
10
  "registry": "https://registry.npmjs.org/"
11
11
  },
12
12
  "devDependencies": {
13
- "@lambo-design/core": "^4.7.1-beta.103",
14
- "@lambo-design/shared": "^1.0.0-beta.93",
15
- "@lambo-design/paging-table": "^1.0.0-beta.69",
16
- "@lambo-design/schema-form": "^1.0.0-beta.24"
13
+ "standard-version": "^9.5.0",
14
+ "@lambo-design/core": "^4.7.1-beta.139",
15
+ "@lambo-design/schema-form": "^1.0.0-beta.56",
16
+ "@lambo-design/shared": "^1.0.0-beta.199",
17
+ "@lambo-design/paging-table": "^1.0.0-beta.77"
17
18
  },
18
- "scripts": {}
19
+ "scripts": {
20
+ "release": "pnpm release-beta && git push --follow-tags && pnpm re-publish",
21
+ "release-major": "standard-version --release-as major",
22
+ "release-minor": "standard-version --release-as minor",
23
+ "release-patch": "standard-version --release-as patch",
24
+ "release-beta": "standard-version --prerelease beta",
25
+ "re-publish": "pnpm publish --access public --no-git-checks"
26
+ }
19
27
  }
package/src/index.vue CHANGED
@@ -1,358 +1,507 @@
1
- <template>
2
- <LamboPagingTable
3
- ref="schemaPagingTable"
4
- :dataUrl="dataUrl"
5
- :columns="tableColumn"
6
- :searchParams="tableSearchParams"
7
- :transformResponse="transformResponse"
8
- @on-row-click="onRowClick"
9
- @on-selection-change="onSelectionChange"
10
- @on-select="onSelect"
11
- @on-select-cancel="onSelectCancel"
12
- @on-select-all="onSelectAll"
13
- @on-select-all-cancel="onSelectAllCancel">
14
- <div slot="search">
15
- <LamboSchemaForm :labelWidth="100" ref="lamboSchemaForm" v-model="queryForm" :form-type="'search'" :fieldList="formFields" @doSearch="doSearch" @reset="onReset"/>
16
- <div v-if="rowName" class="tags">
17
- <Tag v-for="item in selectTags" :key="item.key" :name="item.key" closable @on-close="tagClose">
18
- {{ item.value }}
19
- </Tag>
20
- </div>
21
- </div>
22
- <div slot="buttons">
23
- <Button
24
- v-if="spreadButton.length > 0"
25
- v-for="(item,index) in spreadButton"
26
- type="primary"
27
- :ghost="true"
28
- :icon="item.icon"
29
- v-permission="item.permission"
30
- :key="index"
31
- @click="doClick(item)"
32
- style="margin-right: 5px">
33
- {{ item.name }}
34
- </Button>
35
- <Dropdown v-if="dropDownButton.length > 0">
36
- <Button type="primary" :ghost="true" icon="md-more">
37
- 更多操作
38
- <Icon type="ios-arrow-down"></Icon>
39
- </Button>
40
- <DropdownMenu slot="list">
41
- <DropdownItem
42
- v-for="(item,index) in dropDownButton"
43
- v-permission="item.permission"
44
- :key="index"
45
- >
46
- <Icon :type="item.icon" style="margin-right: 5px"></Icon>
47
- <span @click="doClick(item)">{{ item.name }}</span>
48
- </DropdownItem>
49
- </DropdownMenu>
50
- </Dropdown>
51
- </div>
52
- </LamboPagingTable>
53
- </template>
54
- <script>
55
- import ajax from '@lambo-design/shared/utils/ajax'
56
- import { operateBtn, operateHref } from '@lambo-design/shared/utils/assist'
57
- import LamboPagingTable from '@lambo-design/paging-table'
58
- // import LamboSchemaForm from '@lambo-design/schema-form'
59
- // const LamboSchemaForm = ()=> import('@lambo-design/schema-form')
60
- export default {
61
- name:"schema-paging-table",
62
- components: {
63
- LamboSchemaForm: () => import('@lambo-design/schema-form'),
64
- LamboPagingTable,
65
- },
66
- data() {
67
- return {
68
- queryForm: null,
69
- tableSearchParams: {},
70
- selection: [],
71
- selectStore: [],
72
- selectTags: [],
73
- selectRows: [],
74
- selectedKeys: [],
75
- }
76
- },
77
- props:{
78
- dataUrl:{
79
- type: String,
80
- required: true,
81
- default: ''
82
- },
83
- columnList:{
84
- type: Array,
85
- required: true,
86
- default(){
87
- return []
88
- }
89
- },
90
- rowKey: {
91
- type: String,
92
- require: false,
93
- default: ""
94
- },
95
- rowName: {
96
- type: String,
97
- require: false,
98
- default: ""
99
- },
100
- form:{
101
- type: Object,
102
- required: true,
103
- default(){
104
- return {}
105
- }
106
- },
107
- formFields:{
108
- type: Array,
109
- required: true,
110
- default(){
111
- return []
112
- }
113
- },
114
- buttonList:{
115
- type: Array,
116
- required: true,
117
- default(){
118
- return []
119
- }
120
- },
121
- },
122
- computed: {
123
- tableColumn: function () {
124
- let columns = []
125
- let self = this
126
- self.columnList.forEach((item,index)=>{
127
- let obj = item
128
- if(obj.hasOwnProperty("enums") && obj.hasOwnProperty("translate") && obj.translate === 'enums'){
129
- obj.render = function (h, param) {
130
- let state = param.row[obj.key]
131
- return h('span', obj.enums[state])
132
- }
133
- }else if(obj.hasOwnProperty("type") && obj.type === "operate"){
134
- obj.render = (h, param) => {
135
- return h('div',
136
- obj.button.map((item,index)=>{
137
- return operateHref(self, h, param.row, item.name, (vm, currentRow) => {
138
- if(item.clickEvent?.type==="route"){
139
- // self.$Message.info(item.clickEvent.name)
140
- let query = item.clickEvent?.route?.keys?.reduce((acc,sourceItem)=>{
141
- return Object.assign(acc,{[sourceItem]:currentRow[sourceItem]})
142
- },{})
143
- this.$router.push({
144
- path: item.clickEvent?.route?.path,
145
- query
146
- })
147
- }else if(item.clickEvent?.type==="request"){
148
- // self.$Message.info(item.clickEvent.name)
149
- let data = item.clickEvent?.request?.keys?.reduce((acc,sourceItem)=>{
150
- return Object.assign(acc,{[sourceItem]:currentRow[sourceItem]})
151
- },{})
152
- let request = {
153
- url:item.clickEvent.request.url,
154
- method:item.clickEvent.request.method,
155
- param:data,
156
- }
157
- let response = item.clickEvent.response
158
- self.fetch(request,response)
159
- }else if(item.clickEvent?.type==="method"){
160
- let args = item.clickEvent?.method?.keys?.reduce((total,current)=>{
161
- return Object.assign(total,{[current]:currentRow[current]})
162
- },{})
163
- self.$emit(item.clickEvent?.method?.name,args)
164
- }else if(item.clickEvent?.type==="modal"){
165
- self.$Message.info(item.clickEvent.name)
166
- }
167
- },item.permission)
168
- })
169
- )
170
- }
171
- }
172
- columns.push(item)
173
- })
174
- return columns
175
- },
176
- spreadButton: function () {
177
- return this.buttonList.slice(0,3)
178
- },
179
- dropDownButton: function () {
180
- return this.buttonList.slice(3 - this.buttonList.length)
181
- },
182
- },
183
- watch:{
184
- form: function(val) {
185
- this.queryForm = val
186
- }
187
- },
188
- created() {
189
- },
190
- methods: {
191
- doClick(item){
192
- let self = this;
193
- if(item.clickEvent?.type==="route"){
194
- // self.$Message.info(item.clickEvent.name)
195
- let query = item.clickEvent?.route?.keys?.reduce((acc,sourceItem)=>{
196
- return Object.assign(acc,{[sourceItem]:param.row[sourceItem]})
197
- },{})
198
- this.$router.push({
199
- path: item.clickEvent?.route?.path,
200
- query
201
- })
202
- }else if(item.clickEvent?.type==="method"){
203
- // self.$Message.info(item.clickEvent.name)
204
- let param = item.clickEvent?.method?.keys?.reduce((acc,sourceItem)=>{
205
- return Object.assign(acc,{[sourceItem]:self.selection[sourceItem]})
206
- },{})
207
- self.$emit(item.clickEvent?.method?.name,param)
208
- }else if(item.clickEvent?.type==="modal"){
209
- self.$Message.info(item.clickEvent.name)
210
- }
211
- },
212
- doSearch: function () {
213
- this.tableSearchParams = Object.assign({}, this.queryForm)
214
- },
215
- onReset() {
216
- this.doSearch()
217
- },
218
- fetch: function (request,response) {
219
- let self = this
220
- let options = {
221
- url: request.url,
222
- method: request.method,
223
- [request.method==='GET'?"params":"data"]:request.param
224
- }
225
- ajax.request(options).then(function (resp) {
226
- // todo 判断返回码
227
- self.$Message.success(response.successMsg)
228
- self.doSearch()
229
- }).catch(function (err) {
230
- console.error(err)
231
- self.$Message.error(response.errorMsg)
232
- })
233
- },
234
- /**
235
- *
236
- * @param row
237
- * @param index
238
- */
239
- onRowClick: function (row, index) {
240
- this.selectOnChange(row, index);
241
- },
242
- //单选
243
- selectOnChange: function (row, index) {
244
- this.selection = Array(index).fill(false);
245
- this.selection.splice(index, 1, true);
246
- this.selectStore = [row];
247
- },
248
- //多选
249
- onSelectionChange: function (rows) {
250
- if (!this.rowKey) {
251
- this.selectStore = rows;
252
- } else {
253
- this.selectStore = rows;
254
- if (rows && rows.length > 0) {
255
- for (let i = 0; i < rows.length; i++) {
256
- let row = rows[i];
257
- if (!this.selectTags.some(item => item.key === row[this.rowKey])) {
258
- let tagItem = {"key": row[this.rowKey], "value": row[this.rowName]}
259
- this.selectTags.push(tagItem);
260
- }
261
- }
262
- }
263
- }
264
- },
265
- onSelect: function (selection, row) {
266
- if (this.rowKey) {
267
- this.selectRows[row[this.rowKey]] = row;
268
- }
269
- },
270
- onSelectCancel: function (selection, row) {
271
- if (this.rowKey) {
272
- delete this.selectRows[row[this.rowKey]];
273
- const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === row[this.rowKey])
274
- if (selectIndex > -1) {
275
- this.selectTags.splice(selectIndex, 1);
276
- }
277
- }
278
- },
279
- onSelectAll: function (selection) {
280
- if (this.rowKey) {
281
- for (let item of selection) {
282
- this.selectRows[item[this.rowKey]] = item;
283
- }
284
- }
285
- },
286
- onSelectAllCancel: function () {
287
- if (this.rowKey) {
288
- let currentTableData = this.$refs.schemaPagingTable.$data.tableData;
289
- for (let i = 0; i < currentTableData.length; i++) {
290
- let tempData = currentTableData[i][this.rowKey];
291
- delete this.selectRows[tempData];
292
- const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === tempData)
293
- if (selectIndex > -1) {
294
- this.selectTags.splice(selectIndex, 1);
295
- }
296
- }
297
- }
298
- },
299
- transformResponse: function (resp) {
300
- if (this.rowKey) {
301
- let self = this;
302
- if (resp.code === 1 || resp.code === "000") {
303
- let tableData = resp.data.rows;
304
- for (let i = 0; i < tableData.length; i++) {
305
- if (self.selectRows[tableData[i][self.rowKey]]) {
306
- tableData[i]._checked = true;
307
- }
308
- }
309
- resp.data.rows = tableData;
310
- }
311
- }
312
- return resp;
313
- },
314
- clearSelectData: function () {
315
- this.selection = [];//清空已选项
316
- this.selectStore = [];//清空已选数据
317
- this.selectRows = [];//清空已选数据
318
- this.selectTags = [];//清空所选标签
319
- this.selectedKeys = [];//清空默认选择
320
- },
321
- tagClose: function (event, name) {
322
- const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === name)
323
- const dataIndex = (this.$refs.schemaPagingTable.$data.tableData || []).findIndex((selectItem) => selectItem[this.rowKey] === name)
324
- if (selectIndex > -1) {
325
- this.selectTags.splice(selectIndex, 1);
326
- this.selectStore.splice(selectIndex, 1);
327
- }
328
- delete this.selectRows[name];
329
- if (dataIndex > -1) {
330
- this.$refs.schemaPagingTable.$refs.tableRef.toggleSelect(dataIndex);
331
- }
332
- },
333
- getSelection(){
334
- if (this.selectRows.length > 0 && this.rowKey) {
335
- let selectStore = [];
336
- for (let item in this.selectRows) {
337
- selectStore.push(this.selectRows[item]);
338
- }
339
- this.selectStore = selectStore;
340
- }
341
- return this.selectStore
342
- }
343
- }
344
- }
345
- </script>
346
- <style lang="less" scoped>
347
- .lambo-grid-table {
348
- /deep/.ivu-form {
349
- .ivu-form-item {
350
- display: block !important;
351
- }
352
- }
353
- }
354
- .tags {
355
- margin: 10px auto;
356
- }
357
- </style>
358
-
1
+ <template>
2
+ <LamboPagingTable
3
+ ref="schemaPagingTable"
4
+ :dataUrl="dataUrl"
5
+ :columns="tableColumn"
6
+ :autoSearch="autoSearch"
7
+ :searchParams="tableSearchParams"
8
+ :transformResponse="transformResponse"
9
+ :showTableOption="showTableOption"
10
+ @on-row-click="onRowClick"
11
+ @on-selection-change="onSelectionChange"
12
+ @on-select="onSelect"
13
+ @on-select-cancel="onSelectCancel"
14
+ @on-select-all="onSelectAll"
15
+ @on-select-all-cancel="onSelectAllCancel">
16
+ <div slot="search">
17
+ <LamboSchemaForm
18
+ ref="lamboSchemaForm"
19
+ v-model="queryForm"
20
+ :form-type="'search'"
21
+ :fieldList="formFields"
22
+ :labelWidth="labelWidth"
23
+ :default-rows="2"
24
+ :grid-columns="gridColumns"
25
+ :customComponents="customComponents"
26
+ :customValidates="customValidates"
27
+ @doSearch="doSearch" @reset="onReset"/>
28
+ <div v-if="rowName" class="tags">
29
+ <Tag v-for="item in selectTags" :key="item.key" :name="item.key" closable @on-close="tagClose">
30
+ {{ item.value }}
31
+ </Tag>
32
+ </div>
33
+ </div>
34
+ <div slot="buttons" style="display: flex">
35
+ <div ref="container" :class="collapsed ? 'buttons-hidden' : ''" style="width: 100%">
36
+ <Button
37
+ ref="buttons"
38
+ v-if="dropDownButton.length > 0"
39
+ v-for="(item,index) in dropDownButton"
40
+ type="primary"
41
+ :ghost="true"
42
+ :icon="item.icon"
43
+ v-permission="item.permission"
44
+ :key="index"
45
+ @click="doClick(item)"
46
+ style="margin:0 5px 5px 0">
47
+ {{ item.name }}
48
+ </Button>
49
+ </div>
50
+ <div>
51
+ <Button v-if="totalButtons.length > buttonsInFirstRow" type="text" class="more-btn" @click=setCollapse>
52
+ {{collapsed ?'展开':'收起'}}
53
+ <Icon :type="collapsed ? 'ios-arrow-down' : 'ios-arrow-up'"></Icon>
54
+ </Button>
55
+ </div>
56
+ </div>
57
+ </LamboPagingTable>
58
+ </template>
59
+ <script>
60
+ import ajax from '@lambo-design/shared/utils/ajax'
61
+ import {operateBtn, operateHref, operateMore} from '@lambo-design/shared/utils/assist'
62
+ import LamboPagingTable from '@lambo-design/paging-table'
63
+ // import LamboSchemaForm from '@lambo-design/schema-form'
64
+ // const LamboSchemaForm = ()=> import('@lambo-design/schema-form')
65
+ export default {
66
+ name:"schema-paging-table",
67
+ components: {
68
+ LamboSchemaForm: () => import('@lambo-design/schema-form'),
69
+ LamboPagingTable,
70
+ },
71
+ data() {
72
+ return {
73
+ buttonsInFirstRow:0,
74
+ totalButtons:0,
75
+ collapsed:true,
76
+ queryForm: {},
77
+ tableSearchParams: {},
78
+ selection: [],
79
+ selectStore: [],
80
+ selectTags: [],
81
+ selectRows: [],
82
+ selectedKeys: [],
83
+ }
84
+ },
85
+ props:{
86
+ dataUrl:{
87
+ type: String,
88
+ required: true,
89
+ default: ''
90
+ },
91
+ autoSearch: {
92
+ type: Boolean,
93
+ required: false,
94
+ default: false
95
+ },
96
+ columnList:{
97
+ type: Array,
98
+ required: true,
99
+ default(){
100
+ return []
101
+ }
102
+ },
103
+ showTableOption: {
104
+ type: Boolean,
105
+ default: true
106
+ },
107
+ rowKey: {
108
+ type: String,
109
+ require: false,
110
+ default: ""
111
+ },
112
+ rowName: {
113
+ type: String,
114
+ require: false,
115
+ default: ""
116
+ },
117
+ labelWidth: {
118
+ type: Number,
119
+ require: false,
120
+ default: 100
121
+ },
122
+ operColumnDropdownNum: {
123
+ type: Number,
124
+ require: false,
125
+ default: 2
126
+ },
127
+ form:{
128
+ type: Object,
129
+ required: true,
130
+ default(){
131
+ return {}
132
+ }
133
+ },
134
+ formFields:{
135
+ type: Array,
136
+ required: true,
137
+ default(){
138
+ return []
139
+ }
140
+ },
141
+ buttonList:{
142
+ type: Array,
143
+ required: true,
144
+ default(){
145
+ return []
146
+ }
147
+ },
148
+ gridColumns:{
149
+ type: Number,
150
+ default: 4
151
+ },
152
+ customComponents: Object,
153
+ customValidates: Object,
154
+ //父组件回填已选中的值
155
+ selectedKey: {
156
+ type: Array,
157
+ require: false,
158
+ default: () => {return []}
159
+ }
160
+ },
161
+ computed: {
162
+ tableColumn: function () {
163
+ let columns = []
164
+ let self = this
165
+ self.columnList.forEach((item,index)=>{
166
+ let obj = item
167
+ if(obj.hasOwnProperty("enums") && obj.hasOwnProperty("translate") && obj.translate === 'enums'){
168
+ obj.render = function (h, param) {
169
+ let state = param.row[obj.key]
170
+ return h('span', obj.enums[state])
171
+ }
172
+ }else if(obj.hasOwnProperty("type") && obj.type === "operate"){
173
+ obj.render = (h, param) => {
174
+ let visibleDomsd = [];
175
+ let dropdownDomsd = [];
176
+ obj.button.map((item, index) => {
177
+ const conditionMet = item && typeof item.condition === "function" ? item.condition(param) : true;
178
+ if(conditionMet){
179
+ let doms = operateHref(self, h, param.row, item.name || param.row[obj.key], (vm, currentRow) => {
180
+ if (item.clickEvent?.type === "route") {
181
+ // self.$Message.info(item.clickEvent.name)
182
+ let query = item.clickEvent?.route?.keys?.reduce((acc, sourceItem) => {
183
+ return Object.assign(acc, {[sourceItem]: currentRow[sourceItem]})
184
+ }, {})
185
+ self.$router.push({
186
+ path: item.clickEvent?.route?.path,
187
+ query
188
+ })
189
+ } else if (item.clickEvent?.type === "request") {
190
+ // self.$Message.info(item.clickEvent.name)
191
+ let data = item.clickEvent?.request?.keys?.reduce((acc, sourceItem) => {
192
+ return Object.assign(acc, {[sourceItem]: currentRow[sourceItem]})
193
+ }, {})
194
+ let request = {
195
+ url: item.clickEvent.request.url,
196
+ method: item.clickEvent.request.method,
197
+ param: data,
198
+ }
199
+ let response = item.clickEvent.response
200
+ if (item.clickEvent.tips) {
201
+ let tips = item.clickEvent.tips
202
+ this.$Modal.confirm({
203
+ title: tips.title,
204
+ content: '<p>' + tips.content + '</p>',
205
+ onOk: () => {
206
+ self.fetch(request, response)
207
+ }
208
+ });
209
+ } else {
210
+ self.fetch(request, response)
211
+ }
212
+ } else if (item.clickEvent?.type === "method") {
213
+ let args = item.clickEvent?.method?.keys?.reduce((total, current) => {
214
+ return Object.assign(total, {[current]: currentRow[current]})
215
+ }, {})
216
+ self.$emit(item.clickEvent?.method?.name, args)
217
+ } else if (item.clickEvent?.type === "modal") {
218
+ self.$Message.info(item.clickEvent.name)
219
+ }
220
+ }, item.permission)
221
+ if (visibleDomsd.length < self.operColumnDropdownNum) {
222
+ visibleDomsd.push(doms);
223
+ } else {
224
+ dropdownDomsd.push(h('DropdownItem', {}, [doms]))
225
+ }
226
+ }
227
+ })
228
+ return h('div', {}, [
229
+ ...visibleDomsd,
230
+ dropdownDomsd.length !== 0 ? operateMore(self,h,dropdownDomsd) : null
231
+ ]);
232
+ }
233
+ }
234
+ columns.push(item)
235
+ })
236
+ return columns
237
+ },
238
+ // spreadButton: function () {
239
+ // return this.buttonList.slice(0,3)
240
+ // },
241
+ dropDownButton: function () {
242
+ // let list = [...this.buttonList,...this.buttonList]
243
+ // return list.splice(0,7)
244
+ return this.buttonList
245
+ },
246
+ multiSelect: function() {
247
+ return this.columnList.some((item)=>{
248
+ return item.type === "selection"
249
+ })
250
+ }
251
+ },
252
+ watch: {
253
+ form: {
254
+ handler: function (val) {
255
+ this.tableSearchParams = val
256
+ this.queryForm = val
257
+ },
258
+ deep: true
259
+ },
260
+ selectedKey: function () {
261
+ this.selectedKeys = this.selectedKey
262
+ //重置标签
263
+ this.selectTags = []
264
+ if (this.rowKey) {
265
+ for (let item of this.selectedKeys) {
266
+ this.selectRows[item[this.rowKey]] = item;
267
+ let tagItem = {"key": item[this.rowKey], "value": item[this.rowName]}
268
+ this.selectTags.push(tagItem);
269
+ }
270
+ }
271
+ }
272
+ },
273
+ created() {
274
+ let self = this
275
+ setTimeout(()=>{
276
+ self.calculateButtonsInFirstRow();
277
+ },1000)
278
+ window.addEventListener('resize', this.calculateButtonsInFirstRow);
279
+ },
280
+ beforeDestroy() {
281
+ window.removeEventListener('resize', this.calculateButtonsInFirstRow);
282
+ },
283
+ methods: {
284
+ //计算第一行有多少个button,根据父div宽度和每个button的宽度计算
285
+ calculateButtonsInFirstRow() {
286
+ let container = this.$refs.container
287
+ if (!container){return}
288
+ let containerWidth = ''
289
+ if (container.offsetWidth === undefined){
290
+ }
291
+ containerWidth = container.offsetWidth
292
+ const buttons = this.$refs.buttons;
293
+ let totalWidth = 0;
294
+ let buttonsInFirstRow = 0;
295
+ for (let i = 0; buttons && i < buttons.length; i++) {
296
+ totalWidth += buttons[i].$el.offsetWidth + 5
297
+ if (totalWidth <= containerWidth) {
298
+ buttonsInFirstRow++;
299
+ } else {
300
+ break;
301
+ }
302
+ }
303
+ this.totalButtons = this.dropDownButton
304
+ this.buttonsInFirstRow = buttonsInFirstRow;
305
+ },
306
+
307
+ setCollapse: function() {
308
+ this.collapsed = !this.collapsed
309
+ },
310
+ doClick(item){
311
+ let self = this;
312
+ if (item.clickEvent?.type === "route") {
313
+ const routeInfo = item.clickEvent.route;
314
+ const keysExist = routeInfo.keys && routeInfo.keys.length !== 0 && self.multiSelect;
315
+ const selection = keysExist ? self.getSelection() : null;
316
+ if (keysExist && selection.length !== 1) {
317
+ self.$Message.info('请只选择一条记录!');
318
+ return;
319
+ }
320
+ const query = keysExist
321
+ ? routeInfo.keys.reduce((acc, key) => ({ ...acc, [key]: selection[0][key] }), {})
322
+ : null;
323
+ this.$router.push({ path: routeInfo.path, query })
324
+ } else if (item.clickEvent?.type === "method") {
325
+ let selection = self.getSelection()
326
+ if (selection.length === 0) {
327
+ self.$Message.info('请选择一条记录!')
328
+ return
329
+ }
330
+ if (self.multiSelect) {
331
+ let param = selection.map((select, index) => {
332
+ if (item.clickEvent?.method?.keys) {
333
+ let obj = item.clickEvent?.method?.keys?.reduce((acc, sourceItem) => {
334
+ return Object.assign(acc, {[sourceItem]: select[sourceItem]})
335
+ }, {})
336
+ return obj
337
+ } else {
338
+ return item
339
+ }
340
+ })
341
+ self.$emit(item.clickEvent?.method?.name, param)
342
+ } else {
343
+ if (item.clickEvent?.method?.keys) {
344
+ let param = item.clickEvent?.method?.keys?.reduce((acc, sourceItem) => {
345
+ return Object.assign(acc, {[sourceItem]: selection[0][sourceItem]})
346
+ }, {})
347
+ self.$emit(item.clickEvent?.method?.name, param)
348
+ } else {
349
+ let param = selection[0]
350
+ self.$emit(item.clickEvent?.method?.name, param)
351
+ }
352
+ }
353
+ }
354
+ },
355
+ doSearch: function () {
356
+ this.tableSearchParams = Object.assign({}, this.queryForm)
357
+ },
358
+ onReset() {
359
+ // Object.assign(this.queryForm, this.$options.propsData.form)
360
+ this.queryForm = this.$options.propsData.form;
361
+ this.doSearch()
362
+ },
363
+ fetch: function (request,response) {
364
+ let self = this
365
+ let options = {
366
+ url: request.url,
367
+ method: request.method,
368
+ [request.method==='GET'?"params":"data"]:request.param
369
+ }
370
+ ajax.request(options).then(function (resp) {
371
+ // todo 判断返回码
372
+ self.$Message.success(response.successMsg)
373
+ self.doSearch()
374
+ }).catch(function (err) {
375
+ console.error(err)
376
+ self.$Message.error(response.errorMsg)
377
+ })
378
+ },
379
+ /**
380
+ *
381
+ * @param row
382
+ * @param index
383
+ */
384
+ onRowClick: function (row, index) {
385
+ this.selectOnChange(row, index);
386
+ },
387
+ //单选
388
+ selectOnChange: function (row, index) {
389
+ this.selection = Array(index).fill(false);
390
+ this.selection.splice(index, 1, true);
391
+ this.selectStore = [row];
392
+ },
393
+ //多选
394
+ onSelectionChange: function (rows) {
395
+ if (!this.rowKey) {
396
+ this.selectStore = rows;
397
+ } else {
398
+ this.selectStore = rows;
399
+ if (rows && rows.length > 0) {
400
+ for (let i = 0; i < rows.length; i++) {
401
+ let row = rows[i];
402
+ if (!this.selectTags.some(item => item.key === row[this.rowKey])) {
403
+ let tagItem = {"key": row[this.rowKey], "value": row[this.rowName]}
404
+ this.selectTags.push(tagItem);
405
+ }
406
+ }
407
+ }
408
+ }
409
+ },
410
+ onSelect: function (selection, row) {
411
+ if (this.rowKey) {
412
+ this.selectRows[row[this.rowKey]] = row;
413
+ }
414
+ },
415
+ onSelectCancel: function (selection, row) {
416
+ if (this.rowKey) {
417
+ delete this.selectRows[row[this.rowKey]];
418
+ const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === row[this.rowKey])
419
+ if (selectIndex > -1) {
420
+ this.selectTags.splice(selectIndex, 1);
421
+ }
422
+ }
423
+ },
424
+ onSelectAll: function (selection) {
425
+ if (this.rowKey) {
426
+ for (let item of selection) {
427
+ this.selectRows[item[this.rowKey]] = item;
428
+ }
429
+ }
430
+ },
431
+ onSelectAllCancel: function () {
432
+ if (this.rowKey) {
433
+ let currentTableData = this.$refs.schemaPagingTable.$data.tableData;
434
+ for (let i = 0; i < currentTableData.length; i++) {
435
+ let tempData = currentTableData[i][this.rowKey];
436
+ delete this.selectRows[tempData];
437
+ const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === tempData)
438
+ if (selectIndex > -1) {
439
+ this.selectTags.splice(selectIndex, 1);
440
+ }
441
+ }
442
+ }
443
+ },
444
+ transformResponse: function (resp) {
445
+ if (this.rowKey) {
446
+ let self = this;
447
+ if (resp.code === 1 || resp.code === "000") {
448
+ let tableData = resp.data.rows;
449
+ for (let i = 0; i < tableData.length; i++) {
450
+ if (self.selectRows[tableData[i][self.rowKey]]) {
451
+ tableData[i]._checked = true;
452
+ }
453
+ }
454
+ resp.data.rows = tableData;
455
+ }
456
+ }
457
+ return resp;
458
+ },
459
+ clearSelectData: function () {
460
+ this.selection = [];//清空已选项
461
+ this.selectStore = [];//清空已选数据
462
+ this.selectRows = [];//清空已选数据
463
+ this.selectTags = [];//清空所选标签
464
+ this.selectedKeys = [];//清空默认选择
465
+ },
466
+ tagClose: function (event, name) {
467
+ const selectIndex = (this.selectTags || []).findIndex((selectItem) => selectItem.key === name)
468
+ const dataIndex = (this.$refs.schemaPagingTable.$data.tableData || []).findIndex((selectItem) => selectItem[this.rowKey] === name)
469
+ if (selectIndex > -1) {
470
+ this.selectTags.splice(selectIndex, 1);
471
+ this.selectStore.splice(selectIndex, 1);
472
+ }
473
+ delete this.selectRows[name];
474
+ if (dataIndex > -1) {
475
+ this.$refs.schemaPagingTable.$refs.tableRef.toggleSelect(dataIndex);
476
+ }
477
+ },
478
+ getSelection(){
479
+ if (this.selectRows.length > 0 && this.rowKey) {
480
+ let selectStore = [];
481
+ for (let item in this.selectRows) {
482
+ selectStore.push(this.selectRows[item]);
483
+ }
484
+ this.selectStore = selectStore;
485
+ }
486
+ return this.selectStore
487
+ }
488
+ }
489
+ }
490
+ </script>
491
+ <style lang="less" scoped>
492
+ .lambo-grid-table {
493
+ /deep/.ivu-form {
494
+ .ivu-form-item {
495
+ display: block;
496
+ }
497
+ }
498
+ }
499
+ .tags {
500
+ margin: 10px auto;
501
+ }
502
+ .buttons-hidden{
503
+ height:33px;
504
+ overflow: hidden;
505
+ }
506
+ </style>
507
+