vue2-client 1.12.82 → 1.12.84

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.
@@ -1,214 +1,234 @@
1
- <template>
2
- <div>
3
- <a-collapse
4
- :activeKey="activeKey"
5
- @change="handleChange"
6
- >
7
- <a-collapse-panel
8
- v-for="(panel, panelIndex) in config.showData"
9
- :key="panelIndex.toString()"
10
- :show-arrow="false"
11
- :disabled="config.collapsible"
12
- >
13
- <template #header>
14
- <div class="header-content">
15
- <span
16
- class="header-text"
17
- :style="config.titleStyle"
18
- >
19
- {{ panel.title }}
20
- </span>
21
- <!-- 当有 title2 数据时显示信息项 -->
22
- <template v-if="panel.title2 && panel.title2.length">
23
- <span
24
- v-for="(item, headerIndex) in panel.title2"
25
- :key="headerIndex"
26
- class="info-item"
27
- :style="config.title2Style"
28
- >
29
- <span>{{ item.key }}:</span>
30
- <span>{{ item.value }}</span>
31
- </span>
32
- </template>
33
- <!-- 当有 title3 数据时显示时间项 -->
34
- <span
35
- v-if="panel.title3"
36
- class="time-item"
37
- :style="config.title3Style"
38
- >
39
- {{ panel.title3 }}
40
- </span>
41
- <!-- 修改搜索框的显示条件 -->
42
- <a-input-search
43
- v-if="panel.search"
44
- v-model="searchText[panelIndex]"
45
- :placeholder="panel.searchPlace"
46
- class="search-input"
47
- @search="(value) => onSearch(value, panelIndex)"
48
- @click.stop
49
- />
50
- </div>
51
- </template>
52
- <!-- 根据类型显示不同内容 -->
53
- <template v-if="panel.type === 'picture'">
54
- <img :src="panel.configName" alt="图片" style="width: 100%; max-width: 500px;"/>
55
- </template>
56
- <template v-else-if="panel.type === 'cover'">
57
- <x-report
58
- :use-oss-for-img="false"
59
- :config-name="panel.configName"
60
- server-name="af-his"
61
- :show-img-in-cell="true"
62
- :display-only="true"
63
- :edit-mode="false"
64
- :show-save-button="false"
65
- :no-padding="true"
66
- :dont-format="true">
67
- </x-report>
68
- </template>
69
- </a-collapse-panel>
70
- </a-collapse>
71
- </div>
72
- </template>
73
-
74
- <script>
75
- import XReport from '@vue2-client/base-client/components/common/XReportGrid'
76
- import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
77
-
78
- export default {
79
- name: 'XCollapse',
80
- components: {
81
- XReport
82
- },
83
- inject: ['getConfigByName', 'getComponentByName'],
84
- data () {
85
- return {
86
- activeKey: [],
87
- config: {},
88
- configName: '',
89
- searchText: {}
90
- }
91
- },
92
- props: {
93
- // json名
94
- queryParamsName: {
95
- type: Object,
96
- default: 'openPrescriptionConfig'
97
- },
98
- parameter: {
99
- type: Object,
100
- }
101
- },
102
- created () {
103
- this.searchTexts = {} // 初始化对象
104
-
105
- this.getData(this.queryParamsName)
106
- window.addEventListener('setItem', (e) => {
107
- console.log('监听到sessionStorage的变化:', e)
108
- if (e.key === 'klcf_id') {
109
- this.newVal = sessionStorage.getItem('klcf_id')
110
- // 进行业务处理
111
- console.log('sessionStorage中的值发生了变化:', this.newVal)
112
- }
113
- })
114
- },
115
- beforeDestroy () {
116
- window.removeEventListener('setItem', this.handleStorageChange)
117
- },
118
- methods: {
119
- handleStorageChange (e) {
120
- console.log('监听到sessionStorage的变化:', e)
121
- if (e.key === 'klcf_id') {
122
- this.newVal = sessionStorage.getItem('klcf_id')
123
- // 进行业务处理
124
- console.log('sessionStorage中的值发生了变化:', this.newVal)
125
- }
126
- },
127
- async getData (config, parameter) {
128
- this.configName = config
129
- getConfigByName(config, 'af-his', res => {
130
- this.config = res
131
- console.warn(this.config)
132
- runLogic(res.mainLogic, this.parameter, 'af-his').then(result => {
133
- this.config.showData = result
134
- this.activeKey = this.config.showData.map((_, panelIndex) => panelIndex.toString())
135
- })
136
- })
137
- },
138
- refreshXCollapse () {
139
- this.getData(this.queryParamsName)
140
- },
141
- handleChange (keys) {
142
- this.activeKey = keys
143
- },
144
- onSearch (value, panelIndex) {
145
- console.log('搜索内容:', value, '面板索引:', panelIndex)
146
- },
147
- },
148
- watch: {
149
- queryParamsName: {
150
- handler (newValue) {
151
- this.getData(newValue, null)
152
- },
153
- deep: true
154
- }
155
- }
156
- }
157
- </script>
158
-
159
- <style scoped>
160
- .header-content {
161
- display: flex;
162
- align-items: center;
163
- gap: 24px;
164
- white-space: nowrap;
165
- overflow: hidden;
166
- }
167
-
168
- .header-text {
169
- margin-right: 16px;
170
- font-size: 16px;
171
- font-weight: 800;
172
- flex-shrink: 0;
173
- }
174
-
175
- .info-item {
176
- display: inline-flex;
177
- align-items: center;
178
- gap: 4px;
179
- font-size: 12px;
180
- color: #888888;
181
- flex-shrink: 0;
182
- }
183
-
184
- .time-item {
185
- margin-left: auto;
186
- text-align: right;
187
- flex-shrink: 0;
188
- }
189
-
190
- :deep(.ant-collapse-header) {
191
- position: relative;
192
- border-bottom: v-bind('config.showLine ? "1px solid #000000" : "none"');
193
- align-items: center !important;
194
- }
195
-
196
- :deep(.ant-collapse-header-text) {
197
- flex: 1;
198
- }
199
-
200
- :deep(.ant-collapse-content > .ant-collapse-content-box) {
201
- padding: 0;
202
- }
203
-
204
- :deep(.ant-card-body) {
205
- padding: 8px;
206
- }
207
- .search-input {
208
- margin-left: auto;
209
- width: 100%;
210
- }
211
- :deep(.ant-collapse-item-disabled > .ant-collapse-header) {
212
- cursor: default !important;
213
- }
214
- </style>
1
+ <template>
2
+ <div>
3
+ <a-collapse
4
+ :activeKey="activeKey"
5
+ @change="handleChange"
6
+ >
7
+ <a-collapse-panel
8
+ v-for="(panel, panelIndex) in config.showData"
9
+ :key="panelIndex.toString()"
10
+ :show-arrow="false"
11
+ :disabled="config.collapsible"
12
+ >
13
+ <template #header>
14
+ <div class="header-content">
15
+ <span
16
+ class="header-text"
17
+ :style="config.titleStyle"
18
+ >
19
+ {{ panel.title }}
20
+ </span>
21
+ <!-- 当有 title2 数据时显示信息项 -->
22
+ <template v-if="panel.title2 && panel.title2.length">
23
+ <span
24
+ v-for="(item, headerIndex) in panel.title2"
25
+ :key="headerIndex"
26
+ class="info-item"
27
+ :style="config.title2Style"
28
+ >
29
+ <!-- 根据showTitle是否显示键名 -->
30
+ <span v-if="config.showTitle">{{ item.key }}:</span>
31
+ <span>{{ item.value }}</span>
32
+ </span>
33
+ </template>
34
+ <!-- 当有 title3 数据时显示时间项 -->
35
+ <span
36
+ v-if="panel.title3"
37
+ class="time-item"
38
+ :style="config.title3Style"
39
+ >
40
+ {{ panel.title3 }}
41
+ </span>
42
+ <!-- 修改搜索框的显示条件 -->
43
+ <a-input-search
44
+ v-if="panel.search"
45
+ v-model="searchText[panelIndex]"
46
+ :placeholder="panel.searchPlace"
47
+ class="search-input"
48
+ @search="(value) => onSearch(value, panelIndex)"
49
+ @click.stop
50
+ />
51
+ </div>
52
+ </template>
53
+ <!-- 根据类型显示不同内容 -->
54
+ <template v-if="panel.type === 'picture'">
55
+ <img :src="panel.configName" alt="图片" style="width: 100%; max-width: 500px;"/>
56
+ </template>
57
+ <template v-else-if="panel.type === 'cover'">
58
+ <x-report
59
+ :use-oss-for-img="false"
60
+ :config-name="panel.configName"
61
+ server-name="af-his"
62
+ :show-img-in-cell="true"
63
+ :display-only="true"
64
+ :edit-mode="false"
65
+ :show-save-button="false"
66
+ :no-padding="true"
67
+ :dont-format="true">
68
+ </x-report>
69
+ </template>
70
+ </a-collapse-panel>
71
+ </a-collapse>
72
+ </div>
73
+ </template>
74
+
75
+ <script>
76
+ import XReport from '@vue2-client/base-client/components/common/XReportGrid'
77
+ import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
78
+
79
+ export default {
80
+ name: 'XCollapse',
81
+ components: {
82
+ XReport
83
+ },
84
+ inject: ['getConfigByName', 'getComponentByName'],
85
+ data () {
86
+ return {
87
+ activeKey: [],
88
+ config: {},
89
+ configName: '',
90
+ searchText: {}
91
+ }
92
+ },
93
+ props: {
94
+ // json名
95
+ queryParamsName: {
96
+ type: Object,
97
+ default: 'openPrescriptionConfig'
98
+ },
99
+ parameter: {
100
+ type: Object,
101
+ }
102
+ },
103
+ created () {
104
+ this.searchTexts = {} // 初始化对象
105
+
106
+ this.getData(this.queryParamsName)
107
+ window.addEventListener('setItem', (e) => {
108
+ console.log('监听到sessionStorage的变化:', e)
109
+ if (e.key === 'klcf_id') {
110
+ this.newVal = sessionStorage.getItem('klcf_id')
111
+ // 进行业务处理
112
+ console.log('sessionStorage中的值发生了变化:', this.newVal)
113
+ }
114
+ })
115
+ },
116
+ beforeDestroy () {
117
+ window.removeEventListener('setItem', this.handleStorageChange)
118
+ },
119
+ methods: {
120
+ handleStorageChange (e) {
121
+ console.log('监听到sessionStorage的变化:', e)
122
+ if (e.key === 'klcf_id') {
123
+ this.newVal = sessionStorage.getItem('klcf_id')
124
+ // 进行业务处理
125
+ console.log('sessionStorage中的值发生了变化:', this.newVal)
126
+ }
127
+ },
128
+ async getData (config, parameter) {
129
+ this.configName = config
130
+ getConfigByName(config, 'af-his', res => {
131
+ this.config = res
132
+ console.warn(this.config)
133
+ runLogic(res.mainLogic, this.parameter, 'af-his').then(result => {
134
+ this.config.showData = result
135
+ // 更具timeType更改时间类型
136
+ if (this.config.timeType && this.config.timeType === '.') {
137
+ this.config.showData.forEach(panel => {
138
+ if (panel.title3) {
139
+ panel.title3 = this.convertToCustomFormat(panel.title3)
140
+ }
141
+ })
142
+ this.$forceUpdate()
143
+ }
144
+ this.activeKey = this.config.showData.map((_, panelIndex) => panelIndex.toString())
145
+ })
146
+ })
147
+ },
148
+ refreshXCollapse () {
149
+ this.getData(this.queryParamsName)
150
+ },
151
+ convertToCustomFormat (dateString) {
152
+ // 创建一个新的 Date 对象
153
+ const date = new Date(dateString)
154
+ // 获取年、月、日
155
+ const year = date.getFullYear()
156
+ const month = date.getMonth() + 1 // 月份从0开始,所以需要加1
157
+ const day = date.getDate()
158
+ // 返回格式化后的字符串
159
+ return `${year}.${month}.${day}`
160
+ },
161
+ handleChange (keys) {
162
+ this.activeKey = keys
163
+ },
164
+ onSearch (value, panelIndex) {
165
+ console.log('搜索内容:', value, '面板索引:', panelIndex)
166
+ },
167
+ },
168
+ watch: {
169
+ queryParamsName: {
170
+ handler (newValue) {
171
+ this.getData(newValue, null)
172
+ },
173
+ deep: true
174
+ }
175
+ }
176
+ }
177
+ </script>
178
+
179
+ <style scoped>
180
+ .header-content {
181
+ display: flex;
182
+ align-items: center;
183
+ gap: 24px;
184
+ white-space: nowrap;
185
+ overflow: hidden;
186
+ }
187
+
188
+ .header-text {
189
+ margin-right: 16px;
190
+ font-size: 16px;
191
+ font-weight: 800;
192
+ flex-shrink: 0;
193
+ }
194
+
195
+ .info-item {
196
+ display: inline-flex;
197
+ align-items: center;
198
+ gap: 4px;
199
+ font-size: 12px;
200
+ color: #888888;
201
+ flex-shrink: 0;
202
+ }
203
+
204
+ .time-item {
205
+ margin-left: auto;
206
+ text-align: right;
207
+ flex-shrink: 0;
208
+ }
209
+
210
+ :deep(.ant-collapse-header) {
211
+ position: relative;
212
+ border-bottom: v-bind('config.showLine ? "1px solid #000000" : "none"');
213
+ align-items: center !important;
214
+ }
215
+
216
+ :deep(.ant-collapse-header-text) {
217
+ flex: 1;
218
+ }
219
+
220
+ :deep(.ant-collapse-content > .ant-collapse-content-box) {
221
+ padding: 0;
222
+ }
223
+
224
+ :deep(.ant-card-body) {
225
+ padding: 8px;
226
+ }
227
+ .search-input {
228
+ margin-left: auto;
229
+ width: 100%;
230
+ }
231
+ :deep(.ant-collapse-item-disabled > .ant-collapse-header) {
232
+ cursor: default !important;
233
+ }
234
+ </style>