bri-components 1.2.54 → 1.2.55

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.
@@ -29,19 +29,18 @@
29
29
  @on-change="changeVal($event, 0)"
30
30
  @on-open-change="changeOpen($event, 0)"
31
31
  >
32
- <bri-control-input
32
+ <dsh-control-input
33
33
  :class="{
34
34
  ...commonClass,
35
35
  'bri-control-nodata': this.$isEmptyData(this.showVal0),
36
36
  'DshDaterange-item': true
37
37
  }"
38
- :canEdit="finalCanEdit"
39
38
  :value="showVal0"
40
- inputIcon="ios-calendar-outline"
39
+ :disabled="selfPropsObj._disabled"
41
40
  :propsObj="selfPropsObj"
42
41
  @clear="clickClear('', 0)"
43
42
  @click.native="changeOpen(true, 0)"
44
- ></bri-control-input>
43
+ ></dsh-control-input>
45
44
  </DatePicker>
46
45
 
47
46
  <span class="DshDaterange-center"> — </span>
@@ -59,19 +58,18 @@
59
58
  @on-change="changeVal($event, 1)"
60
59
  @on-open-change="changeOpen($event, 1)"
61
60
  >
62
- <bri-control-input
61
+ <dsh-control-input
63
62
  :class="{
64
63
  ...commonClass,
65
64
  'bri-control-nodata': this.$isEmptyData(this.showVal1),
66
65
  'DshDaterange-item': true
67
66
  }"
68
- :canEdit="finalCanEdit"
69
67
  :value="showVal1"
70
- inputIcon="ios-calendar-outline"
68
+ :disabled="selfPropsObj._disabled"
71
69
  :propsObj="selfPropsObj"
72
70
  @clear="clickClear('', 1)"
73
71
  @click.native="changeOpen(true, 1)"
74
- ></bri-control-input>
72
+ ></dsh-control-input>
75
73
  </DatePicker>
76
74
  </template>
77
75
  </div>
@@ -212,12 +210,11 @@
212
210
  computed: {
213
211
  selfPropsObj () {
214
212
  return {
213
+ _icon: "ios-calendar-outline",
215
214
  _useShortcuts: true,
216
215
 
217
216
  ...this.propsObj,
218
- ...this.commonDealPropsObj,
219
-
220
- _type: "date"
217
+ ...this.commonDealPropsObj
221
218
  };
222
219
  },
223
220
  subType () {
@@ -310,7 +307,13 @@
310
307
  return val
311
308
  ? this.isDynDateKey(val)
312
309
  ? true
313
- : !this.$isComparedAccord(this.selfPropsObj, this.selfPropsObj, date, val, config).bool
310
+ : !this.$isComparedAccord({
311
+ ...this.selfPropsObj,
312
+ _type: "date"
313
+ }, {
314
+ ...this.selfPropsObj,
315
+ _type: "date"
316
+ }, date, val, config).bool
314
317
  : false;
315
318
  }
316
319
  };
@@ -12,18 +12,15 @@
12
12
  @on-clickoutside="clickInput"
13
13
  >
14
14
  <!-- 可编辑 -->
15
- <bri-control-input
16
- :class="{
17
- ...commonClass
18
- }"
19
- :canEdit="finalCanEdit"
15
+ <dsh-control-input
16
+ :class="commonClass"
20
17
  :value="curValList"
21
- :inputIcon="inputIcon"
18
+ :disabled="selfPropsObj._disabled"
22
19
  :propsObj="selfPropsObj"
23
20
  @deleteItem="clickDeleteItem"
24
21
  @clear="clickClear"
25
22
  @click.native="clickInput"
26
- ></bri-control-input>
23
+ ></dsh-control-input>
27
24
 
28
25
  <template #list>
29
26
  <DropdownMenu class="BriLabels-dropdown-menu">
@@ -137,6 +134,7 @@
137
134
  computed: {
138
135
  selfPropsObj () {
139
136
  return {
137
+ _icon: this.isVisible ? "ios-arrow-up" : "ios-arrow-down",
140
138
  _labelType: "entity",
141
139
  _onlySelect: false,
142
140
  _originLabels: [],
@@ -154,9 +152,6 @@
154
152
  originLabels () {
155
153
  return this.selfPropsObj._originLabels;
156
154
  },
157
- inputIcon () {
158
- return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
159
- },
160
155
 
161
156
  showVal () {
162
157
  return this.$isEmptyData(this.curValList)
@@ -39,7 +39,7 @@
39
39
  <dsh-buttons
40
40
  class="flatTable-btns"
41
41
  itemClass="flatTable-btns-item"
42
- :list="$getOperationList(['canEnlarge'])"
42
+ :list="$getOperationList(operationFieldList)"
43
43
  @click="$dispatchEvent($event)"
44
44
  ></dsh-buttons>
45
45
 
@@ -75,6 +75,14 @@
75
75
  </template>
76
76
  </template>
77
77
  </template>
78
+
79
+ <flat-table-import-modal
80
+ v-if="showBatchImportModal"
81
+ :value="showBatchImportModal"
82
+ :propsObj="propsObj"
83
+ :importParams="importParams"
84
+ @input="toggleBatchImportModal"
85
+ ></flat-table-import-modal>
78
86
  </div>
79
87
  </template>
80
88
 
@@ -82,6 +90,7 @@
82
90
  import controlMixin from "../controlMixin.js";
83
91
  import DshBtnModal from "../../small/DshBtnModal.vue";
84
92
  import BriFlatTable from "../../list/BriFlatTable.vue";
93
+ import flatTableImportModal from "./flatTableImportModal.vue";
85
94
 
86
95
  export default {
87
96
  name: "flatTable",
@@ -90,7 +99,8 @@
90
99
  ],
91
100
  components: {
92
101
  DshBtnModal,
93
- BriFlatTable
102
+ BriFlatTable,
103
+ flatTableImportModal
94
104
  },
95
105
  props: {},
96
106
  data () {
@@ -105,8 +115,26 @@
105
115
  size: "small",
106
116
  btnType: "text",
107
117
  event: "enlarge"
118
+ },
119
+ canImport: {
120
+ name: "导入",
121
+ type: "canImport",
122
+ icon: "ios-create-outline",
123
+ size: "small",
124
+ btnType: "text",
125
+ event: "clickBatchImport"
126
+ },
127
+ canExport: {
128
+ name: "导出",
129
+ type: "canExport",
130
+ icon: "md-share-alt",
131
+ size: "small",
132
+ btnType: "text",
133
+ event: "clickExport"
108
134
  }
109
- }
135
+ },
136
+
137
+ showBatchImportModal: false
110
138
  };
111
139
  },
112
140
  computed: {
@@ -119,6 +147,7 @@
119
147
  };
120
148
  },
121
149
  columns () {
150
+ console.log(this.propsObj);
122
151
  return this.propsObj._subForm;
123
152
  },
124
153
 
@@ -129,10 +158,97 @@
129
158
  showSlotClose: false,
130
159
  closable: true
131
160
  };
161
+ },
162
+
163
+ operationFieldList () {
164
+ let btnList = ["canEnlarge"];
165
+ if (this.propsObj._isExport) {
166
+ btnList.unshift("canExport");
167
+ }
168
+ if (this.propsObj._isImport) {
169
+ btnList.unshift("canImport");
170
+ }
171
+
172
+ return btnList;
173
+ },
174
+ screenKey () {
175
+ return this.propsObj.screenKey;
176
+ },
177
+ importParams () {
178
+ return {
179
+ _key: this.controlKey,
180
+ _id: this.value._id
181
+ };
132
182
  }
133
183
  },
134
184
  created () {},
135
185
  methods: {
186
+ clickBatchImport () {
187
+ this.openBatchImportModal();
188
+ },
189
+ openBatchImportModal () {
190
+ this.showBatchImportModal = true;
191
+ },
192
+ // 关闭批量导入模态框
193
+ closeBatchImportModal () {
194
+ this.showBatchImportModal = false;
195
+ },
196
+ // 切换批量导入模态框
197
+ toggleBatchImportModal (bool) {
198
+ bool ? this.openBatchImportModal() : this.closeBatchImportModal();
199
+ },
200
+ // 导出点击
201
+ clickExport (operationItem) {
202
+ operationItem.disabled = true;
203
+ this.$https({
204
+ url: {
205
+ module: "sheet",
206
+ name: "exportFlatTableExcel"
207
+ },
208
+ params: {
209
+ _key: this.controlKey,
210
+ _id: this.value._id,
211
+ screenKey: this.screenKey
212
+ },
213
+ callback: data => {
214
+ setTimeout(() => {
215
+ operationItem.disabled = false;
216
+ }, 500);
217
+ this.timer = setInterval(this.getTransitStatus(data.jobId, data.excel_url), 1000);
218
+ }
219
+ });
220
+ },
221
+ getTransitStatus (id, url) {
222
+ let that = this;
223
+ return function () {
224
+ that.getJobStatus(id, url);
225
+ };
226
+ },
227
+ getJobStatus (id, url) {
228
+ this.$https({
229
+ url: {
230
+ module: "sheet",
231
+ name: "getJobStatus"
232
+ },
233
+ params: {
234
+ jobId: id
235
+ },
236
+ callback: data => {
237
+ if (data.status === "completed") {
238
+ clearInterval(this.timer);
239
+ window.location.href = data.url;
240
+ } else if (data.status === "failed") {
241
+ clearInterval(this.timer);
242
+ // this.exportBtnLoading = false;
243
+ this.$Message.info({ content: "操作失败,请稍后再试" });
244
+ }
245
+ },
246
+ error: data => {
247
+ this.timer = null;
248
+ }
249
+ });
250
+ },
251
+
136
252
  // 校验方法 -供外部使用
137
253
  validate () {
138
254
  return this.$refs.dshFatTable.validate();
@@ -0,0 +1,279 @@
1
+ <template>
2
+ <div class="flatTableImportModal">
3
+ <dsh-modal
4
+ class="flatTableImportModal-modal"
5
+ v-model="showModal"
6
+ :mode="modalPropsObj.mode"
7
+ :propsObj="modalPropsObj"
8
+ >
9
+ <div style="padding: 20px;">
10
+ <Upload
11
+ style="margin-bottom: 20px;"
12
+ :action="window.config.apiUrl+`/app/${this.appKey}/xMod/${modKey}/member/importExcel`"
13
+ :headers="undefined"
14
+ :data="importParams"
15
+ :name="'file_stream'"
16
+ :multiple="false"
17
+ :paste="false"
18
+ :disabled="false"
19
+ type="drag"
20
+ :with-credentials="false"
21
+ accept="xlsx"
22
+ :format="format"
23
+ :show-upload-list="true"
24
+ :default-file-list="[]"
25
+ :max-size="20480"
26
+ :on-format-error="handleImportFormatError"
27
+ :before-upload="beforeUpload"
28
+ >
29
+ <Icon
30
+ type="md-cloud-upload"
31
+ size="60"
32
+ />
33
+ <p>点击或者拖拽文件到此处上传</p>
34
+ </Upload>
35
+
36
+ <div v-if="file !== null">
37
+ <div class="flatTableImportModal-file">
38
+ <span>文件名称: {{ file.name }}</span>
39
+ <Icon
40
+ class="flatTableImportModal-file-cancel"
41
+ type="ios-close"
42
+ @click="cacelUpload"
43
+ />
44
+ </div>
45
+ <Button
46
+ type="primary"
47
+ :loading="loadingStatus"
48
+ @click="handleUpload"
49
+ >
50
+ {{ loadingStatus ? '上传中' : '上传' }}
51
+ </Button>
52
+ </div>
53
+
54
+ <!-- 导入说明 -->
55
+ <div>
56
+ <p style="display: flex; padding: 5px 0px;">
57
+ <strong style="width: 75px;">新增记录:</strong>
58
+ <span style="flex: 1;">
59
+ 下载
60
+ <a @click="handleExportTemplate()">
61
+ 《{{ tempName }}模板》
62
+ </a>
63
+ ,在本地新增记录后,导入文件
64
+ </span>
65
+ </p>
66
+ <p style="display: flex; padding: 5px 0px;">
67
+ <strong style="width: 75px;">更新记录:</strong>
68
+ <span style="flex: 1;">在工作表中选择需要更新的记录导出,在本地更新记录后,导入文件</span>
69
+ </p>
70
+ </div>
71
+ </div>
72
+ </dsh-modal>
73
+ </div>
74
+ </template>
75
+
76
+ <script>
77
+ export default {
78
+ name: "flatTableImportModal",
79
+ props: {
80
+ value: {
81
+ type: Boolean,
82
+ default: false
83
+ },
84
+ propsObj: {
85
+ type: Object,
86
+ default () {
87
+ return {};
88
+ }
89
+ },
90
+ importParams: {
91
+ type: Object,
92
+ default () {
93
+ return {};
94
+ }
95
+ }
96
+ },
97
+ data () {
98
+ return {
99
+ modalPropsObj: {
100
+ mode: "middle",
101
+ title: "导入excel数据",
102
+ width: "960",
103
+ className: "vertical-center-modal",
104
+ footerHide: true
105
+ },
106
+
107
+ format: ["xlsx"],
108
+ file: null,
109
+ loadingStatus: false,
110
+ window: window,
111
+ timer1: null
112
+ };
113
+ },
114
+ computed: {
115
+ showModal: {
116
+ get () {
117
+ return this.value;
118
+ },
119
+ set (val) {
120
+ this.$emit("input", val);
121
+ }
122
+ },
123
+ tempName () {
124
+ return this.propsObj._name || "";
125
+ },
126
+ modKey () {
127
+ return this.propsObj.modKey;
128
+ },
129
+ screenKey () {
130
+ return this.propsObj.screenKey;
131
+ },
132
+ appKey () {
133
+ return this.propsObj.appKey;
134
+ }
135
+ },
136
+ created () {},
137
+ methods: {
138
+ // 接口 -下载excel模板
139
+ handleExportTemplate () {
140
+ if (this.timer) return;
141
+ this.$https({
142
+ url: {
143
+ module: "sheet",
144
+ name: "exportTemplate"
145
+ },
146
+ params: {
147
+ screenKey: this.screenKey,
148
+ ...this.importParams
149
+ },
150
+ callback: data => {
151
+ this.timer = setInterval(this.getTransitStatus(data.jobId), 1000);
152
+ }
153
+ });
154
+ },
155
+ // 上传文件before函数
156
+ beforeUpload (file) {
157
+ this.file = file;
158
+ return false;
159
+ },
160
+
161
+ cacelUpload () {
162
+ this.file = null;
163
+ },
164
+ // 监控上传文件的类型
165
+ handleImportFormatError (file) {
166
+ this.$Notice.warning({
167
+ title: "文件格式不正确!",
168
+ desc: `<span style="color: red;">${file.name}</span> 的文件格式不正确。<br/>请上传${this.format}的文件类型!`,
169
+ duration: 0
170
+ });
171
+ },
172
+ handleUpload () {
173
+ this.loadingStatus = true;
174
+ let formData = new FormData();
175
+ formData.append("file_stream", this.file);
176
+ formData.append("modKey", this.modKey);
177
+ this.importParams._key && formData.append("_key", this.importParams._key);
178
+ this.importParams._id && formData.append("_id", this.importParams._id);
179
+ this.$https({
180
+ url: {
181
+ module: "sheet",
182
+ name: "importExcel"
183
+ },
184
+ params: formData,
185
+ content: {
186
+ headers: { "Content-Type": "multipart/form-data" }
187
+ },
188
+ callback: data => {
189
+ this.timer = setInterval(this.getTransitStatus(data.jobId, "import"), 1000);
190
+ },
191
+ error: data => {
192
+ this.$Message.error("导入失败:" + data.msg);
193
+ this.file = null;
194
+ this.file = null;
195
+ this.loadingStatus = false;
196
+ }
197
+ });
198
+ },
199
+
200
+ getTransitStatus (id, type) {
201
+ let that = this;
202
+ return function () {
203
+ if (type && type === "import") {
204
+ that.getImportJobStatus(id);
205
+ } else {
206
+ that.getJobStatus(id);
207
+ }
208
+ };
209
+ },
210
+ // 状态查询
211
+ getJobStatus (id) {
212
+ this.$https({
213
+ url: {
214
+ module: "sheet",
215
+ name: "getJobStatus"
216
+ },
217
+ params: {
218
+ jobId: id
219
+ },
220
+ callback: data => {
221
+ if (data.status === "completed") {
222
+ clearInterval(this.timer);
223
+ window.location.href = data.url;
224
+ } else if (data.status === "failed") {
225
+ clearInterval(this.timer);
226
+ this.$Message.info({ content: "操作失败,请稍后再试" });
227
+ }
228
+ },
229
+ error: data => {
230
+ this.timer = null;
231
+ }
232
+ });
233
+ },
234
+ // 导入状态查询
235
+ getImportJobStatus (id) {
236
+ this.$https({
237
+ url: {
238
+ module: "sheet",
239
+ name: "getImportJobStatus"
240
+ },
241
+ params: {
242
+ jobId: id
243
+ },
244
+ callback: data => {
245
+ if (data.status === "over") {
246
+ clearInterval(this.timer);
247
+ this.$Message.success("导入成功");
248
+ this.file = null;
249
+ this.loadingStatus = false;
250
+ this.showModal = false;
251
+ this.$emit("importCb");
252
+ } else if (data.status === "check-fai" || data.status === "fai") {
253
+ clearInterval(this.timer);
254
+ this.$Message.info({ content: data.faiMsg });
255
+ this.loadingStatus = false;
256
+ }
257
+ },
258
+ error: data => {
259
+ this.timer = null;
260
+ }
261
+ });
262
+ }
263
+ }
264
+ };
265
+ </script>
266
+
267
+ <style lang="less">
268
+ .sheetBatchImportModal {
269
+ &-file {
270
+ position: relative;
271
+
272
+ &-cancel {
273
+ cursor: pointer;
274
+ float: right;
275
+ font-size: @titleSize;
276
+ }
277
+ }
278
+ }
279
+ </style>
@@ -9,18 +9,15 @@
9
9
  <div @click.stop="clickInput">
10
10
  <slot>
11
11
  <!-- 编辑 -->
12
- <bri-control-input
12
+ <dsh-control-input
13
13
  v-if="canEdit"
14
- :class="{
15
- ...commonClass
16
- }"
17
- :canEdit="finalCanEdit"
14
+ :class="commonClass"
18
15
  :value="curValList"
19
- :inputIcon="inputIcon"
16
+ :disabled="selfPropsObj._disabled"
20
17
  :propsObj="selfPropsObj"
21
18
  @deleteItem="clickDeleteItem"
22
19
  @clear="clickClear"
23
- ></bri-control-input>
20
+ ></dsh-control-input>
24
21
 
25
22
  <!-- 查看 -->
26
23
  <div
@@ -171,7 +168,7 @@
171
168
  computed: {
172
169
  selfPropsObj () {
173
170
  return {
174
- _multiple: false,
171
+ _icon: this.multipleMode ? "ios-people" : "ios-person",
175
172
  _highSearch: false,
176
173
  _changeOnSelect: true,
177
174
  _searchString: "",
@@ -189,9 +186,6 @@
189
186
  searchString () {
190
187
  return this.selfPropsObj._searchString;
191
188
  },
192
- inputIcon () {
193
- return this.multipleMode ? "ios-people" : "ios-person";
194
- },
195
189
 
196
190
  modalPropsObj () {
197
191
  return {
@@ -9,18 +9,15 @@
9
9
  <div @click="clickInput">
10
10
  <slot>
11
11
  <!-- 编辑 -->
12
- <bri-control-input
12
+ <dsh-control-input
13
13
  v-if="canEdit"
14
- :class="{
15
- ...commonClass
16
- }"
17
- :canEdit="finalCanEdit"
14
+ :class="commonClass"
18
15
  :value="curValList"
19
- :inputIcon="inputIcon"
16
+ :disabled="selfPropsObj._disabled"
20
17
  :propsObj="selfPropsObj"
21
18
  @deleteItem="clickDeleteItem"
22
19
  @clear="clickClear"
23
- ></bri-control-input>
20
+ ></dsh-control-input>
24
21
 
25
22
  <!-- 表格查看 -->
26
23
  <div
@@ -283,7 +280,7 @@
283
280
  computed: {
284
281
  selfPropsObj () {
285
282
  return {
286
- _multiple: false,
283
+ _icon: this.multipleMode ? "ios-people" : "ios-person",
287
284
  _highSearch: false,
288
285
 
289
286
  ...this.propsObj,
@@ -293,9 +290,6 @@
293
290
  highSearch () {
294
291
  return this.isOnSearch ? true : this.selfPropsObj._highSearch;
295
292
  },
296
- inputIcon () {
297
- return this.multipleMode ? "ios-people" : "ios-person";
298
- },
299
293
 
300
294
  curCheckAll () {
301
295
  return this.userList.length && this.userList.every(userItem =>
@@ -239,7 +239,7 @@
239
239
  input,
240
240
  .ivu-select-selection,
241
241
  .ivu-input-number,
242
- .BriControlInput,
242
+ .DshControlInput,
243
243
  .DshDaterange-item {
244
244
  border-radius: 0px!important;
245
245
  }
@@ -112,6 +112,18 @@
112
112
 
113
113
  <template v-else>
114
114
  {{ colItem.title }}
115
+ <Tooltip
116
+ v-if="colItem._comment"
117
+ :content="colItem._comment"
118
+ :transfer="true"
119
+ placement="top-start"
120
+ max-width="200"
121
+ >
122
+ <Icon
123
+ type="ios-help-circle-outline"
124
+ size="16"
125
+ />
126
+ </Tooltip>
115
127
  </template>
116
128
  </slot>
117
129
  </div>