vue2-client 1.12.94 → 1.12.95
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 +107 -109
- package/src/base-client/components/common/XFormTable/demo.vue +11 -3
- package/src/base-client/components/common/XTable/XTable.vue +1 -1
- package/src/base-client/components/common/XTable/XTableWrapper.vue +3 -0
- package/src/base-client/components/common/XTimeline/XTimeline.vue +23 -26
- package/src/base-client/components/his/XList/XList.vue +11 -0
- package/src/base-client/components/his/XTimeSelect/XTimeSelect.vue +99 -99
- package/src/components/STable/index.js +3 -0
- package/src/router/async/router.map.js +2 -2
package/package.json
CHANGED
|
@@ -1,109 +1,107 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "vue2-client",
|
|
3
|
-
"version": "1.12.
|
|
4
|
-
"private": false,
|
|
5
|
-
"scripts": {
|
|
6
|
-
"serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",
|
|
7
|
-
"serve:gaslink": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode gaslink",
|
|
8
|
-
"serve:revenue": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode revenue",
|
|
9
|
-
"serve:liuli": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode liuli",
|
|
10
|
-
"serve:scada": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode scada",
|
|
11
|
-
"serve:iot": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode iot",
|
|
12
|
-
"serve:his": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode his",
|
|
13
|
-
"mac-serve": "vue-cli-service serve --no-eslint --mode his",
|
|
14
|
-
"build": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
|
|
15
|
-
"test:unit": "vue-cli-service test:unit",
|
|
16
|
-
"lint": "vue-cli-service lint",
|
|
17
|
-
"build:preview": "vue-cli-service build --mode preview",
|
|
18
|
-
"lint:nofix": "vue-cli-service lint --no-fix",
|
|
19
|
-
"test": "jest"
|
|
20
|
-
},
|
|
21
|
-
"dependencies": {
|
|
22
|
-
"@afwenming123/vue-easy-tree": "^1.0.1",
|
|
23
|
-
"@afwenming123/vue-plugin-hiprint": "^0.0.70",
|
|
24
|
-
"@amap/amap-jsapi-loader": "^1.0.1",
|
|
25
|
-
"@antv/data-set": "^0.11.8",
|
|
26
|
-
"@antv/g2plot": "^2.4.31",
|
|
27
|
-
"@hufe921/canvas-editor": "^0.9.49",
|
|
28
|
-
"@microsoft/fetch-event-source": "^2.0.1",
|
|
29
|
-
"@vue/babel-preset-jsx": "^1.4.0",
|
|
30
|
-
"animate.css": "^4.1.1",
|
|
31
|
-
"ant-design-vue": "^1.7.8",
|
|
32
|
-
"axios": "^0.27.2",
|
|
33
|
-
"clipboard": "^2.0.11",
|
|
34
|
-
"core-js": "^3.33.0",
|
|
35
|
-
"crypto-js": "^4.1.1",
|
|
36
|
-
"date-fns": "^2.29.3",
|
|
37
|
-
"
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"js-
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"lodash.
|
|
50
|
-
"lodash.
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"vue": "
|
|
60
|
-
"vue-
|
|
61
|
-
"vue-
|
|
62
|
-
"vue-
|
|
63
|
-
"vue-
|
|
64
|
-
"vue-
|
|
65
|
-
"vue-
|
|
66
|
-
"
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
"@
|
|
73
|
-
"@babel/
|
|
74
|
-
"@babel/
|
|
75
|
-
"@
|
|
76
|
-
"@
|
|
77
|
-
"@vue/cli-
|
|
78
|
-
"@vue/
|
|
79
|
-
"@vue/
|
|
80
|
-
"
|
|
81
|
-
"
|
|
82
|
-
"
|
|
83
|
-
"
|
|
84
|
-
"
|
|
85
|
-
"
|
|
86
|
-
"
|
|
87
|
-
"
|
|
88
|
-
"
|
|
89
|
-
"
|
|
90
|
-
"jest": "^
|
|
91
|
-
"
|
|
92
|
-
"
|
|
93
|
-
"
|
|
94
|
-
"
|
|
95
|
-
"
|
|
96
|
-
"vue-
|
|
97
|
-
"
|
|
98
|
-
"
|
|
99
|
-
"
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
"
|
|
105
|
-
"
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
]
|
|
109
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "vue2-client",
|
|
3
|
+
"version": "1.12.95",
|
|
4
|
+
"private": false,
|
|
5
|
+
"scripts": {
|
|
6
|
+
"serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",
|
|
7
|
+
"serve:gaslink": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode gaslink",
|
|
8
|
+
"serve:revenue": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode revenue",
|
|
9
|
+
"serve:liuli": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode liuli",
|
|
10
|
+
"serve:scada": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode scada",
|
|
11
|
+
"serve:iot": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode iot",
|
|
12
|
+
"serve:his": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint --mode his",
|
|
13
|
+
"mac-serve": "vue-cli-service serve --no-eslint --mode his",
|
|
14
|
+
"build": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
|
|
15
|
+
"test:unit": "vue-cli-service test:unit",
|
|
16
|
+
"lint": "vue-cli-service lint",
|
|
17
|
+
"build:preview": "vue-cli-service build --mode preview",
|
|
18
|
+
"lint:nofix": "vue-cli-service lint --no-fix",
|
|
19
|
+
"test": "jest"
|
|
20
|
+
},
|
|
21
|
+
"dependencies": {
|
|
22
|
+
"@afwenming123/vue-easy-tree": "^1.0.1",
|
|
23
|
+
"@afwenming123/vue-plugin-hiprint": "^0.0.70",
|
|
24
|
+
"@amap/amap-jsapi-loader": "^1.0.1",
|
|
25
|
+
"@antv/data-set": "^0.11.8",
|
|
26
|
+
"@antv/g2plot": "^2.4.31",
|
|
27
|
+
"@hufe921/canvas-editor": "^0.9.49",
|
|
28
|
+
"@microsoft/fetch-event-source": "^2.0.1",
|
|
29
|
+
"@vue/babel-preset-jsx": "^1.4.0",
|
|
30
|
+
"animate.css": "^4.1.1",
|
|
31
|
+
"ant-design-vue": "^1.7.8",
|
|
32
|
+
"axios": "^0.27.2",
|
|
33
|
+
"clipboard": "^2.0.11",
|
|
34
|
+
"core-js": "^3.33.0",
|
|
35
|
+
"crypto-js": "^4.1.1",
|
|
36
|
+
"date-fns": "^2.29.3",
|
|
37
|
+
"default-passive-events": "^2.0.0",
|
|
38
|
+
"dotenv": "^16.3.1",
|
|
39
|
+
"echarts": "^5.5.0",
|
|
40
|
+
"enquire.js": "^2.1.6",
|
|
41
|
+
"file-saver": "^2.0.5",
|
|
42
|
+
"highlight.js": "^11.7.0",
|
|
43
|
+
"html2canvas": "^1.4.1",
|
|
44
|
+
"js-base64": "^3.7.5",
|
|
45
|
+
"js-cookie": "^2.2.1",
|
|
46
|
+
"jsencrypt": "^3.3.2",
|
|
47
|
+
"jspdf": "^2.5.1",
|
|
48
|
+
"lodash.clonedeep": "^4.5.0",
|
|
49
|
+
"lodash.debounce": "^4",
|
|
50
|
+
"lodash.get": "^4.4.2",
|
|
51
|
+
"marked": "^4",
|
|
52
|
+
"mockjs": "^1.1.0",
|
|
53
|
+
"nprogress": "^0.2.0",
|
|
54
|
+
"qs": "^6.11.2",
|
|
55
|
+
"regenerator-runtime": "^0.14.0",
|
|
56
|
+
"videojs-contrib-hls": "^5.15.0",
|
|
57
|
+
"viser-vue": "^2.4.8",
|
|
58
|
+
"vue": "^2.7.14",
|
|
59
|
+
"vue-codemirror": "4.0.6",
|
|
60
|
+
"vue-draggable-resizable": "^2",
|
|
61
|
+
"vue-i18n": "^8.28.2",
|
|
62
|
+
"vue-json-viewer": "^2.2.22",
|
|
63
|
+
"vue-router": "^3.6.5",
|
|
64
|
+
"vue-video-player": "^5.0.2",
|
|
65
|
+
"vue-virtual-scroller": "^1.1.2",
|
|
66
|
+
"vuedraggable": "^2.24.3",
|
|
67
|
+
"vuex": "^3.6.2",
|
|
68
|
+
"xlsx": "0.18.5"
|
|
69
|
+
},
|
|
70
|
+
"devDependencies": {
|
|
71
|
+
"@ant-design/colors": "^7.0.0",
|
|
72
|
+
"@babel/core": "^7.22.20",
|
|
73
|
+
"@babel/eslint-parser": "^7.22.15",
|
|
74
|
+
"@babel/preset-env": "^7.22.20",
|
|
75
|
+
"@vue/cli-plugin-babel": "^5.0.8",
|
|
76
|
+
"@vue/cli-plugin-eslint": "^5.0.8",
|
|
77
|
+
"@vue/cli-service": "^5.0.8",
|
|
78
|
+
"@vue/eslint-config-standard": "^8.0.1",
|
|
79
|
+
"@vue/test-utils": "^1.3.6",
|
|
80
|
+
"babel-plugin-transform-remove-console": "^6.9.4",
|
|
81
|
+
"compression-webpack-plugin": "^10.0.0",
|
|
82
|
+
"css-minimizer-webpack-plugin": "^5.0.1",
|
|
83
|
+
"deepmerge": "^4.3.1",
|
|
84
|
+
"eslint": "^8.51.0",
|
|
85
|
+
"eslint-plugin-vue": "^9.17.0",
|
|
86
|
+
"fast-deep-equal": "^3.1.3",
|
|
87
|
+
"ignore-loader": "^0.1.2",
|
|
88
|
+
"jest": "^29.7.0",
|
|
89
|
+
"jest-environment-jsdom": "^29.7.0",
|
|
90
|
+
"jest-transform-stub": "^2.0.0",
|
|
91
|
+
"less-loader": "^6.2.0",
|
|
92
|
+
"script-loader": "^0.7.2",
|
|
93
|
+
"style-resources-loader": "^1.5.0",
|
|
94
|
+
"vue-cli-plugin-style-resources-loader": "^0.1.5",
|
|
95
|
+
"vue-jest": "^4.0.1",
|
|
96
|
+
"vue-template-compiler": "^2.7.14",
|
|
97
|
+
"webpack": "^5.88.2",
|
|
98
|
+
"webpack-theme-color-replacer": "^1.4.7",
|
|
99
|
+
"whatwg-fetch": "^3.6.19"
|
|
100
|
+
},
|
|
101
|
+
"browserslist": [
|
|
102
|
+
"> 1%",
|
|
103
|
+
"last 2 versions",
|
|
104
|
+
"not dead",
|
|
105
|
+
"not ie 11"
|
|
106
|
+
]
|
|
107
|
+
}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
<a-card :bordered="false">
|
|
3
3
|
<a-button @click="()=>{queryParamsName = 'crud_device_realtime_upload_物联网流量计'}">测试1</a-button>
|
|
4
4
|
<a-button @click="()=>{queryParamsName = 'crud_device_realtime_upload_LaiDe_TiaoYaXiang'}">测试2</a-button>
|
|
5
|
+
<a-button @click="test()">测试3</a-button>
|
|
5
6
|
<x-form-table
|
|
6
7
|
title="示例表单"
|
|
7
8
|
:queryParamsName="queryParamsName"
|
|
@@ -16,6 +17,7 @@
|
|
|
16
17
|
<script>
|
|
17
18
|
import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable.vue'
|
|
18
19
|
import { microDispatch } from '@vue2-client/utils/microAppUtils'
|
|
20
|
+
|
|
19
21
|
export default {
|
|
20
22
|
name: 'Demo',
|
|
21
23
|
components: {
|
|
@@ -36,6 +38,9 @@ export default {
|
|
|
36
38
|
}
|
|
37
39
|
},
|
|
38
40
|
methods: {
|
|
41
|
+
test () {
|
|
42
|
+
this.$refs.xFormTable.setTableData([])
|
|
43
|
+
},
|
|
39
44
|
defaultF () {
|
|
40
45
|
this.$refs.xFormTable.setTableSize('default')
|
|
41
46
|
},
|
|
@@ -46,7 +51,11 @@ export default {
|
|
|
46
51
|
this.$refs.xFormTable.setTableSize('small')
|
|
47
52
|
},
|
|
48
53
|
columnClick (key, value, record) {
|
|
49
|
-
microDispatch({
|
|
54
|
+
microDispatch({
|
|
55
|
+
type: 'v3route',
|
|
56
|
+
path: '/bingliguanli/dianzibingliluru',
|
|
57
|
+
props: { selected: arguments[0].his_f_admission_id }
|
|
58
|
+
})
|
|
50
59
|
},
|
|
51
60
|
action (record, id, actionType) {
|
|
52
61
|
this.detailVisible = true
|
|
@@ -58,8 +67,7 @@ export default {
|
|
|
58
67
|
this.$refs.xFormTable.refreshTable(true)
|
|
59
68
|
}
|
|
60
69
|
},
|
|
61
|
-
computed: {
|
|
62
|
-
},
|
|
70
|
+
computed: {},
|
|
63
71
|
}
|
|
64
72
|
</script>
|
|
65
73
|
|
|
@@ -42,12 +42,11 @@
|
|
|
42
42
|
</template>
|
|
43
43
|
|
|
44
44
|
<script>
|
|
45
|
-
import
|
|
46
|
-
import 'dayjs/locale/zh-cn'
|
|
45
|
+
import moment from 'moment'
|
|
47
46
|
import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
|
|
48
47
|
|
|
49
|
-
// 设置
|
|
50
|
-
|
|
48
|
+
// 设置 moment 为中文语言环境
|
|
49
|
+
moment.locale('zh-cn')
|
|
51
50
|
|
|
52
51
|
export default {
|
|
53
52
|
name: 'XTimeline',
|
|
@@ -62,7 +61,7 @@ export default {
|
|
|
62
61
|
// 配置参数名称,用于获取时间轴配置
|
|
63
62
|
queryParamsName: {
|
|
64
63
|
type: String,
|
|
65
|
-
default: ''
|
|
64
|
+
default: 'XTimelineExampleConfig'
|
|
66
65
|
}
|
|
67
66
|
},
|
|
68
67
|
|
|
@@ -72,7 +71,7 @@ export default {
|
|
|
72
71
|
data () {
|
|
73
72
|
return {
|
|
74
73
|
currentDate: this.modelValue, // 当前选中日期
|
|
75
|
-
baseDate:
|
|
74
|
+
baseDate: moment().format('YYYY-MM-DD'), // 基准日期,默认今天,用于计算显示范围
|
|
76
75
|
config: null,
|
|
77
76
|
disabledDates: [] // 禁用日期列表
|
|
78
77
|
}
|
|
@@ -82,18 +81,15 @@ export default {
|
|
|
82
81
|
displayDates () {
|
|
83
82
|
const dates = []
|
|
84
83
|
// 计算当前日期所在周的周一
|
|
85
|
-
const currentDay =
|
|
84
|
+
const currentDay = moment(this.baseDate)
|
|
86
85
|
const dayOfWeek = currentDay.day() || 7 // 获取星期几,将周日的0转换为7
|
|
87
|
-
const mondayOfWeek = currentDay.subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
86
|
+
const mondayOfWeek = currentDay.clone().subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
88
87
|
|
|
89
88
|
// 从周一开始,生成一周的日期
|
|
90
89
|
dates.push(mondayOfWeek.format('YYYY-MM-DD')) // 周一
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
dates.push(dayjs(mondayOfWeek).add(4, 'day').format('YYYY-MM-DD')) // 周五
|
|
95
|
-
dates.push(dayjs(mondayOfWeek).add(5, 'day').format('YYYY-MM-DD')) // 周六
|
|
96
|
-
dates.push(dayjs(mondayOfWeek).add(6, 'day').format('YYYY-MM-DD')) // 周日
|
|
90
|
+
for (let i = 1; i <= 6; i++) {
|
|
91
|
+
dates.push(mondayOfWeek.clone().add(i, 'day').format('YYYY-MM-DD'))
|
|
92
|
+
}
|
|
97
93
|
|
|
98
94
|
return dates
|
|
99
95
|
}
|
|
@@ -167,28 +163,28 @@ export default {
|
|
|
167
163
|
// 格式化日期显示
|
|
168
164
|
formatDate (date) {
|
|
169
165
|
const format = this.config?.dateFormat || 'MM/DD'
|
|
170
|
-
return
|
|
166
|
+
return moment(date).format(format)
|
|
171
167
|
},
|
|
172
168
|
|
|
173
169
|
// 获取星期显示
|
|
174
170
|
getWeekDay (date) {
|
|
175
171
|
const format = this.config?.weekFormat || '周dd'
|
|
176
|
-
return
|
|
172
|
+
return moment(date).format(format)
|
|
177
173
|
},
|
|
178
174
|
|
|
179
175
|
// 判断是否为周末
|
|
180
176
|
isWeekend (date) {
|
|
181
177
|
if (!this.config?.highlightWeekend) return false
|
|
182
|
-
const day =
|
|
178
|
+
const day = moment(date).day()
|
|
183
179
|
return day === 0 || day === 6
|
|
184
180
|
},
|
|
185
181
|
|
|
186
182
|
// 判断日期是否禁用
|
|
187
183
|
isDisabled (date) {
|
|
188
|
-
if (this.config?.minDate &&
|
|
184
|
+
if (this.config?.minDate && moment(date).isBefore(this.config.minDate)) {
|
|
189
185
|
return true
|
|
190
186
|
}
|
|
191
|
-
if (this.config?.maxDate &&
|
|
187
|
+
if (this.config?.maxDate && moment(date).isAfter(this.config.maxDate)) {
|
|
192
188
|
return true
|
|
193
189
|
}
|
|
194
190
|
return this.disabledDates.includes(date)
|
|
@@ -197,7 +193,7 @@ export default {
|
|
|
197
193
|
// 判断是否为当前选中日期
|
|
198
194
|
isCurrentDate (date) {
|
|
199
195
|
if (!this.currentDate) return false
|
|
200
|
-
return
|
|
196
|
+
return moment(date).format('YYYY-MM-DD') === moment(this.currentDate).format('YYYY-MM-DD')
|
|
201
197
|
},
|
|
202
198
|
|
|
203
199
|
// 选择日期
|
|
@@ -210,7 +206,7 @@ export default {
|
|
|
210
206
|
|
|
211
207
|
// 前一天
|
|
212
208
|
goToPrevDay () {
|
|
213
|
-
const newDate =
|
|
209
|
+
const newDate = moment(this.baseDate).subtract(1, 'day')
|
|
214
210
|
if (this.config?.minDate && newDate.isBefore(this.config.minDate)) {
|
|
215
211
|
return
|
|
216
212
|
}
|
|
@@ -227,7 +223,7 @@ export default {
|
|
|
227
223
|
|
|
228
224
|
// 后一天
|
|
229
225
|
goToNextDay () {
|
|
230
|
-
const newDate =
|
|
226
|
+
const newDate = moment(this.baseDate).add(1, 'day')
|
|
231
227
|
if (this.config?.maxDate && newDate.isAfter(this.config.maxDate)) {
|
|
232
228
|
return
|
|
233
229
|
}
|
|
@@ -241,12 +237,13 @@ export default {
|
|
|
241
237
|
// 触发变更事件
|
|
242
238
|
this.$emit('change', this.currentDate)
|
|
243
239
|
},
|
|
240
|
+
|
|
244
241
|
// 前一周
|
|
245
242
|
goToPrevWeek () {
|
|
246
243
|
// 计算当前日期所在周的周一
|
|
247
|
-
const currentDay =
|
|
244
|
+
const currentDay = moment(this.baseDate)
|
|
248
245
|
const dayOfWeek = currentDay.day() || 7 // 获取星期几,将周日的0转换为7
|
|
249
|
-
const mondayOfWeek = currentDay.subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
246
|
+
const mondayOfWeek = currentDay.clone().subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
250
247
|
|
|
251
248
|
// 前一周的周一
|
|
252
249
|
const newDate = mondayOfWeek.subtract(7, 'day')
|
|
@@ -261,9 +258,9 @@ export default {
|
|
|
261
258
|
// 后一周
|
|
262
259
|
goToNextWeek () {
|
|
263
260
|
// 计算当前日期所在周的周一
|
|
264
|
-
const currentDay =
|
|
261
|
+
const currentDay = moment(this.baseDate)
|
|
265
262
|
const dayOfWeek = currentDay.day() || 7 // 获取星期几,将周日的0转换为7
|
|
266
|
-
const mondayOfWeek = currentDay.subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
263
|
+
const mondayOfWeek = currentDay.clone().subtract(dayOfWeek - 1, 'day') // 减去相应的天数得到周一
|
|
267
264
|
// 后一周的周一
|
|
268
265
|
const newDate = mondayOfWeek.add(7, 'day')
|
|
269
266
|
if (this.config?.maxDate && newDate.isAfter(this.config.maxDate)) {
|
|
@@ -63,6 +63,10 @@ export default {
|
|
|
63
63
|
return item.picture
|
|
64
64
|
? { backgroundImage: `url(${item.picture})` }
|
|
65
65
|
: {}
|
|
66
|
+
},
|
|
67
|
+
filterDataById (id) {
|
|
68
|
+
const filteredData = this.data.filter(item => item.id === id)
|
|
69
|
+
this.data = filteredData
|
|
66
70
|
}
|
|
67
71
|
}
|
|
68
72
|
}
|
|
@@ -110,6 +114,13 @@ export default {
|
|
|
110
114
|
padding: 0 8px;
|
|
111
115
|
}
|
|
112
116
|
|
|
117
|
+
/* 高亮样式 */
|
|
118
|
+
.highlight-item {
|
|
119
|
+
background-color: #e6f7ff;
|
|
120
|
+
border: 1px solid #1890ff;
|
|
121
|
+
transition: all 0.3s;
|
|
122
|
+
}
|
|
123
|
+
|
|
113
124
|
/* 自定义滚动条样式 */
|
|
114
125
|
.list-wrapper::-webkit-scrollbar {
|
|
115
126
|
width: 6px;
|
|
@@ -1,99 +1,99 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="x-time-select">
|
|
3
|
-
<a-range-picker
|
|
4
|
-
:value="dateRange"
|
|
5
|
-
:placeholder="['开始日期', '结束日期']"
|
|
6
|
-
separator="至"
|
|
7
|
-
:disabled="disabled"
|
|
8
|
-
:allowClear="allowClear"
|
|
9
|
-
:format="format"
|
|
10
|
-
@change="handleDateChange"
|
|
11
|
-
/>
|
|
12
|
-
</div>
|
|
13
|
-
</template>
|
|
14
|
-
|
|
15
|
-
<script>
|
|
16
|
-
import
|
|
17
|
-
|
|
18
|
-
export default {
|
|
19
|
-
name: 'XTimeSelect',
|
|
20
|
-
props: {
|
|
21
|
-
value: {
|
|
22
|
-
type: Array,
|
|
23
|
-
default: () => []
|
|
24
|
-
},
|
|
25
|
-
disabled: {
|
|
26
|
-
type: Boolean,
|
|
27
|
-
default: false
|
|
28
|
-
},
|
|
29
|
-
allowClear: {
|
|
30
|
-
type: Boolean,
|
|
31
|
-
default: true
|
|
32
|
-
},
|
|
33
|
-
format: {
|
|
34
|
-
type: String,
|
|
35
|
-
default: 'YYYY/MM/DD'
|
|
36
|
-
}
|
|
37
|
-
},
|
|
38
|
-
data () {
|
|
39
|
-
return {
|
|
40
|
-
dateRange: []
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
watch: {
|
|
44
|
-
value: {
|
|
45
|
-
handler (newVal) {
|
|
46
|
-
if (newVal && newVal.length === 2) {
|
|
47
|
-
this.dateRange = [
|
|
48
|
-
newVal[0] ?
|
|
49
|
-
newVal[1] ?
|
|
50
|
-
]
|
|
51
|
-
} else {
|
|
52
|
-
this.dateRange = []
|
|
53
|
-
}
|
|
54
|
-
},
|
|
55
|
-
immediate: true,
|
|
56
|
-
deep: true
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
methods: {
|
|
60
|
-
handleDateChange (dates, dateStrings) {
|
|
61
|
-
this.dateRange = dates
|
|
62
|
-
console.warn(dateStrings)
|
|
63
|
-
this.$emit('change', dateStrings)
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
</script>
|
|
68
|
-
|
|
69
|
-
<style scoped>
|
|
70
|
-
.x-time-select {
|
|
71
|
-
position: relative;
|
|
72
|
-
width: 100%;
|
|
73
|
-
box-sizing: border-box;
|
|
74
|
-
display: block;
|
|
75
|
-
}
|
|
76
|
-
.x-time-select :deep(.ant-picker-range),
|
|
77
|
-
.x-time-select :deep(.ant-picker) {
|
|
78
|
-
width: 100%;
|
|
79
|
-
height: 30px;
|
|
80
|
-
border-radius: 7px;
|
|
81
|
-
background: #FFFFFF;
|
|
82
|
-
border: 1px solid #E5E9F0;
|
|
83
|
-
}
|
|
84
|
-
.x-time-select :deep(.ant-calendar-picker) {
|
|
85
|
-
width: 100%;
|
|
86
|
-
display: block;
|
|
87
|
-
}
|
|
88
|
-
.x-time-select :deep(.ant-calendar-picker-input) {
|
|
89
|
-
width: 100%;
|
|
90
|
-
height: 30px;
|
|
91
|
-
border-radius: 7px;
|
|
92
|
-
background: #FFFFFF;
|
|
93
|
-
border: 1px solid #E5E9F0;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.x-time-select :deep(.ant-input) {
|
|
97
|
-
width: 100%;
|
|
98
|
-
}
|
|
99
|
-
</style>
|
|
1
|
+
<template>
|
|
2
|
+
<div class="x-time-select">
|
|
3
|
+
<a-range-picker
|
|
4
|
+
:value="dateRange"
|
|
5
|
+
:placeholder="['开始日期', '结束日期']"
|
|
6
|
+
separator="至"
|
|
7
|
+
:disabled="disabled"
|
|
8
|
+
:allowClear="allowClear"
|
|
9
|
+
:format="format"
|
|
10
|
+
@change="handleDateChange"
|
|
11
|
+
/>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
|
|
15
|
+
<script>
|
|
16
|
+
import moment from 'moment'
|
|
17
|
+
|
|
18
|
+
export default {
|
|
19
|
+
name: 'XTimeSelect',
|
|
20
|
+
props: {
|
|
21
|
+
value: {
|
|
22
|
+
type: Array,
|
|
23
|
+
default: () => []
|
|
24
|
+
},
|
|
25
|
+
disabled: {
|
|
26
|
+
type: Boolean,
|
|
27
|
+
default: false
|
|
28
|
+
},
|
|
29
|
+
allowClear: {
|
|
30
|
+
type: Boolean,
|
|
31
|
+
default: true
|
|
32
|
+
},
|
|
33
|
+
format: {
|
|
34
|
+
type: String,
|
|
35
|
+
default: 'YYYY/MM/DD'
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
data () {
|
|
39
|
+
return {
|
|
40
|
+
dateRange: []
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
watch: {
|
|
44
|
+
value: {
|
|
45
|
+
handler (newVal) {
|
|
46
|
+
if (newVal && newVal.length === 2) {
|
|
47
|
+
this.dateRange = [
|
|
48
|
+
newVal[0] ? moment(newVal[0]) : null,
|
|
49
|
+
newVal[1] ? moment(newVal[1]) : null
|
|
50
|
+
]
|
|
51
|
+
} else {
|
|
52
|
+
this.dateRange = []
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
immediate: true,
|
|
56
|
+
deep: true
|
|
57
|
+
}
|
|
58
|
+
},
|
|
59
|
+
methods: {
|
|
60
|
+
handleDateChange (dates, dateStrings) {
|
|
61
|
+
this.dateRange = dates
|
|
62
|
+
console.warn(dateStrings)
|
|
63
|
+
this.$emit('change', dateStrings)
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
</script>
|
|
68
|
+
|
|
69
|
+
<style scoped>
|
|
70
|
+
.x-time-select {
|
|
71
|
+
position: relative;
|
|
72
|
+
width: 100%;
|
|
73
|
+
box-sizing: border-box;
|
|
74
|
+
display: block;
|
|
75
|
+
}
|
|
76
|
+
.x-time-select :deep(.ant-picker-range),
|
|
77
|
+
.x-time-select :deep(.ant-picker) {
|
|
78
|
+
width: 100%;
|
|
79
|
+
height: 30px;
|
|
80
|
+
border-radius: 7px;
|
|
81
|
+
background: #FFFFFF;
|
|
82
|
+
border: 1px solid #E5E9F0;
|
|
83
|
+
}
|
|
84
|
+
.x-time-select :deep(.ant-calendar-picker) {
|
|
85
|
+
width: 100%;
|
|
86
|
+
display: block;
|
|
87
|
+
}
|
|
88
|
+
.x-time-select :deep(.ant-calendar-picker-input) {
|
|
89
|
+
width: 100%;
|
|
90
|
+
height: 30px;
|
|
91
|
+
border-radius: 7px;
|
|
92
|
+
background: #FFFFFF;
|
|
93
|
+
border: 1px solid #E5E9F0;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.x-time-select :deep(.ant-input) {
|
|
97
|
+
width: 100%;
|
|
98
|
+
}
|
|
99
|
+
</style>
|
|
@@ -52,10 +52,10 @@ routerResource.newDynamicStatistics = () => import('@vue2-client/pages/NewDynami
|
|
|
52
52
|
routerResource.example = {
|
|
53
53
|
path: 'example',
|
|
54
54
|
name: '示例主页面',
|
|
55
|
-
component: () => import('@vue2-client/base-client/components/his/XTimeSelect/XTimeSelect.vue'),
|
|
55
|
+
// component: () => import('@vue2-client/base-client/components/his/XTimeSelect/XTimeSelect.vue'),
|
|
56
56
|
// component: () => import('@vue2-client/base-client/components/his/XRadio/XRadio.vue'),
|
|
57
57
|
// component: () => import('@vue2-client/base-client/components/his/XList/XList.vue'),
|
|
58
|
-
|
|
58
|
+
component: () => import('@vue2-client/base-client/components/common/XCollapse/XCollapse.vue'),
|
|
59
59
|
// component: () => import('@vue2-client/base-client/components/common/XDataCard/XDataCard.vue'),
|
|
60
60
|
// component: () => import('@vue2-client/base-client/components/common/XDescriptions/demo.vue'),
|
|
61
61
|
// component: () => import('@vue2-client/base-client/components/common/XAddNativeForm/demo.vue'),
|