af-mobile-client-vue3 1.0.85 → 1.0.86

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 (17) hide show
  1. package/package.json +1 -1
  2. package/src/components/data/XCellList/XCellList.md +275 -275
  3. package/src/components/data/XFormItem/index.vue +16 -2
  4. package/src/components/data/XReportGrid/XReport.vue +973 -973
  5. package/src/components/data/XReportGrid/XReportDemo.vue +33 -33
  6. package/src/components/data/XReportGrid/XReportDesign.vue +597 -597
  7. package/src/components/data/XReportGrid/XReportDrawer/XReportDrawer.vue +148 -148
  8. package/src/components/data/XReportGrid/XReportJsonRender.vue +386 -386
  9. package/src/components/data/XReportGrid/XReportTrGroup.vue +592 -592
  10. package/src/components/data/XReportGrid/index.md +44 -44
  11. package/src/components/data/XReportGrid/print.js +184 -184
  12. package/src/layout/GridView/index.vue +16 -16
  13. package/src/views/component/XCellListView/index.vue +5 -5
  14. package/src/views/component/XFormGroupView/index.vue +2 -2
  15. package/src/views/component/XReportGridView/index.vue +18 -18
  16. package/tsconfig.json +43 -43
  17. package/src/views/component/test/index.vue +0 -52
package/src/components/data/XReportGrid/index.md CHANGED
@@ -1,44 +1,44 @@
1
- # XReport
2
-
3
- 动态报表控件，根据JSON配置生成一个完整的报表
4
-
5
-
6
- ## 何时使用
7
-
8
- 当需要一个动态生成的报表时
9
-
10
-
11
- 引用方式：
12
-
13
- ```javascript
14
- import XReport from '@vue2-client/base-client/components/XReport/XReport'
15
-
16
- export default {
17
- components: {
18
- XReport
19
- }
20
- }
21
- ```
22
-
23
- ## API
24
-
25
- | 参数 | 说明 | 类型 | 默认值 |
26
- |-----------------|------|-------|-----------|
27
- | configName | 配置文件名 | String | 无（必填） |
28
- | activatedSlotName| 激活插槽名 | String | undefined |
29
- | files | 文件列表 | Array | [] |
30
- | authority | 权限控制 | String | user |
31
- | localConfig | 本地配置 | Object | undefined |
32
- | dontFormat | 禁止已经格式化后的配置格式化| Boolean | false|
33
- | configData | 配置中的Data | Object | undefined |
34
- ## 例子1
35
- ----
36
- ```vue
37
- <XReport :config-name="'test_tableConfig'" :activated-slot-name="'test_tableConfig_slot'"/>
38
- ```
39
- ## 注意事项
40
-
41
- > 在某些情况下，比如手机端，只需要输入表格中一部分的内容。
42
- > 可以将这部分内容作为插槽，并在activatedSlotName中填写插槽名。
43
- > 则会在设计页面仅展示插槽中的输入项，并在预览窗口中，根据configName中的配置，
44
- > 渲染出来完整的表格
1
+ # XReport
2
+
3
+ 动态报表控件，根据JSON配置生成一个完整的报表
4
+
5
+
6
+ ## 何时使用
7
+
8
+ 当需要一个动态生成的报表时
9
+
10
+
11
+ 引用方式：
12
+
13
+ ```javascript
14
+ import XReport from '@vue2-client/base-client/components/XReport/XReport'
15
+
16
+ export default {
17
+ components: {
18
+ XReport
19
+ }
20
+ }
21
+ ```
22
+
23
+ ## API
24
+
25
+ | 参数 | 说明 | 类型 | 默认值 |
26
+ |-----------------|------|-------|-----------|
27
+ | configName | 配置文件名 | String | 无（必填） |
28
+ | activatedSlotName| 激活插槽名 | String | undefined |
29
+ | files | 文件列表 | Array | [] |
30
+ | authority | 权限控制 | String | user |
31
+ | localConfig | 本地配置 | Object | undefined |
32
+ | dontFormat | 禁止已经格式化后的配置格式化| Boolean | false|
33
+ | configData | 配置中的Data | Object | undefined |
34
+ ## 例子1
35
+ ----
36
+ ```vue
37
+ <XReport :config-name="'test_tableConfig'" :activated-slot-name="'test_tableConfig_slot'"/>
38
+ ```
39
+ ## 注意事项
40
+
41
+ > 在某些情况下，比如手机端，只需要输入表格中一部分的内容。
42
+ > 可以将这部分内容作为插槽，并在activatedSlotName中填写插槽名。
43
+ > 则会在设计页面仅展示插槽中的输入项，并在预览窗口中，根据configName中的配置，
44
+ > 渲染出来完整的表格
package/src/components/data/XReportGrid/print.js CHANGED
@@ -1,184 +1,184 @@
1
- // print.js
2
-
3
- export function printElement(elementToPrint) {
4
- // 创建一个新的浏览器窗口
5
- const printWindow = window.open('', '_blank', 'height=1024,width=768')
6
- // 设置新窗口的文档内容
7
- printWindow.document.write(`
8
- <html>
9
- <head>
10
- <title>Print</title>
11
- <style>
12
- @page {
13
- size: auto;
14
- margin: 0mm;
15
- }
16
- html, body {
17
- margin: 0;
18
- padding: 0;
19
- width: 100%;
20
- height: 100%;
21
- }
22
- #print-container {
23
- display: none
24
- }
25
- .img{
26
- width: 95%;
27
- height: 180px;
28
- object-fit: cover;
29
- }
30
- .reportMain {
31
- text-align: center;
32
- margin: 0 auto;
33
- font-size: 16px;
34
- color: #000;
35
- background-color: #fff;
36
- border-radius: 8px;
37
-
38
- .reportTitle {
39
- font-weight: bold;
40
- }
41
-
42
- .subTitle {
43
- display: flex;
44
- justify-content: space-between;
45
- margin-bottom: 1%;
46
-
47
- .subTitleItems {
48
- max-width: 30%;
49
- }
50
- }
51
-
52
- .inputsDiv {
53
- display: flex;
54
- justify-content: space-between;
55
- .inputsDivItem {
56
- display: flex;
57
- align-items: center;
58
- padding: 0 4px;
59
- white-space: nowrap;
60
- .inputsDivItemLabel {
61
- padding: 0 4px;
62
- }
63
- }
64
- }
65
-
66
- .reportTable {
67
- width: 100%;
68
- border-collapse: collapse;
69
- table-layout:fixed;
70
- word-break:break-all;
71
- text-align: center;
72
- }
73
- }
74
- .reportMainForDisplay {
75
- text-align: center;
76
- margin: 10% auto;
77
- font-size: 16px;
78
- color: #000;
79
- background-color: #fff;
80
- border-radius: 8px;
81
-
82
- .reportTitle {
83
- font-weight: bold;
84
- }
85
-
86
- .subTitle {
87
- display: flex;
88
- justify-content: space-between;
89
-
90
- .subTitleItems {
91
- max-width: 30%;
92
- }
93
- }
94
-
95
- .inputsDiv {
96
- display: flex;
97
- justify-content: space-around;
98
- .inputsDivItem {
99
- display: flex;
100
- align-items: center;
101
- padding: 0 4px;
102
- white-space: nowrap;
103
- .inputsDivItemLabel {
104
- padding: 0 4px;
105
- }
106
- }
107
- }
108
-
109
- .reportTable {
110
- width: 100%;
111
- border-collapse: collapse;
112
- table-layout:fixed;
113
- word-break:break-all;
114
- }
115
- }
116
- .reportMainNoPadding {
117
- text-align: center;
118
- margin: 0 auto;
119
- font-size: 16px;
120
- color: #000;
121
- background-color: #fff;
122
- border-radius: 8px;
123
-
124
- .reportTitle {
125
- font-weight: bold;
126
- }
127
-
128
- .subTitle {
129
- display: flex;
130
- justify-content: space-between;
131
-
132
- .subTitleItems {
133
- max-width: 30%;
134
- }
135
- }
136
-
137
- .inputsDiv {
138
- display: flex;
139
- justify-content: space-between;
140
- .inputsDivItem {
141
- display: flex;
142
- align-items: center;
143
- padding: 0 4px;
144
- white-space: nowrap;
145
- .inputsDivItemLabel {
146
- padding: 0 4px;
147
- }
148
- }
149
- }
150
-
151
- .reportTable {
152
- width: 100%;
153
- border-collapse: collapse;
154
- table-layout:fixed;
155
- word-break:break-all;
156
- }
157
- }
158
- .tools{
159
- position: fixed;
160
- right: 2%;
161
- text-align: right;
162
- width: 60%;
163
- cursor: pointer;
164
- .toolsItem{
165
- width: 15%;
166
- margin-right: 3%;
167
- display: inline-block;
168
- }
169
- }
170
- </style>
171
- </head>
172
- <body>
173
- <!-- 将需要打印的元素内容复制到新窗口中 -->
174
- ${elementToPrint.innerHTML}
175
- </body>
176
- </html>
177
- `)
178
- // 延迟执行打印，以确保新窗口的内容已加载完成
179
- printWindow.document.close() // 关闭文档流，确保内容完全加载
180
- setTimeout(() => {
181
- printWindow.print() // 调用打印方法
182
- printWindow.close()
183
- }, 500) // 延迟500毫秒后执行打印
184
- }
1
+ // print.js
2
+
3
+ export function printElement(elementToPrint) {
4
+ // 创建一个新的浏览器窗口
5
+ const printWindow = window.open('', '_blank', 'height=1024,width=768')
6
+ // 设置新窗口的文档内容
7
+ printWindow.document.write(`
8
+ <html>
9
+ <head>
10
+ <title>Print</title>
11
+ <style>
12
+ @page {
13
+ size: auto;
14
+ margin: 0mm;
15
+ }
16
+ html, body {
17
+ margin: 0;
18
+ padding: 0;
19
+ width: 100%;
20
+ height: 100%;
21
+ }
22
+ #print-container {
23
+ display: none
24
+ }
25
+ .img{
26
+ width: 95%;
27
+ height: 180px;
28
+ object-fit: cover;
29
+ }
30
+ .reportMain {
31
+ text-align: center;
32
+ margin: 0 auto;
33
+ font-size: 16px;
34
+ color: #000;
35
+ background-color: #fff;
36
+ border-radius: 8px;
37
+
38
+ .reportTitle {
39
+ font-weight: bold;
40
+ }
41
+
42
+ .subTitle {
43
+ display: flex;
44
+ justify-content: space-between;
45
+ margin-bottom: 1%;
46
+
47
+ .subTitleItems {
48
+ max-width: 30%;
49
+ }
50
+ }
51
+
52
+ .inputsDiv {
53
+ display: flex;
54
+ justify-content: space-between;
55
+ .inputsDivItem {
56
+ display: flex;
57
+ align-items: center;
58
+ padding: 0 4px;
59
+ white-space: nowrap;
60
+ .inputsDivItemLabel {
61
+ padding: 0 4px;
62
+ }
63
+ }
64
+ }
65
+
66
+ .reportTable {
67
+ width: 100%;
68
+ border-collapse: collapse;
69
+ table-layout:fixed;
70
+ word-break:break-all;
71
+ text-align: center;
72
+ }
73
+ }
74
+ .reportMainForDisplay {
75
+ text-align: center;
76
+ margin: 10% auto;
77
+ font-size: 16px;
78
+ color: #000;
79
+ background-color: #fff;
80
+ border-radius: 8px;
81
+
82
+ .reportTitle {
83
+ font-weight: bold;
84
+ }
85
+
86
+ .subTitle {
87
+ display: flex;
88
+ justify-content: space-between;
89
+
90
+ .subTitleItems {
91
+ max-width: 30%;
92
+ }
93
+ }
94
+
95
+ .inputsDiv {
96
+ display: flex;
97
+ justify-content: space-around;
98
+ .inputsDivItem {
99
+ display: flex;
100
+ align-items: center;
101
+ padding: 0 4px;
102
+ white-space: nowrap;
103
+ .inputsDivItemLabel {
104
+ padding: 0 4px;
105
+ }
106
+ }
107
+ }
108
+
109
+ .reportTable {
110
+ width: 100%;
111
+ border-collapse: collapse;
112
+ table-layout:fixed;
113
+ word-break:break-all;
114
+ }
115
+ }
116
+ .reportMainNoPadding {
117
+ text-align: center;
118
+ margin: 0 auto;
119
+ font-size: 16px;
120
+ color: #000;
121
+ background-color: #fff;
122
+ border-radius: 8px;
123
+
124
+ .reportTitle {
125
+ font-weight: bold;
126
+ }
127
+
128
+ .subTitle {
129
+ display: flex;
130
+ justify-content: space-between;
131
+
132
+ .subTitleItems {
133
+ max-width: 30%;
134
+ }
135
+ }
136
+
137
+ .inputsDiv {
138
+ display: flex;
139
+ justify-content: space-between;
140
+ .inputsDivItem {
141
+ display: flex;
142
+ align-items: center;
143
+ padding: 0 4px;
144
+ white-space: nowrap;
145
+ .inputsDivItemLabel {
146
+ padding: 0 4px;
147
+ }
148
+ }
149
+ }
150
+
151
+ .reportTable {
152
+ width: 100%;
153
+ border-collapse: collapse;
154
+ table-layout:fixed;
155
+ word-break:break-all;
156
+ }
157
+ }
158
+ .tools{
159
+ position: fixed;
160
+ right: 2%;
161
+ text-align: right;
162
+ width: 60%;
163
+ cursor: pointer;
164
+ .toolsItem{
165
+ width: 15%;
166
+ margin-right: 3%;
167
+ display: inline-block;
168
+ }
169
+ }
170
+ </style>
171
+ </head>
172
+ <body>
173
+ <!-- 将需要打印的元素内容复制到新窗口中 -->
174
+ ${elementToPrint.innerHTML}
175
+ </body>
176
+ </html>
177
+ `)
178
+ // 延迟执行打印，以确保新窗口的内容已加载完成
179
+ printWindow.document.close() // 关闭文档流，确保内容完全加载
180
+ setTimeout(() => {
181
+ printWindow.print() // 调用打印方法
182
+ printWindow.close()
183
+ }, 500) // 延迟500毫秒后执行打印
184
+ }
package/src/layout/GridView/index.vue CHANGED
@@ -1,16 +1,16 @@
1
- <script setup lang="ts">
2
- import { ref } from 'vue'
3
- import XReport from '@af-mobile-client-vue3/components/data/XReportGrid/XReport.vue'
4
- import { useRoute } from 'vue-router'
5
-
6
- const route = useRoute()
7
- const serverName = ref(import.meta.env.VITE_APP_SYSTEM_NAME)
8
- const configName = ref(route.query.configName ? route.query.configName as string : 'ReportGridTest')
9
- </script>
10
-
11
- <template>
12
- <XReport :config-name="configName" :server-name="serverName" />
13
- </template>
14
-
15
- <style scoped lang="less">
16
- </style>
1
+ <script setup lang="ts">
2
+ import { ref } from 'vue'
3
+ import XReport from '@af-mobile-client-vue3/components/data/XReportGrid/XReport.vue'
4
+ import { useRoute } from 'vue-router'
5
+
6
+ const route = useRoute()
7
+ const serverName = ref(import.meta.env.VITE_APP_SYSTEM_NAME)
8
+ const configName = ref(route.query.configName ? route.query.configName as string : 'ReportGridTest')
9
+ </script>
10
+
11
+ <template>
12
+ <XReport :config-name="configName" :server-name="serverName" />
13
+ </template>
14
+
15
+ <style scoped lang="less">
16
+ </style>
package/src/views/component/XCellListView/index.vue CHANGED
@@ -49,11 +49,11 @@ const serviceName = ref('af-system')
49
49
  function toDetail(item) {
50
50
  router.push({
51
51
  name: 'XFormGroupView',
52
- query: {
53
- id: item[idKey.value],
54
- // id: item.rr_id,
55
- // o_id: item.o_id,
56
- },
52
+ // query: {
53
+ // id: item[idKey.value],
54
+ // // id: item.rr_id,
55
+ // // o_id: item.o_id,
56
+ // },
57
57
  })
58
58
  }
59
59
 
package/src/views/component/XFormGroupView/index.vue CHANGED
@@ -63,8 +63,8 @@ function submit(_result) {
63
63
  <!-- v-if="isInit" -->
64
64
  <XFormGroup
65
65
  ref="formGroup"
66
- :config-name="configName"
67
- :service-name="serviceName"
66
+ config-name="lngSecurityChecktestForm"
67
+ service-name="af-safecheck"
68
68
  :group-form-data="formData"
69
69
  mode="新增"
70
70
  @submit="submit"
package/src/views/component/XReportGridView/index.vue CHANGED
@@ -1,18 +1,18 @@
1
- <script setup lang="ts">
2
- import { ref } from 'vue'
3
- import XReport from '@af-mobile-client-vue3/components/data/XReportGrid/XReport.vue'
4
- import { useRoute } from 'vue-router'
5
-
6
- const route = useRoute()
7
- const serverName = ref('af-gaslink')
8
- // const configName = ref('detailsaddChargesCover')
9
- const configName = ref(route.query.configName ? route.query.configName : 'ReportGridTest')
10
- console.log('route==configName', configName)
11
- </script>
12
-
13
- <template>
14
- <XReport :config-name="configName" :server-name="serverName" />
15
- </template>
16
-
17
- <style scoped lang="less">
18
- </style>
1
+ <script setup lang="ts">
2
+ import { ref } from 'vue'
3
+ import XReport from '@af-mobile-client-vue3/components/data/XReportGrid/XReport.vue'
4
+ import { useRoute } from 'vue-router'
5
+
6
+ const route = useRoute()
7
+ const serverName = ref('af-gaslink')
8
+ // const configName = ref('detailsaddChargesCover')
9
+ const configName = ref(route.query.configName ? route.query.configName : 'ReportGridTest')
10
+ console.log('route==configName', configName)
11
+ </script>
12
+
13
+ <template>
14
+ <XReport :config-name="configName" :server-name="serverName" />
15
+ </template>
16
+
17
+ <style scoped lang="less">
18
+ </style>
package/tsconfig.json CHANGED
@@ -1,43 +1,43 @@
1
- {
2
- "compilerOptions": {
3
- "target": "esnext",
4
- "jsx": "preserve",
5
- "lib": ["esnext", "dom", "dom.iterable", "scripthost"],
6
- "experimentalDecorators": true,
7
- "baseUrl": ".",
8
- "module": "esnext",
9
- "moduleResolution": "Bundler",
10
- "paths": {
11
- "@af-mobile-client-vue3/*": ["src/*"]
12
- },
13
- "types": [
14
- "node",
15
- "unplugin-vue-router/client",
16
- "vite-plugin-vue-layouts/client",
17
- "vite-plugin-pwa/client"
18
- ],
19
- "allowJs": true,
20
- "strictNullChecks": false,
21
- "noImplicitAny": false,
22
- "noUnusedLocals": false,
23
- "noUnusedParameters": false,
24
- "importHelpers": true,
25
- "sourceMap": true,
26
- "allowSyntheticDefaultImports": true,
27
- "esModuleInterop": true,
28
- "verbatimModuleSyntax": true,
29
- "skipLibCheck": true
30
- },
31
- "include": [
32
- "src/App.vue",
33
- "src/**/*.ts",
34
- "src/**/*.tsx",
35
- "src/**/*.vue",
36
- "tests/**/*.ts",
37
- "tests/**/*.tsx",
38
- "src/components.d.ts",
39
- "src/auto-imports.d.ts",
40
- "src/typed-router.d.ts",
41
- "tests/*.ts"
42
- ]
43
- }
1
+ {
2
+ "compilerOptions": {
3
+ "target": "esnext",
4
+ "jsx": "preserve",
5
+ "lib": ["esnext", "dom", "dom.iterable", "scripthost"],
6
+ "experimentalDecorators": true,
7
+ "baseUrl": ".",
8
+ "module": "esnext",
9
+ "moduleResolution": "Bundler",
10
+ "paths": {
11
+ "@af-mobile-client-vue3/*": ["src/*"]
12
+ },
13
+ "types": [
14
+ "node",
15
+ "unplugin-vue-router/client",
16
+ "vite-plugin-vue-layouts/client",
17
+ "vite-plugin-pwa/client"
18
+ ],
19
+ "allowJs": true,
20
+ "strictNullChecks": false,
21
+ "noImplicitAny": false,
22
+ "noUnusedLocals": false,
23
+ "noUnusedParameters": false,
24
+ "importHelpers": true,
25
+ "sourceMap": true,
26
+ "allowSyntheticDefaultImports": true,
27
+ "esModuleInterop": true,
28
+ "verbatimModuleSyntax": true,
29
+ "skipLibCheck": true
30
+ },
31
+ "include": [
32
+ "src/App.vue",
33
+ "src/**/*.ts",
34
+ "src/**/*.tsx",
35
+ "src/**/*.vue",
36
+ "tests/**/*.ts",
37
+ "tests/**/*.tsx",
38
+ "src/components.d.ts",
39
+ "src/auto-imports.d.ts",
40
+ "src/typed-router.d.ts",
41
+ "tests/*.ts"
42
+ ]
43
+ }