resolver-egretimp-plus 0.1.69 → 0.1.71

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": "resolver-egretimp-plus",
3
- "version": "0.1.69",
3
+ "version": "0.1.71",
4
4
  "description": "交付体验渲染",
5
5
  "main": "./dist/web/index.js",
6
6
  "module": "./dist/web/index.js",
@@ -2,6 +2,7 @@
2
2
  import { computed, defineProps, inject, ref, useAttrs, watch } from 'vue'
3
3
  import { commonPropsType } from '../../utils/index.js'
4
4
 
5
+ const filterKey = ref('')
5
6
  const pickerRef = ref(null)
6
7
  const selects = inject('selects')
7
8
  const rootForm = inject('rootForm')
@@ -10,6 +11,12 @@ const lang = inject('lang')
10
11
  const modelValue = defineModel()
11
12
  const props = defineProps({
12
13
  ...commonPropsType,
14
+ filterable: {
15
+ type: String
16
+ },
17
+ multiple: {
18
+ type: String
19
+ }
13
20
  })
14
21
  const open = computed({
15
22
  get() {
@@ -36,28 +43,43 @@ const formatValue = computed({
36
43
  }
37
44
  })
38
45
 
46
+ // 是否为多选
47
+ const isMutiple = computed(() => {
48
+ return props.multiple == '1'
49
+ })
50
+ // 是否开启过滤, todo == 暂时不支持多列
51
+ const isFilter = computed(() => {
52
+ return props.filterable == '1'
53
+ })
39
54
  const calcProps = computed(() => {
40
55
  const ret = {
41
56
  type: props?.config?.displayType,
42
57
  title: lang.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
43
58
  canceltext: props?.config?.canceltext,
44
59
  confirmtext: props?.config?.confirmtext,
45
- bottomhidden: props?.config?.bottomhidden == '1',
46
60
  forbidmaskclick: props?.config?.forbidmaskclick == '1',
47
- fastpick: props?.config?.fastpick == '1',
61
+ fastpick: isFilter.value ? true : (props?.config?.fastpick == '1'),
62
+ bottomhidden: props?.config?.bottomhidden == '1',
48
63
  }
49
64
  return ret
50
65
  })
51
- const getColumns = () => {
66
+ const getColumns = (filterKey) => {
52
67
  const selectKeyArr = props.config?.selectKey?.split?.(',') || []
53
68
  return selectKeyArr.map((key, idx) => {
54
- let index = selects?.value?.[key]?.findIndex(option => option?.columnValue === formatValue.value[idx])
69
+ const values = selects?.value?.[key]?.map(option => ({
70
+ label: lang?.value?.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc,
71
+ value: option.columnValue
72
+ }))?.filter(item => {
73
+ if (filterKey) {
74
+ return item.label?.includes(filterKey)
75
+ } else {
76
+ return true
77
+ }
78
+ }) || []
79
+ let index = values.findIndex(option => option?.value === formatValue.value[idx])
55
80
  return {
56
- defaultIndex: index > -1 ? index : 0,
57
- values: selects?.value?.[key]?.map(option => ({
58
- label: lang?.value?.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc,
59
- value: option.columnValue
60
- }))
81
+ defaultIndex: index > -1 ? index : (isFilter.value ? -1 : 0),
82
+ values,
61
83
  }
62
84
  })
63
85
  }
@@ -113,12 +135,25 @@ const inputProps = computed(() => {
113
135
  }
114
136
  })
115
137
 
138
+ watch(filterKey, (val) => {
139
+ pickerRef.value?.setColumns?.(getColumns(val))
140
+ })
141
+ watch(open, (val) => {
142
+ if (!val) {
143
+ filterKey.value = ''
144
+ }
145
+ }, {
146
+ immediate: true
147
+ })
148
+ function filterChange(e) {
149
+ filterKey.value = e.detail.value
150
+ }
116
151
  </script>
117
152
 
118
153
  <template>
119
154
  <cmi-input :value="modelvalDesc" suffixIcon @focus="onFocus" v-bind="{...attrs, ...inputProps}" >
120
- <div slot="suffix" v-if="suffixIcon">
121
- <component :is="`cmi-icon-${suffixIcon}`" color="#4E5969"></component>
155
+ <div slot="suffix" v-if="suffixIcon" class="suffix-wrap">
156
+ <component @click="() => { ('arrow-down' == suffixIcon) && onFocus();}" :is="`cmi-icon-${suffixIcon}`" color="#4E5969"></component>
122
157
  </div>
123
158
  <span slot="prefix" v-if="prefixIcon">
124
159
  <component :is="`cmi-icon-${prefixIcon}`" color="#4E5969"></component>
@@ -130,5 +165,30 @@ const inputProps = computed(() => {
130
165
  :open="open"
131
166
  @close="onClose"
132
167
  @confirm="onConfirm"
133
- />
168
+ >
169
+ <div v-if="isFilter" slot="header" class="filter-header-wrap">
170
+ <span class="filte-title">{{ calcProps.title }}</span>
171
+ <cmi-input class="filter-input" @change="filterChange" :value="filterKey"></cmi-input>
172
+ </div>
173
+ </cmi-picker>
134
174
  </template>
175
+ <style lang="scss" scoped>
176
+ .suffix-wrap {
177
+ display: flex;
178
+ justify-content: center;
179
+ align-items: center;
180
+ font-size: 16px;
181
+ }
182
+ .filter-header-wrap {
183
+ display: flex;
184
+ justify-content: space-between;
185
+ align-items: center;
186
+ width: 100%;
187
+ .filte-title {
188
+ max-width: 50%;
189
+ }
190
+ .filter-input {
191
+ max-width: 50%;
192
+ }
193
+ }
194
+ </style>