@dhccmobile/vue3-lo-form 2.1.3 → 2.1.4
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/README.md +2 -0
- package/dist/vue3-lo-form.common.js +152 -60
- package/dist/vue3-lo-form.common.js.map +1 -1
- package/dist/vue3-lo-form.css +1 -1
- package/dist/vue3-lo-form.umd.js +152 -60
- package/dist/vue3-lo-form.umd.js.map +1 -1
- package/dist/vue3-lo-form.umd.min.js +1 -1
- package/dist/vue3-lo-form.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/src/App.vue +117 -123
- package/src/components/form/DvFormLayout.vue +79 -29
- package/src/core/FormApi.ts +40 -7
package/package.json
CHANGED
package/src/App.vue
CHANGED
|
@@ -1,138 +1,140 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="lo-
|
|
3
|
-
<
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
2
|
+
<div class="lo-container" ref="scrollView">
|
|
3
|
+
<div class="lo-content">
|
|
4
|
+
<div class="lo-title">form API测试</div>
|
|
5
|
+
<div class="lo-ins">
|
|
6
|
+
<div class="lo-api">
|
|
7
|
+
<div class="lo-api-item">
|
|
8
|
+
<div class="lo-item-title">编辑模式:</div>
|
|
9
|
+
<div class="lo-item-opts">
|
|
10
|
+
<a-switch v-model:checked="formApi.edit" checked-children="开" un-checked-children="关" />
|
|
11
|
+
</div>
|
|
11
12
|
</div>
|
|
12
13
|
</div>
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
<div class="lo-api">
|
|
15
|
+
<div class="lo-api-item">
|
|
16
|
+
<div class="lo-item-title">控件对象key值:</div>
|
|
17
|
+
<div class="lo-item-opts">
|
|
18
|
+
<a-input v-model:value="controlKey" placeholder="请输入控件key值" />
|
|
19
|
+
</div>
|
|
19
20
|
</div>
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
</a-select
|
|
29
|
-
</
|
|
21
|
+
<div class="lo-api-item">
|
|
22
|
+
<div class="lo-item-title">目标属性:</div>
|
|
23
|
+
<div class="lo-item-opts">
|
|
24
|
+
<a-select v-model:value="controlAttr" show-search :filter-option="filterOption" style="width: 150px">
|
|
25
|
+
<a-select-option :value="''">请选择</a-select-option>
|
|
26
|
+
<a-select-option v-for="(propName, i) of Object.keys(attribute)" :value="attribute[propName]" :key="i" placeholder="属性名称">
|
|
27
|
+
{{ propName }}
|
|
28
|
+
</a-select-option>
|
|
29
|
+
</a-select>
|
|
30
|
+
</div>
|
|
30
31
|
</div>
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
<div class="lo-api-item">
|
|
33
|
+
<div class="lo-item-title">设置值:</div>
|
|
34
|
+
<div class="lo-item-opts">
|
|
35
|
+
<a-input v-model:value="controlvalue" placeholder="相关值" />
|
|
36
|
+
</div>
|
|
36
37
|
</div>
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
38
|
+
<div class="lo-api-item">
|
|
39
|
+
<div class="lo-item-title">读操作:</div>
|
|
40
|
+
<div class="lo-item-opts">
|
|
41
|
+
<a-button type="primary" class="ml-5" @click="getControl()">获取控件对象</a-button>
|
|
42
|
+
<a-button type="primary" class="ml-5" @click="getControlEl()">获取控件dom对象</a-button>
|
|
43
|
+
<a-button type="primary" class="ml-5" @click="getValue()">获取值</a-button>
|
|
44
|
+
<a-button type="primary" class="ml-5" @click="getText()">获取文本</a-button>
|
|
45
|
+
<a-button type="primary" class="ml-5" @click="getOptions()">获取可选项</a-button>
|
|
46
|
+
<a-button type="primary" class="ml-5" @click="getValidate()">获取校验</a-button>
|
|
47
|
+
<a-button type="primary" class="ml-5" @click="removeValidate()">移除校验</a-button>
|
|
48
|
+
<a-button type="primary" class="ml-5" @click="getValidates()">获取校验集合</a-button>
|
|
49
|
+
<a-button type="primary" class="ml-5" @click="refreshValidate()">校验指定控件</a-button>
|
|
50
|
+
<a-button type="primary" class="ml-5" @click="validateReport()">校验表单</a-button>
|
|
51
|
+
<a-button type="primary" class="ml-5" @click="validateTips()">校验表单并弹出提示</a-button>
|
|
52
|
+
</div>
|
|
52
53
|
</div>
|
|
53
54
|
</div>
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
55
|
+
<div class="lo-api">
|
|
56
|
+
<div class="lo-api-item">
|
|
57
|
+
<div class="lo-item-title">写操作:</div>
|
|
58
|
+
<div class="lo-item-opts">
|
|
59
|
+
<a-button type="primary" class="ml-5" @click="setValue()">设置值</a-button>
|
|
60
|
+
<a-button type="primary" class="ml-5" @click="setOptions()">设置可选项</a-button>
|
|
61
|
+
<a-button type="primary" class="ml-5" @click="setAttribute()">设置常规属性</a-button>
|
|
62
|
+
<a-button type="primary" class="ml-5" @click="setValidate()">设置校验</a-button>
|
|
63
|
+
<div style="display: inline-block; margin: 0 10px 0 15px">|</div>
|
|
64
|
+
<a-button type="primary" class="ml-5" @click="setFormData()">赋值整个表单</a-button>
|
|
65
|
+
<a-button type="primary" class="ml-5" @click="setFormOldData()">赋值整个表单-新旧值对比</a-button>
|
|
66
|
+
<a-button type="primary" class="ml-5" @click="resetValue()">重置整个表单</a-button>
|
|
67
|
+
<a-button type="primary" class="ml-5" @click="refreshAndUpdateData()">刷新与更新整个表单</a-button>
|
|
68
|
+
<a-button type="primary" class="ml-5" @click="resetFormValidateState()">重置表单校验状态</a-button>
|
|
69
|
+
<div style="display: inline-block; margin: 0 10px 0 15px">|</div>
|
|
70
|
+
<a-button type="primary" class="ml-5" @click="setFieldChangeHistory()">设置变更历史</a-button>
|
|
71
|
+
<div style="display: inline-block; margin: 0 10px 0 15px">|</div>
|
|
72
|
+
<a-button type="primary" class="ml-5" @click="setAutoCompleteOptions()">设置自动完成数据</a-button>
|
|
73
|
+
<div style="display: inline-block; margin: 0 10px 0 15px">|</div>
|
|
74
|
+
<a-button type="primary" class="ml-5" @click="setControl()">api方式新增控件对象</a-button>
|
|
75
|
+
</div>
|
|
75
76
|
</div>
|
|
76
77
|
</div>
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
78
|
+
<div class="lo-api">
|
|
79
|
+
<div class="lo-api-item">
|
|
80
|
+
<div class="lo-item-title">写操作:</div>
|
|
81
|
+
<div class="lo-item-opts">
|
|
82
|
+
<a-button type="primary" class="ml-5" @click="getAttribute()">获取常规属性</a-button>
|
|
83
|
+
<a-button type="primary" class="ml-5" @click="setAttribute()">设置常规属性</a-button>
|
|
84
|
+
</div>
|
|
84
85
|
</div>
|
|
85
86
|
</div>
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
87
|
+
<div class="lo-api">
|
|
88
|
+
<div class="lo-api-item">
|
|
89
|
+
<div class="lo-item-title">自定义类型:</div>
|
|
90
|
+
<div class="lo-item-opts">
|
|
91
|
+
<a-input v-model:value="controlCustomType" placeholder="相关值" />
|
|
92
|
+
</div>
|
|
92
93
|
</div>
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
94
|
+
<div class="lo-api-item">
|
|
95
|
+
<div class="lo-item-title">操作:</div>
|
|
96
|
+
<div class="lo-item-opts">
|
|
97
|
+
<a-button type="primary" class="ml-5" @click="setFormatDisplayAndOutput()">设置自定义控件格式化显示和输出</a-button>
|
|
98
|
+
|
|
|
99
|
+
<a-button type="primary" class="ml-5" @click="submit()">提交表单显示</a-button>
|
|
100
|
+
</div>
|
|
100
101
|
</div>
|
|
101
102
|
</div>
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
<!-- <a-input-number style="flex-grow: 1" v-model="control.formControl.value" :min="1" :max="100" @change="onChange(control)" />
|
|
103
|
+
<div class="lo-input">
|
|
104
|
+
<!--styleMode="credit-rd" :formId="'773549593606574080'"-->
|
|
105
|
+
<dy-form v-if="showForm" :formId="'995416144285929472'" v-model:edit="formApi.edit" v-model:formApi="formApi" @change="onChange($event)" @click="onClick($event)" @focus="onFocus($event)" @blur="onBlur($event)" @addon-before="onAddonBeforeHandler($event)" @addon-after="onAddonAfterHandler($event)" @add-item="selectAddItem($event)">
|
|
106
|
+
<template #combinationSelector="{ control, onChange }">
|
|
107
|
+
<div class="lo-custom-control-box">
|
|
108
|
+
<a-input v-model:value="control.formControl.value" @input="onChange(control.formControl)" v-if="control && control.formControl" />
|
|
109
|
+
<!-- <a-input-number style="flex-grow: 1" v-model="control.formControl.value" :min="1" :max="100" @change="onChange(control)" />
|
|
110
110
|
<a-select style="flex-basis: 100px; max-width: 100px">
|
|
111
111
|
<a-select-option value="jack"> Jack </a-select-option>
|
|
112
112
|
<a-select-option value="lucy"> Lucy </a-select-option>
|
|
113
113
|
</a-select>-->
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
114
|
+
</div>
|
|
115
|
+
</template>
|
|
116
|
+
<!--<template v-slot:input:prefix:testx1-1>¥</template>
|
|
117
117
|
<template v-slot:input:suffix:testx1-1>RMB</template>
|
|
118
118
|
<template v-slot:input:addonBefore:testx1-1>https://</template>
|
|
119
119
|
<template v-slot:input:addonAfter:testx1-1>.cn</template>
|
|
120
120
|
<template v-slot:select:suffixIcon:testx1-1-1>哇哈哈</template>-->
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
121
|
+
<!--<template v-slot:select:suffixIcon:testx1-1-1>哇哈哈</template>-->
|
|
122
|
+
<template v-slot:select:suffixIcon:productName>
|
|
123
|
+
<div class="lo-multiple-select-suffix-icon" @click="handleMultiChoiceEmbeddedCustomization">
|
|
124
|
+
<img :src="dropDownListSvg" />
|
|
125
|
+
</div>
|
|
126
|
+
</template>
|
|
127
|
+
</dy-form>
|
|
128
|
+
</div>
|
|
129
|
+
<div class="lo-value">
|
|
130
|
+
<span class="lo-title">输出: {{ formApi.formData }}</span>
|
|
131
|
+
</div>
|
|
132
|
+
<div>
|
|
133
|
+
<pre>
|
|
134
134
|
{{ dictionaryFormatCollection.sysDictTreeDetailOptions }}
|
|
135
|
-
|
|
135
|
+
</pre
|
|
136
|
+
>
|
|
137
|
+
</div>
|
|
136
138
|
</div>
|
|
137
139
|
</div>
|
|
138
140
|
</div>
|
|
@@ -150,12 +152,9 @@ import { DROP_DOWN_LIST_SVG_XML } from "./constants/encode-assets/svg";
|
|
|
150
152
|
import { formTemplate } from "./constants/config/form-template.config";
|
|
151
153
|
import { DictionaryFormatCollection, formToolsService } from "./services/form-tools.service";
|
|
152
154
|
import { Options, Vue } from "vue-property-decorator";
|
|
153
|
-
import UserInfoForm from "@/UserInfoForm.vue";
|
|
154
|
-
|
|
155
155
|
@Options({
|
|
156
156
|
name: "vf-app",
|
|
157
157
|
components: {
|
|
158
|
-
UserInfoForm,
|
|
159
158
|
DyForm,
|
|
160
159
|
[Switch.name]: Switch,
|
|
161
160
|
[Button.name]: Button,
|
|
@@ -189,12 +188,7 @@ export default class App extends Vue {
|
|
|
189
188
|
],
|
|
190
189
|
};
|
|
191
190
|
formApi: FormApi = new FormApi({
|
|
192
|
-
edit:
|
|
193
|
-
desParams: {
|
|
194
|
-
businessId: "123", // 业务编号
|
|
195
|
-
bizType: "project", // 业务对象类型
|
|
196
|
-
formLabel: "项目管理", //表单中文
|
|
197
|
-
},
|
|
191
|
+
edit: true,
|
|
198
192
|
});
|
|
199
193
|
dictionaryFormatCollection: DictionaryFormatCollection = {
|
|
200
194
|
sysDictDetailOptions: [],
|
|
@@ -274,14 +268,14 @@ export default class App extends Vue {
|
|
|
274
268
|
this.srcDesForm = formToolsService.formatDesForm(desForm);
|
|
275
269
|
this.$formToolsService.init().then((res: FormRestfulResponse) => {
|
|
276
270
|
this.showForm = true;
|
|
277
|
-
setTimeout(() => {
|
|
278
|
-
this.formApi.setFormData({ phoneNo: "138****0000", phoneNoEnc: "13800000000", appIcon: "2021" });
|
|
279
|
-
}, 1000);
|
|
280
271
|
// this.formApi.setAttribute("testx1-1-1", Attribute.TextFold, true);
|
|
281
272
|
// this.formApi.setAttribute("testx1-1-1", Attribute.HiddenDropdown, true);
|
|
282
273
|
});
|
|
283
274
|
// this.dictLocalcConvert();
|
|
284
275
|
}
|
|
276
|
+
|
|
277
|
+
created() {}
|
|
278
|
+
|
|
285
279
|
onChange(e: any): void {
|
|
286
280
|
if (e instanceof FormControl) {
|
|
287
281
|
e.formControl = e;
|
|
@@ -173,7 +173,10 @@
|
|
|
173
173
|
</span>
|
|
174
174
|
</template>
|
|
175
175
|
<template v-if="control.code === formFieldType.Select.code">
|
|
176
|
+
<!-- 脱敏值在编辑模式下直接显示文本,不渲染下拉控件 -->
|
|
177
|
+
<span v-if="isMaskedValue(formControl.value)">{{ formControl.value }}</span>
|
|
176
178
|
<a-select
|
|
179
|
+
v-else
|
|
177
180
|
class="lo-select"
|
|
178
181
|
:dropdownClassName="controlAttr.hiddenDropdown ? 'lo-select-hide-drop-down-content' : ''"
|
|
179
182
|
:class="{
|
|
@@ -236,46 +239,58 @@
|
|
|
236
239
|
<a-switch v-model:checked="formControl.value" :checked-children="controlAttr.onOpeningText" :un-checked-children="controlAttr.whenClosedText" :disabled="controlAttr.isNotEdit" @change="onChange(control)" @click="onClick(control)" />
|
|
237
240
|
</template>
|
|
238
241
|
<template v-if="control.code === formFieldType.TimePicker.code">
|
|
239
|
-
|
|
242
|
+
<!-- 脱敏值在编辑模式下直接显示文本,不渲染时间控件 -->
|
|
243
|
+
<span v-if="isMaskedValue(formControl.value)">{{ formControl.value }}</span>
|
|
244
|
+
<a-time-picker v-else class="w-100" :get-popup-container="getPopupContainer" :locale="locale" :use12-hours="is12Hours" :placeholder="controlAttr.placeholder" :disabled="controlAttr.isNotEdit" v-model:value="formControl.value" @change="onChange(control)" @click="onClick(control)" />
|
|
240
245
|
</template>
|
|
241
246
|
<template v-if="control.code === formFieldType.DatePicker.code">
|
|
242
|
-
|
|
243
|
-
<
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
<div class="
|
|
250
|
-
<div class="
|
|
251
|
-
<div class="
|
|
247
|
+
<!-- 脱敏值在编辑模式下直接显示文本,不渲染日期控件 -->
|
|
248
|
+
<span v-if="isMaskedValue(formControl.value)">{{ formControl.value }}</span>
|
|
249
|
+
<template v-else>
|
|
250
|
+
<a-month-picker v-if="useMonthPicker" class="w-100" :get-popup-container="getPopupContainer" :locale="locale" :format="controlAttr.dateFormat" :placeholder="controlAttr.placeholder" :disabled="controlAttr.isNotEdit" v-model:value="formControl.value" @change="onChange(control)" @click="onClick(control)" />
|
|
251
|
+
<a-date-picker v-else-if="controlAttr.isShowHoliday" class="w-100" :get-popup-container="getPopupContainer" :locale="locale" :showTime="showPickerTime(controlAttr.dateFormat)" :format="controlAttr.dateFormat" :placeholder="controlAttr.placeholder" :disabled="controlAttr.isNotEdit" v-model:value="formControl.value" @change="onChange(control)" @click="onClick(control)">
|
|
252
|
+
<template #dateRender="{ current }">
|
|
253
|
+
<div class="ant-picker-cell-inner calendar-control-style">
|
|
254
|
+
<div class="date-control-style">
|
|
255
|
+
<div class="eest-day-style"></div>
|
|
256
|
+
<div class="date-style">{{ current.date() }}</div>
|
|
257
|
+
<div class="eest-day-style">
|
|
258
|
+
<div class="holidays-style" v-if="isRest(current)">休</div>
|
|
259
|
+
<div class="weekday-style" v-else-if="isWeekday(current)">班</div>
|
|
260
|
+
</div>
|
|
261
|
+
</div>
|
|
262
|
+
<div class="date-type-style">
|
|
263
|
+
<!-- 交易日 -->
|
|
264
|
+
<div class="trading-day-style" v-if="isRadingDay(current)"></div>
|
|
252
265
|
</div>
|
|
253
266
|
</div>
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
<div class="legend">
|
|
262
|
-
<div class="day-explain-style">
|
|
263
|
-
<div class="trading-day-icon"></div>
|
|
264
|
-
<div class="day-explain">交易日</div>
|
|
267
|
+
</template>
|
|
268
|
+
<template #renderExtraFooter>
|
|
269
|
+
<div class="legend">
|
|
270
|
+
<div class="day-explain-style">
|
|
271
|
+
<div class="trading-day-icon"></div>
|
|
272
|
+
<div class="day-explain">交易日</div>
|
|
273
|
+
</div>
|
|
265
274
|
</div>
|
|
266
|
-
</
|
|
267
|
-
</
|
|
268
|
-
|
|
269
|
-
|
|
275
|
+
</template>
|
|
276
|
+
</a-date-picker>
|
|
277
|
+
<a-date-picker v-else class="w-100" :get-popup-container="getPopupContainer" :locale="locale" :showTime="showPickerTime(controlAttr.dateFormat)" :format="controlAttr.dateFormat" :placeholder="controlAttr.placeholder" :disabled="controlAttr.isNotEdit" v-model:value="formControl.value" @change="onChange(control)" @click="onClick(control)" />
|
|
278
|
+
</template>
|
|
270
279
|
</template>
|
|
271
280
|
<template v-if="control.code === formFieldType.Slider.code">
|
|
272
281
|
<a-slider v-model:value="formControl.value" :disabled="controlAttr.isNotEdit" @change="onChange(control)" @click="onClick(control)" />
|
|
273
282
|
</template>
|
|
274
283
|
<template v-if="control.code === formFieldType.Cascader.code">
|
|
275
|
-
|
|
284
|
+
<!-- 脱敏值在编辑模式下直接显示文本,不渲染级联控件 -->
|
|
285
|
+
<!-- Cascader value 是数组,脱敏时后端可能返回字符串或带 * 的数组元素 -->
|
|
286
|
+
<span v-if="isMaskedValue(Array.isArray(formControl.value) ? formControl.value.join() : formControl.value)">{{ Array.isArray(formControl.value) ? formControl.value.join("/") : formControl.value }}</span>
|
|
287
|
+
<a-cascader v-else :get-popup-container="getPopupContainer" :changeOnSelect="controlAttr.changeOnSelect" :placeholder="controlAttr.placeholder" :show-search="{ cascaderFilter }" :disabled="controlAttr.isNotEdit" :options="cascaderOptions" v-model:value="formControl.value" @change="onChange(control)" @click="onClick(control)" />
|
|
276
288
|
</template>
|
|
277
289
|
<template v-if="control.code === formFieldType.TreeSelect.code">
|
|
290
|
+
<!-- 脱敏值在编辑模式下直接显示文本,不渲染树形控件 -->
|
|
291
|
+
<span v-if="isMaskedValue(formControl.value)">{{ formControl.value }}</span>
|
|
278
292
|
<a-tree-select
|
|
293
|
+
v-else
|
|
279
294
|
:get-popup-container="getPopupContainer"
|
|
280
295
|
v-model:value="formControl.value"
|
|
281
296
|
:show-search="true"
|
|
@@ -901,6 +916,15 @@ export default class DvFormLayout extends Vue {
|
|
|
901
916
|
return !!(this.controlAttr as DesFormControl).timeFormat && (this.controlAttr as DesFormControl).timeFormat.indexOf(":ss") < 0;
|
|
902
917
|
}
|
|
903
918
|
|
|
919
|
+
/**
|
|
920
|
+
* @description: 判断值是否是脱敏值(包含 * )
|
|
921
|
+
* @author 调试
|
|
922
|
+
* @date 2026/7/7
|
|
923
|
+
*/
|
|
924
|
+
isMaskedValue(val: any): boolean {
|
|
925
|
+
return typeof val === "string" && /\*/.test(val);
|
|
926
|
+
}
|
|
927
|
+
|
|
904
928
|
/**
|
|
905
929
|
* @description: 是否添加反馈
|
|
906
930
|
* @author ChenRui
|
|
@@ -983,7 +1007,14 @@ export default class DvFormLayout extends Vue {
|
|
|
983
1007
|
return context.join(",");
|
|
984
1008
|
} else {
|
|
985
1009
|
const option = this.options.find((item) => item.value === data);
|
|
986
|
-
|
|
1010
|
+
if (option) {
|
|
1011
|
+
return option.title;
|
|
1012
|
+
}
|
|
1013
|
+
// 脱敏值(包含 * )不在选项中时,直接返回原始值展示
|
|
1014
|
+
if (data != null && typeof data === "string" && /\*/.test(data)) {
|
|
1015
|
+
return data;
|
|
1016
|
+
}
|
|
1017
|
+
return "";
|
|
987
1018
|
}
|
|
988
1019
|
case FormFieldType.Checkbox.code:
|
|
989
1020
|
options = data || [];
|
|
@@ -1009,21 +1040,37 @@ export default class DvFormLayout extends Vue {
|
|
|
1009
1040
|
return "";
|
|
1010
1041
|
case FormFieldType.TimePicker.code:
|
|
1011
1042
|
if (data != null) {
|
|
1043
|
+
// 脱敏值直接返回原始字符串
|
|
1044
|
+
if (typeof data === "string") {
|
|
1045
|
+
return data;
|
|
1046
|
+
}
|
|
1012
1047
|
return dayjs(data).format(controlAttr.timeFormat || "HH:mm:ss");
|
|
1013
1048
|
}
|
|
1014
1049
|
return "";
|
|
1015
1050
|
case FormFieldType.DatePicker.code:
|
|
1016
1051
|
if (data != null) {
|
|
1052
|
+
// 脱敏值直接返回原始字符串,避免 dayjs 格式化输出 Invalid Date
|
|
1053
|
+
if (typeof data === "string") {
|
|
1054
|
+
return data;
|
|
1055
|
+
}
|
|
1017
1056
|
return dayjs(data).format(controlAttr.dateFormat || "YYYY-MM-dd");
|
|
1018
1057
|
}
|
|
1019
1058
|
return "";
|
|
1020
1059
|
case FormFieldType.Cascader.code:
|
|
1021
1060
|
if (data != null) {
|
|
1061
|
+
// 脱敏值直接返回原始字符串
|
|
1062
|
+
if (/\*/.test(data)) {
|
|
1063
|
+
return data[0];
|
|
1064
|
+
}
|
|
1022
1065
|
return this.cascaderContextRecursion(data, this.cascaderOptions);
|
|
1023
1066
|
}
|
|
1024
1067
|
return "";
|
|
1025
1068
|
case FormFieldType.TreeSelect.code:
|
|
1026
1069
|
if (data != null) {
|
|
1070
|
+
// 脱敏值直接返回原始字符串
|
|
1071
|
+
if (typeof data === "string" && /\*/.test(data)) {
|
|
1072
|
+
return data;
|
|
1073
|
+
}
|
|
1027
1074
|
return this.treeSelectContextRecursion(data, this.treeSelectOptions);
|
|
1028
1075
|
}
|
|
1029
1076
|
return "";
|
|
@@ -1301,7 +1348,10 @@ export default class DvFormLayout extends Vue {
|
|
|
1301
1348
|
if (this.control && this.control.formControl) {
|
|
1302
1349
|
if (this.control!.code === FormFieldType.DatePicker.code || this.control!.code === FormFieldType.TimePicker.code) {
|
|
1303
1350
|
if (this.control.formControl.value) {
|
|
1304
|
-
|
|
1351
|
+
// 脱敏值(包含 * )不做 dayjs 转换,直接保留原始字符串
|
|
1352
|
+
if (typeof this.control.formControl.value === "string" && /\*/.test(this.control.formControl.value)) {
|
|
1353
|
+
// 保持原始脱敏字符串不变
|
|
1354
|
+
} else if (typeof this.control.formControl.value === "string") {
|
|
1305
1355
|
this.control.formControl.value = dayjs(new Date(this.control.formControl.value));
|
|
1306
1356
|
} else if (this.control.formControl.value instanceof Date) {
|
|
1307
1357
|
this.control.formControl.value = dayjs(this.control.formControl.value);
|
package/src/core/FormApi.ts
CHANGED
|
@@ -723,11 +723,17 @@ export class FormApi {
|
|
|
723
723
|
case FormFieldType.TimePicker.code:
|
|
724
724
|
if (val) {
|
|
725
725
|
if (typeof val === "string") {
|
|
726
|
-
|
|
726
|
+
// 脱敏值(包含 * )不做 dayjs 转换,直接存储原始字符串
|
|
727
|
+
if (/\*/.test(val)) {
|
|
728
|
+
control.value = val;
|
|
729
|
+
} else {
|
|
730
|
+
val = dayjs(new Date(this.nowDateStr() + " " + val));
|
|
731
|
+
control.value = val;
|
|
732
|
+
}
|
|
727
733
|
} else if (val instanceof Date) {
|
|
728
734
|
val = dayjs(val);
|
|
735
|
+
control.value = val;
|
|
729
736
|
}
|
|
730
|
-
control.value = val;
|
|
731
737
|
} else {
|
|
732
738
|
control.value = null;
|
|
733
739
|
}
|
|
@@ -735,11 +741,17 @@ export class FormApi {
|
|
|
735
741
|
case FormFieldType.DatePicker.code:
|
|
736
742
|
if (val) {
|
|
737
743
|
if (typeof val === "string") {
|
|
738
|
-
|
|
744
|
+
// 脱敏值(包含 * )不做 dayjs 转换,直接存储原始字符串
|
|
745
|
+
if (/\*/.test(val)) {
|
|
746
|
+
control.value = val;
|
|
747
|
+
} else {
|
|
748
|
+
val = dayjs(val, control.dateFormat);
|
|
749
|
+
control.value = val;
|
|
750
|
+
}
|
|
739
751
|
} else if (val instanceof Date) {
|
|
740
752
|
val = dayjs(val);
|
|
753
|
+
control.value = val;
|
|
741
754
|
}
|
|
742
|
-
control.value = val;
|
|
743
755
|
} else {
|
|
744
756
|
control.value = null;
|
|
745
757
|
}
|
|
@@ -856,17 +868,38 @@ export class FormApi {
|
|
|
856
868
|
break;
|
|
857
869
|
case FormFieldType.TimePicker.code:
|
|
858
870
|
if (data) {
|
|
859
|
-
|
|
871
|
+
// 脱敏值(包含 * )直接返回原始字符串,不做 dayjs 格式化
|
|
872
|
+
if (typeof data === "string" && /\*/.test(data)) {
|
|
873
|
+
// 保持原始脱敏字符串
|
|
874
|
+
} else {
|
|
875
|
+
data = dayjs(data).format(formControl.controlAttr.timeFormat || "LTS");
|
|
876
|
+
}
|
|
860
877
|
}
|
|
861
878
|
break;
|
|
862
879
|
case FormFieldType.DatePicker.code:
|
|
863
880
|
if (data) {
|
|
864
|
-
|
|
881
|
+
// 脱敏值(包含 * )直接返回原始字符串,不做 dayjs 格式化
|
|
882
|
+
if (typeof data === "string" && /\*/.test(data)) {
|
|
883
|
+
// 保持原始脱敏字符串
|
|
884
|
+
} else {
|
|
885
|
+
data = dayjs(data).format(formControl.controlAttr.dateFormat || "YYYY-MM-DD");
|
|
886
|
+
}
|
|
865
887
|
}
|
|
866
888
|
break;
|
|
867
889
|
case FormFieldType.Cascader.code:
|
|
868
890
|
if (data) {
|
|
869
|
-
|
|
891
|
+
// 脱敏值(包含 * )直接返回原始字符串
|
|
892
|
+
if (typeof data === "string" && /\*/.test(data)) {
|
|
893
|
+
// 保持原始脱敏字符串
|
|
894
|
+
} else {
|
|
895
|
+
data = data.join(",");
|
|
896
|
+
}
|
|
897
|
+
}
|
|
898
|
+
break;
|
|
899
|
+
case FormFieldType.TreeSelect.code:
|
|
900
|
+
// 脱敏值(包含 * )直接返回原始字符串
|
|
901
|
+
if (typeof data === "string" && /\*/.test(data)) {
|
|
902
|
+
// 保持原始脱敏字符串
|
|
870
903
|
}
|
|
871
904
|
break;
|
|
872
905
|
case FormFieldType.Switch.code:
|