meixioacomponent 0.3.73 → 0.3.76

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": "meixioacomponent",
3
- "version": "0.3.73",
3
+ "version": "0.3.76",
4
4
  "private": false,
5
5
  "author": "YuRi",
6
6
  "main": "lib/meixioacomponent.umd.min.js",
@@ -10,13 +10,23 @@
10
10
  :close-on-click-modal="false"
11
11
  :close-on-press-escape="false"
12
12
  :append-to-body="appendToBody"
13
- :destroy-on-close="isDestroy"
13
+ :destroy-on-close="destroyOnClose"
14
14
  :visible.sync="centerDialogVisible"
15
15
  :modal-append-to-body="appendToBody"
16
16
  >
17
17
  <div class="dialog-title-wrap" slot="title" ref="dialogTitleWrap">
18
18
  <span>{{ title }}</span>
19
19
  <div class="title-handle-wrap">
20
+ <base-icon
21
+ :size="`d`"
22
+ :color="`d`"
23
+ v-if="isCache"
24
+ :event="true"
25
+ @iconClick="handleCache"
26
+ :iconClass="`element`"
27
+ :name="`el-icon-minus`"
28
+ ></base-icon>
29
+
20
30
  <base-icon
21
31
  :size="`d`"
22
32
  :color="`d`"
@@ -69,6 +79,10 @@ export default {
69
79
  })
70
80
  },
71
81
  beforeDestroy() {
82
+ const { isCache } = this.$props
83
+ if (isCache) {
84
+ this.$store.dispatch('dialogCacheStore/closeCache', this)
85
+ }
72
86
  this.$emit('destroy')
73
87
  },
74
88
  props: {
@@ -122,6 +136,11 @@ export default {
122
136
  type: Boolean,
123
137
  default: true,
124
138
  },
139
+
140
+ isCache: {
141
+ type: Boolean,
142
+ default: false,
143
+ },
125
144
  },
126
145
 
127
146
  computed: {
@@ -130,6 +149,13 @@ export default {
130
149
  height: this.$props.contentHeight,
131
150
  }
132
151
  },
152
+ destroyOnClose() {
153
+ const { isDestroy, isCache } = this.$props
154
+ if (isCache) {
155
+ return false
156
+ }
157
+ return isDestroy
158
+ },
133
159
  },
134
160
  methods: {
135
161
  init() {
@@ -169,18 +195,19 @@ export default {
169
195
  })
170
196
  },
171
197
  closeDialog() {
172
- if (this.$props.isDestroy) {
173
- this.isShow = false
174
- this.$nextTick(() => {
175
- this.$destroy()
176
- })
177
- } else {
178
- this.centerDialogVisible = false
179
- }
198
+ this.isShow = false
199
+ this.$nextTick(() => {
200
+ this.$destroy()
201
+ })
180
202
  },
181
203
  iconClick() {
182
204
  this.closeDialog()
183
205
  },
206
+
207
+ handleCache() {
208
+ this.centerDialogVisible = false
209
+ this.$store.dispatch('dialogCacheStore/pushCache', this)
210
+ },
184
211
  },
185
212
  }
186
213
  </script>
@@ -0,0 +1,93 @@
1
+ <template>
2
+ <div
3
+ tabindex="-1"
4
+ v-show="getRenderShow"
5
+ ref="dialogCacheWrapRef"
6
+ class="dialog-cache-wrap"
7
+ @blur="dialogCacheWrapOnBlue"
8
+ >
9
+ <div class="dialog-no-cache" v-if="getCacheList.length <= 0">
10
+ <baseDefaultSvg
11
+ :width="100"
12
+ :height="100"
13
+ :svgName="`404`"
14
+ :text="`暂无缓存表单`"
15
+ ></baseDefaultSvg>
16
+ </div>
17
+ <div class="dialog-cache-content" v-else>
18
+ <el-button
19
+ type="info"
20
+ :key="index"
21
+ size="medium"
22
+ icon="el-icon-tickets"
23
+ @click="openDialogCache(index)"
24
+ v-for="(item, index) in getCacheList"
25
+ >
26
+ {{ item.title }}
27
+ </el-button>
28
+ </div>
29
+ </div>
30
+ </template>
31
+
32
+ <script>
33
+ import store from '../../../src/store'
34
+ import baseDefaultSvg from '../base/baseDefaultSvg/baseDefaultSvg.vue'
35
+ export default {
36
+ data() {
37
+ return {}
38
+ },
39
+ created() {},
40
+ mounted() {},
41
+ computed: {
42
+ getCacheList() {
43
+ return store.getters['dialogCacheStore/getCacheList']
44
+ },
45
+ getRenderShow() {
46
+ return store.getters['dialogCacheStore/getRenderShow']
47
+ },
48
+ },
49
+ components: { baseDefaultSvg },
50
+ methods: {
51
+ openDialogCache(index) {
52
+ store.commit('dialogCacheStore/OPEN_DIALOG_CACHE', index)
53
+ },
54
+ dialogCacheWrapOnBlue() {
55
+ this.$store.commit('dialogCacheStore/SET_RENDER_SHOW', false)
56
+ },
57
+ },
58
+ watch: {
59
+ getRenderShow(newVal, oldVal) {
60
+ if (newVal) {
61
+ this.$nextTick(() => {
62
+ this.$refs.dialogCacheWrapRef.focus()
63
+ })
64
+ }
65
+ },
66
+ },
67
+ }
68
+ </script>
69
+
70
+ <style lang="less" scoped>
71
+ .dialog-cache-wrap {
72
+ top: 56px;
73
+ left: 0px;
74
+ z-index: 4;
75
+ width: 100vw;
76
+ height: auto;
77
+ position: fixed;
78
+ box-sizing: border-box;
79
+ background: var(--bg-white);
80
+ padding: calc(var(--padding-4) * 2);
81
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.3);
82
+ .dialog-no-cache {
83
+ width: 100%;
84
+ height: auto;
85
+ display: flex;
86
+ align-items: center;
87
+ flex-flow: row nowrap;
88
+ justify-content: center;
89
+ }
90
+ .dialog-cache-content {
91
+ }
92
+ }
93
+ </style>
@@ -6,6 +6,7 @@
6
6
  :width="width"
7
7
  :onDrag="onDrag"
8
8
  :isDestroy="true"
9
+ :isCache="isCache"
9
10
  :contentHeight="contentHeight"
10
11
  @destroy="destroyForDialog"
11
12
  >
@@ -142,6 +143,11 @@ export default {
142
143
  type: String,
143
144
  default: `right`,
144
145
  },
146
+
147
+ isCache: {
148
+ type: Boolean,
149
+ default: false,
150
+ },
145
151
  },
146
152
  components: {
147
153
  pro_formVue,
@@ -584,6 +584,16 @@ export default {
584
584
  }
585
585
  }
586
586
  }
587
+
588
+ .item-content {
589
+ /deep/ textarea {
590
+ border: 0px !important;
591
+ line-height: 1.9 !important;
592
+ &:hover {
593
+ border-color: transparent !important ;
594
+ }
595
+ }
596
+ }
587
597
  .disabled {
588
598
  cursor: not-allowed !important;
589
599
 
@@ -23,7 +23,11 @@
23
23
  {{ handleScreenText }}
24
24
  <i :class="handleScreenIcon"></i>
25
25
  </el-button>
26
- <el-button size="small" @click="handleOpenProScreen">
26
+ <el-button
27
+ size="small"
28
+ @click="handleOpenProScreen"
29
+ :disabled="proScreenConfig.length <= 0"
30
+ >
27
31
  <i class="meixicomponenticonfont meixicomponenticon-shaixuan"></i>
28
32
  高级筛选
29
33
  </el-button>
@@ -92,6 +96,7 @@ export default {
92
96
  },
93
97
  created() {
94
98
  this.initFooterHandleList()
99
+ // console.log(this.proScreenConfig)
95
100
  },
96
101
  props: {
97
102
  value: {},
@@ -20,11 +20,11 @@
20
20
  :label="item.label"
21
21
  :disabled="item.isCheck"
22
22
  >
23
- <template
24
- ><div @click="typeChange(index)">
23
+ <template>
24
+ <div @click="typeChange(index)">
25
25
  {{ item.label }}
26
- </div></template
27
- >
26
+ </div>
27
+ </template>
28
28
  </el-option>
29
29
  </el-select>
30
30
  </div>
@@ -63,8 +63,7 @@
63
63
  :key="item.value"
64
64
  :value="item.value"
65
65
  :label="item.label"
66
- >
67
- </el-option>
66
+ ></el-option>
68
67
  </el-select>
69
68
  </div>
70
69
  <div class="item-wrap-handle" v-if="!disable">
@@ -74,9 +73,9 @@
74
73
  @iconClick="deleteProscreen"
75
74
  :name="`meixicomponenticon-close`"
76
75
  ></base-icon>
77
- <el-checkbox v-model="item.exposed" :disabled="!item.key"
78
- >外露</el-checkbox
79
- >
76
+ <el-checkbox v-model="item.exposed" :disabled="!item.key">
77
+ 外露
78
+ </el-checkbox>
80
79
  </div>
81
80
  </div>
82
81
  </template>
@@ -86,13 +85,13 @@ export default {
86
85
  data() {
87
86
  return {
88
87
  privateConfigIndex: null,
89
- };
88
+ }
90
89
  },
91
90
  created() {
92
- this.privateConfigIndex = this.$props.configIndex;
91
+ this.privateConfigIndex = this.$props.configIndex
93
92
  },
94
93
  mounted() {
95
- console.log(this.config);
94
+ console.log(this.config)
96
95
  },
97
96
  props: {
98
97
  item: {},
@@ -106,51 +105,53 @@ export default {
106
105
  },
107
106
  computed: {
108
107
  screenItem() {
109
- return this.$props.item;
108
+ return this.$props.item
110
109
  },
111
110
  },
112
111
  methods: {
113
112
  typeChange(index) {
114
- if (this.$props.config[index].isCheck == true) return;
115
- this.privateConfigIndex = index;
116
- this.$props.item.key = this.$props.config[this.privateConfigIndex].key;
117
- this.trigerCheck(this.privateConfigIndex, true);
113
+ if (this.$props.config[index].isCheck == true) return
114
+ this.privateConfigIndex = index
115
+ this.$props.item.key = this.$props.config[this.privateConfigIndex].key
116
+ this.trigerCheck(this.privateConfigIndex, true)
118
117
  },
119
118
 
120
119
  deleteProscreen() {
121
- const { config } = this.$props;
120
+ const { config } = this.$props
122
121
  if (config) {
123
122
  let index = config.findIndex((configItem) => {
124
- return configItem.key == this.item.key;
125
- });
126
- config[index].isCheck = false;
123
+ return configItem.key == this.item.key
124
+ })
125
+ if (index >= 0) {
126
+ config[index].isCheck = false
127
+ }
127
128
  }
128
129
 
129
- this.$emit("deleteProscreenItem");
130
+ this.$emit('deleteProscreenItem')
130
131
  },
131
132
  trigerCheck(index, params) {
132
133
  setTimeout(() => {
133
- this.$props.config[index].isCheck = params;
134
- }, 120);
134
+ this.$props.config[index].isCheck = params
135
+ }, 120)
135
136
  },
136
137
 
137
138
  findProselectList(item) {
138
- const { config } = this.$props;
139
+ const { config } = this.$props
139
140
  let index = config.findIndex((configItem) => {
140
- return configItem.key == item.key;
141
- });
142
- return index;
141
+ return configItem.key == item.key
142
+ })
143
+ return index
143
144
  },
144
145
  },
145
146
 
146
147
  watch: {
147
148
  privateConfigIndex(newVal, oldVal) {
148
149
  if (oldVal != null) {
149
- this.trigerCheck(oldVal, false);
150
+ this.trigerCheck(oldVal, false)
150
151
  }
151
152
  },
152
153
  },
153
- };
154
+ }
154
155
  </script>
155
156
 
156
157
  <style lang="less" scoped>
@@ -538,22 +538,20 @@ export default {
538
538
  // 初始化高级筛选
539
539
  initProScreenConfig() {
540
540
  let proScreenConfig = this.$props.proScreenConfig
541
- if (proScreenConfig.length > 0) {
542
- this._proScreenConfig = proScreenConfig.map((item) => {
543
- let index = this.$props.tableConfig.findIndex((citem) => {
544
- //console.log(citem);
545
- return citem.key == item.key
546
- })
547
541
 
548
- if (index > -1) {
549
- this.$set(item, 'label', this.$props.tableConfig[index].label)
550
- this.$set(item, 'isCheck', false)
551
- return item
552
- }
542
+ this._proScreenConfig = proScreenConfig.map((item) => {
543
+ let index = this.$props.tableConfig.findIndex((citem) => {
544
+ //console.log(citem);
545
+ return citem.key == item.key
553
546
  })
554
547
 
555
- //console.log(this._proScreenConfig);
556
- }
548
+ if (index > -1) {
549
+ this.$set(item, 'label', this.$props.tableConfig[index].label)
550
+ this.$set(item, 'isCheck', false)
551
+ return item
552
+ }
553
+ })
554
+
557
555
  },
558
556
  // 打开高级筛选
559
557
  handleOpenProScreen() {
@@ -1,6 +1,8 @@
1
- import Vue from "vue";
2
- import { useElementComponent } from "./useElement";
3
- import selectStore from "./storeModule/selectStore";
1
+ import Vue from 'vue'
2
+ import { useElementComponent } from './useElement'
3
+ import selectStore from './storeModule/selectStore'
4
+ import dialogCacheStore from './storeModule/dialogCacheStore'
5
+ import dialogCacheWrap from '../components/dialogCache/index.vue'
4
6
  const componentConfig = {
5
7
  store: null,
6
8
  router: null,
@@ -9,31 +11,56 @@ const componentConfig = {
9
11
  uploadPrefix: null,
10
12
  eventBus: new Vue(),
11
13
  selectStore: null,
12
- uploadStoreList: ["meixidev"],
14
+ dialogCacheComponent: null,
15
+ uploadStoreList: ['meixidev'],
13
16
  setDynamicId: () => {
14
- componentConfig.dynamicId += 1;
17
+ componentConfig.dynamicId += 1
15
18
  },
16
19
 
17
20
  setUploadPrefix: (url) => {
18
- componentConfig.uploadPrefix = url;
21
+ componentConfig.uploadPrefix = url
19
22
  },
20
23
 
21
24
  setUploadUrl: (storeType, uploadType) => {
22
- componentConfig.uploadUrl = `${componentConfig.uploadStoreList[storeType]}/${uploadType}/upload`;
25
+ componentConfig.uploadUrl = `${componentConfig.uploadStoreList[storeType]}/${uploadType}/upload`
23
26
  },
24
27
 
25
28
  initConfig: (_store, _router) => {
26
29
  // 注册element 组件
27
- useElementComponent();
30
+ useElementComponent()
28
31
  // 动态注册vuex modules
29
- _store.registerModule("selectStore", selectStore);
32
+ _store.registerModule('selectStore', selectStore)
30
33
  // 注册vuex里面selectStore管理类
31
- _store.commit("selectStore/CREATE_SELECTSTORE");
32
- componentConfig.store = _store;
33
- componentConfig.router = _router;
34
+ _store.commit('selectStore/CREATE_SELECTSTORE')
35
+ componentConfig.store = _store
36
+ componentConfig.router = _router
34
37
  componentConfig.selectStore =
35
- componentConfig.store.getters["selectStore/getSelectStore"];
38
+ componentConfig.store.getters['selectStore/getSelectStore']
39
+
40
+ componentConfig.registerModuleOfCacheDialog(_store)
41
+ componentConfig.createDialogCacheWrap()
42
+ },
43
+
44
+ registerModuleOfCacheDialog: (_store) => {
45
+ _store.registerModule('dialogCacheStore', dialogCacheStore)
46
+ },
47
+
48
+ // 生成隐藏dialog的容器
49
+ createDialogCacheWrap: () => {
50
+ const component = Vue.extend(dialogCacheWrap)
51
+
52
+ componentConfig.dialogCacheComponent = new component({
53
+ store: componentConfig.store,
54
+ router: componentConfig.router,
55
+ })
56
+
57
+ Vue.nextTick(() => {
58
+ const cacheWrap = document.createElement('div')
59
+ cacheWrap.setAttribute('class', 'cacheWrap')
60
+ document.body.appendChild(cacheWrap)
61
+ componentConfig.dialogCacheComponent.$mount(cacheWrap)
62
+ })
36
63
  },
37
- };
64
+ }
38
65
 
39
- export default componentConfig;
66
+ export default componentConfig
@@ -0,0 +1,64 @@
1
+ const dialogCacheStore = {
2
+ namespaced: true,
3
+ state: {
4
+ cacheList: [],
5
+ renderShow: false,
6
+ },
7
+
8
+ getters: {
9
+ getCacheList(state) {
10
+ return state.cacheList
11
+ },
12
+
13
+ getRenderShow(state) {
14
+ return state.renderShow
15
+ },
16
+ },
17
+
18
+ mutations: {
19
+ PUSH_DIALOG_CACHE: (state, dialog) => {
20
+ state.cacheList.push(dialog)
21
+ },
22
+
23
+ CLOSE_DIALOG_CACHE: (state, index) => {
24
+ state.cacheList.splice(index, 1)
25
+ },
26
+
27
+ OPEN_DIALOG_CACHE: (state, index) => {
28
+ state.cacheList[index].showDialog()
29
+ },
30
+
31
+ SET_RENDER_SHOW: (state, flag) => {
32
+ state.renderShow = flag
33
+ },
34
+ },
35
+ actions: {
36
+ hasDialogCache({ commit, state }, dialog) {
37
+ return new Promise((resolve, reject) => {
38
+ resolve(
39
+ state.cacheList.findIndex((item) => {
40
+ return item == dialog
41
+ }),
42
+ )
43
+ })
44
+ },
45
+
46
+ pushCache({ commit, state, dispatch }, dialog) {
47
+ dispatch('hasDialogCache', dialog).then((res) => {
48
+ if (res <= -1) {
49
+ commit('PUSH_DIALOG_CACHE', dialog)
50
+ }
51
+ })
52
+ },
53
+
54
+ closeCache({ commit, state, dispatch }, dialog) {
55
+ dispatch('hasDialogCache', dialog).then((res) => {
56
+ if (res >= 0) {
57
+ commit('CLOSE_DIALOG_CACHE', res)
58
+ }
59
+ })
60
+ },
61
+ },
62
+ }
63
+
64
+ export default dialogCacheStore
@@ -15,7 +15,6 @@ const selectStore = {
15
15
  mutations: {
16
16
  CREATE_SELECTSTORE: (state) => {
17
17
  state.selectStore = new UseSelectStoreClass();
18
- //console.log("注册成功");
19
18
  },
20
19
  },
21
20
  actions: {},
package/src/App.vue CHANGED
@@ -2,7 +2,6 @@
2
2
  <div id="app">
3
3
  <div style="height: 100vh;">
4
4
  <test></test>
5
-
6
5
  <!-- <base-upload-item
7
6
  :fileType="`img`"
8
7
  :cropper="true"
@@ -59,7 +58,7 @@ export default {
59
58
  },
60
59
  mounted() {
61
60
  this.$nextTick(() => {
62
- this.$refs.baseUploadItem.clickFile()
61
+ // this.$refs.baseUploadItem.clickFile()
63
62
  })
64
63
  },
65
64
  methods: {
@@ -311,7 +311,7 @@ export default {
311
311
  }
312
312
  </style> -->
313
313
 
314
- <!-- <template>
314
+ <template>
315
315
  <div class="page-table-wrap" ref="pageTableWrap" v-if="show">
316
316
  <base-pro-table
317
317
  :align="`left`"
@@ -326,6 +326,7 @@ export default {
326
326
  :headerConfig="headerConfig"
327
327
  :totalPropsList="totalPropsList"
328
328
  :proScreenConfig="proScreenConfig"
329
+
329
330
  >
330
331
  <template>
331
332
  <base-icon
@@ -364,9 +365,9 @@ export default {
364
365
  <template v-slot:address="data">template-{{ data.scope }}</template>
365
366
  </base-pro-table>
366
367
  </div>
367
- </template> -->
368
+ </template>
368
369
 
369
- <!-- <script>
370
+ <script>
370
371
  import tableTable from '../test'
371
372
  import companyInfoConfig from '../config/CompanyInfoConfig'
372
373
  import componentConfig from '../../packages/config/componentConfig'
@@ -555,7 +556,7 @@ export default {
555
556
  height: 100%;
556
557
  background: inherit;
557
558
  }
558
- </style> -->
559
+ </style>
559
560
 
560
561
  <!-- 普通表单 -->
561
562
 
@@ -816,7 +817,7 @@ export default {
816
817
 
817
818
  <style></style> -->
818
819
 
819
- <template>
820
+ <!-- <template>
820
821
  <base-form-wrap
821
822
  :rowNumber="2"
822
823
  :disables="disables"
@@ -876,4 +877,4 @@ export default {
876
877
  }
877
878
  </script>
878
879
 
879
- <style lang="less" scoped></style>
880
+ <style lang="less" scoped></style> -->