zhytech-ui-mobile 1.0.2 → 1.0.3
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/dist/build/h5/style.css +1 -0
- package/dist/build/h5/zhytech-ui-mobile.es.js +19690 -0
- package/dist/build/h5/zhytech-ui-mobile.umd.js +6 -0
- package/package.json +6 -1
- package/.eslintignore +0 -11
- package/.eslintrc.cjs +0 -253
- package/.prettierignore +0 -0
- package/.prettierrc.json +0 -9
- package/.vscode/settings.json +0 -131
- package/index.html +0 -39
- package/shims-uni.d.ts +0 -7
- package/src/App.vue +0 -24
- package/src/components/dynamicForm/componentRenderer.vue +0 -207
- package/src/components/dynamicForm/components/advanced/index.ts +0 -13
- package/src/components/dynamicForm/components/advanced/upload.vue +0 -108
- package/src/components/dynamicForm/components/advanced/uploadImage.vue +0 -107
- package/src/components/dynamicForm/components/answerSheetPopup/answerSheetItem.vue +0 -58
- package/src/components/dynamicForm/components/answerSheetPopup/index.vue +0 -111
- package/src/components/dynamicForm/components/application/employee.vue +0 -140
- package/src/components/dynamicForm/components/application/grade.vue +0 -183
- package/src/components/dynamicForm/components/application/index.ts +0 -14
- package/src/components/dynamicForm/components/application/post.vue +0 -136
- package/src/components/dynamicForm/components/base/checkbox.vue +0 -143
- package/src/components/dynamicForm/components/base/index.ts +0 -15
- package/src/components/dynamicForm/components/base/input.vue +0 -99
- package/src/components/dynamicForm/components/base/label.vue +0 -29
- package/src/components/dynamicForm/components/base/radio.vue +0 -155
- package/src/components/dynamicForm/components/componentType.ts +0 -16
- package/src/components/dynamicForm/components/layout/groupLayout.vue +0 -103
- package/src/components/dynamicForm/components/layout/index.ts +0 -12
- package/src/components/dynamicForm/formRenderer.vue +0 -567
- package/src/components/dynamicForm/index.ts +0 -21
- package/src/components/dynamicForm/types/componentAttribute/advanced/uploadAttribute.ts +0 -35
- package/src/components/dynamicForm/types/componentAttribute/application/employeeAttribute.ts +0 -42
- package/src/components/dynamicForm/types/componentAttribute/application/gradeAttribute.ts +0 -54
- package/src/components/dynamicForm/types/componentAttribute/application/postAttribute.ts +0 -42
- package/src/components/dynamicForm/types/componentAttribute/base/checkboxAttribute.ts +0 -38
- package/src/components/dynamicForm/types/componentAttribute/base/inputAttribute.ts +0 -31
- package/src/components/dynamicForm/types/componentAttribute/base/radioAttribute.ts +0 -30
- package/src/components/dynamicForm/types/componentAttribute/baseAttribute.ts +0 -110
- package/src/components/dynamicForm/types/componentAttribute/editAttribute.ts +0 -70
- package/src/components/dynamicForm/types/componentAttribute/index.ts +0 -37
- package/src/components/dynamicForm/types/componentAttribute/layout/groupLayoutAttribute.ts +0 -39
- package/src/components/dynamicForm/types/documentView.ts +0 -110
- package/src/components/dynamicForm/types/enum.ts +0 -109
- package/src/components/dynamicForm/types/formAttribute.ts +0 -93
- package/src/components/dynamicForm/types/uploadOption.ts +0 -31
- package/src/env.d.ts +0 -8
- package/src/hooks/useMessage.ts +0 -44
- package/src/hooks/useToast.ts +0 -29
- package/src/hooks/useUtils.ts +0 -201
- package/src/index.ts +0 -59
- package/src/main.ts +0 -19
- package/src/manifest.json +0 -72
- package/src/pages/dynamicFormDemo.vue +0 -1260
- package/src/pages/dynamicFormExaminationDemo.vue +0 -567
- package/src/pages.json +0 -58
- package/src/shime-uni.d.ts +0 -6
- package/src/uni.scss +0 -76
- package/src/unocss/index.ts +0 -20
- package/src/unocss/rules.ts +0 -139
- package/src/unocss/shortcuts.ts +0 -53
- package/src/unocss/theme/index.ts +0 -13
- package/src/unocss/theme/themeOption/dark.ts +0 -35
- package/src/unocss/theme/themeOption/primary.ts +0 -33
- package/src/unocss/variants.ts +0 -110
- package/tsconfig.json +0 -19
- package/uno.config.ts +0 -63
- package/vite.config.ts +0 -83
- /package/{src → dist/build/h5}/static/iconfont/iconfont.css +0 -0
- /package/{src → dist/build/h5}/static/iconfont/iconfont.ttf +0 -0
- /package/{src → dist/build/h5}/static/iconfont/iconfont.woff +0 -0
- /package/{src → dist/build/h5}/static/iconfont/iconfont.woff2 +0 -0
- /package/{src → dist/build/h5}/static/scss/actionSheet.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/button.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/checkbox.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/form.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/index.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/input.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/picker.scss +0 -0
- /package/{src → dist/build/h5}/static/scss/radio.scss +0 -0
|
@@ -1,140 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\application\employee.vue
|
|
3
|
-
* Author : 苏军志
|
|
4
|
-
* Date : 2024-03-06 14:20
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2025-09-03 16:50
|
|
7
|
-
* Description : 人员(employee)组件渲染器
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
-->
|
|
10
|
-
<template>
|
|
11
|
-
<view class="zhy-form-component-employee">
|
|
12
|
-
<wd-radio-group
|
|
13
|
-
v-if="componentProps.type === 'radio'"
|
|
14
|
-
custom-class="zhy"
|
|
15
|
-
v-model="datas[componentID]"
|
|
16
|
-
:disabled="disabled"
|
|
17
|
-
:inline="!componentProps.newLine"
|
|
18
|
-
icon-placement="left"
|
|
19
|
-
shape="dot"
|
|
20
|
-
>
|
|
21
|
-
<wd-radio
|
|
22
|
-
v-for="(employee, index) in componentProps.options"
|
|
23
|
-
:key="index"
|
|
24
|
-
:value="employee.value"
|
|
25
|
-
@click="clearCheck($event, employee.value)"
|
|
26
|
-
>
|
|
27
|
-
{{ employee.label }}
|
|
28
|
-
</wd-radio>
|
|
29
|
-
</wd-radio-group>
|
|
30
|
-
<wd-checkbox-group
|
|
31
|
-
v-if="componentProps.type === 'checkbox'"
|
|
32
|
-
custom-class="zhy"
|
|
33
|
-
v-model="datas[componentID]"
|
|
34
|
-
:disabled="disabled"
|
|
35
|
-
:min="componentProps.min"
|
|
36
|
-
:max="componentProps.max"
|
|
37
|
-
:inline="!componentProps.newLine"
|
|
38
|
-
>
|
|
39
|
-
<wd-checkbox v-for="(employee, index) in componentProps.options" :key="index" :modelValue="employee.value" shape="square">
|
|
40
|
-
{{ employee.label }}
|
|
41
|
-
</wd-checkbox>
|
|
42
|
-
</wd-checkbox-group>
|
|
43
|
-
<wd-picker
|
|
44
|
-
v-if="componentProps.type === 'selector'"
|
|
45
|
-
custom-class="zhy"
|
|
46
|
-
v-model="employee.value"
|
|
47
|
-
:columns="componentProps.options"
|
|
48
|
-
:disabled="disabled"
|
|
49
|
-
use-default-slot
|
|
50
|
-
@confirm="confirm"
|
|
51
|
-
>
|
|
52
|
-
<wd-input custom-class="zhy" type="text" v-model="employee.label" :placeholder="`请选择${componentProps.label}`" readonly />
|
|
53
|
-
</wd-picker>
|
|
54
|
-
<view
|
|
55
|
-
v-if="showDescription && (formTypeEnum.Examination || componentProps.description)"
|
|
56
|
-
class="dynamic-form-item-description show-description"
|
|
57
|
-
>
|
|
58
|
-
<wd-icon custom-class="description-tip" class-prefix="iconfont zhy" name="tip" color="#ff0000" />
|
|
59
|
-
{{ `${formType === formTypeEnum.Form ? "项目说明" : "答案解析"}:${componentProps.description || "无"}` }}
|
|
60
|
-
</view>
|
|
61
|
-
</view>
|
|
62
|
-
</template>
|
|
63
|
-
<script setup lang="ts">
|
|
64
|
-
import { formTypeEnum } from "../../types/enum";
|
|
65
|
-
import type { baseAttribute, editAttribute, employeeAttribute } from "../../types/componentAttribute/index";
|
|
66
|
-
type componentType = baseAttribute & editAttribute & employeeAttribute;
|
|
67
|
-
const props = defineProps({
|
|
68
|
-
/**
|
|
69
|
-
* 是否禁用
|
|
70
|
-
*/
|
|
71
|
-
disabled: {
|
|
72
|
-
type: Boolean,
|
|
73
|
-
default: false
|
|
74
|
-
},
|
|
75
|
-
/**
|
|
76
|
-
* 组件ID
|
|
77
|
-
*/
|
|
78
|
-
componentID: {
|
|
79
|
-
type: [String, Number],
|
|
80
|
-
required: true
|
|
81
|
-
},
|
|
82
|
-
/**
|
|
83
|
-
* 表单数据
|
|
84
|
-
*/
|
|
85
|
-
datas: {
|
|
86
|
-
type: Object as PropType<Record<string, any>>,
|
|
87
|
-
required: true
|
|
88
|
-
},
|
|
89
|
-
/**
|
|
90
|
-
* 组件属性
|
|
91
|
-
*/
|
|
92
|
-
componentProps: {
|
|
93
|
-
type: Object as PropType<componentType>,
|
|
94
|
-
required: true
|
|
95
|
-
},
|
|
96
|
-
/**
|
|
97
|
-
* 是否项目说明/答案解析
|
|
98
|
-
*/
|
|
99
|
-
showDescription: {
|
|
100
|
-
type: Boolean,
|
|
101
|
-
default: false
|
|
102
|
-
}
|
|
103
|
-
});
|
|
104
|
-
// 表单类型
|
|
105
|
-
const formType = inject("formType") as ComputedRef<string>;
|
|
106
|
-
// 双向绑定
|
|
107
|
-
const { datas, componentProps } = toRefs(props);
|
|
108
|
-
const emits = defineEmits(["update:datas"]);
|
|
109
|
-
watch(datas, (newValue) => emits("update:datas", newValue));
|
|
110
|
-
const employee = ref<Record<string, string>>({});
|
|
111
|
-
onMounted(async () => {
|
|
112
|
-
confirm(datas.value[props.componentID]);
|
|
113
|
-
});
|
|
114
|
-
/**
|
|
115
|
-
* @description: 选择人员
|
|
116
|
-
* @param value
|
|
117
|
-
* @return
|
|
118
|
-
*/
|
|
119
|
-
const confirm = (data: Record<string, any>) => {
|
|
120
|
-
employee.value = data?.selectedItems ?? {};
|
|
121
|
-
datas.value[props.componentID] = employee.value.value;
|
|
122
|
-
};
|
|
123
|
-
let oldValue: string | number | boolean | undefined = datas.value[props.componentID];
|
|
124
|
-
/**
|
|
125
|
-
* @description: 清空选项检核
|
|
126
|
-
* @param event
|
|
127
|
-
* @param value
|
|
128
|
-
* @return
|
|
129
|
-
*/
|
|
130
|
-
const clearCheck = (event: any, value: string) => {
|
|
131
|
-
// 如果点击项目已选中,且允许取消,则取消选中
|
|
132
|
-
if (componentProps.value.clearable && oldValue === value) {
|
|
133
|
-
delete datas.value[props.componentID];
|
|
134
|
-
oldValue = undefined;
|
|
135
|
-
event.preventDefault();
|
|
136
|
-
return;
|
|
137
|
-
}
|
|
138
|
-
oldValue = value;
|
|
139
|
-
};
|
|
140
|
-
</script>
|
|
@@ -1,183 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\application\grade.vue
|
|
3
|
-
* Author : 苏军志
|
|
4
|
-
* Date : 2024-03-06 14:20
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2025-09-03 16:58
|
|
7
|
-
* Description : 考评分数(grade)组件渲染器
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
-->
|
|
10
|
-
<template>
|
|
11
|
-
<view class="zhy-form-component-grade">
|
|
12
|
-
<wd-radio-group
|
|
13
|
-
custom-class="zhy"
|
|
14
|
-
v-model="data.score"
|
|
15
|
-
:disabled="disabled"
|
|
16
|
-
:inline="!componentProps.newLine"
|
|
17
|
-
icon-placement="left"
|
|
18
|
-
shape="dot"
|
|
19
|
-
>
|
|
20
|
-
<wd-radio v-for="(gradeItem, index) in gradeItems" :key="index" :value="gradeItem.value" @click="clearCheck($event, gradeItem.value)">
|
|
21
|
-
{{ gradeItem.label }}
|
|
22
|
-
</wd-radio>
|
|
23
|
-
</wd-radio-group>
|
|
24
|
-
<view v-if="componentProps.showProblem" class="aline-left">
|
|
25
|
-
<text class="break-keep">问题:</text>
|
|
26
|
-
<wd-input
|
|
27
|
-
custom-class="zhy flex-auto"
|
|
28
|
-
type="text"
|
|
29
|
-
v-model="data.problem"
|
|
30
|
-
:disabled="disabled"
|
|
31
|
-
placeholder=""
|
|
32
|
-
:clearable="true"
|
|
33
|
-
clearTrigger="focus"
|
|
34
|
-
/>
|
|
35
|
-
</view>
|
|
36
|
-
<view v-if="componentProps.showProblem" class="aline-left">
|
|
37
|
-
<text class="break-keep">亮点:</text>
|
|
38
|
-
<wd-input
|
|
39
|
-
custom-class="zhy flex-auto"
|
|
40
|
-
type="text"
|
|
41
|
-
v-model="data.brightSpot"
|
|
42
|
-
:disabled="disabled"
|
|
43
|
-
placeholder=""
|
|
44
|
-
:clearable="true"
|
|
45
|
-
clearTrigger="focus"
|
|
46
|
-
/>
|
|
47
|
-
</view>
|
|
48
|
-
<view v-if="componentProps.showRemark" class="aline-left">
|
|
49
|
-
<text class="break-keep">备注:</text>
|
|
50
|
-
<wd-input
|
|
51
|
-
custom-class="zhy flex-auto"
|
|
52
|
-
type="text"
|
|
53
|
-
v-model="data.remark"
|
|
54
|
-
:disabled="disabled"
|
|
55
|
-
placeholder=""
|
|
56
|
-
:clearable="true"
|
|
57
|
-
clearTrigger="focus"
|
|
58
|
-
/>
|
|
59
|
-
</view>
|
|
60
|
-
<view
|
|
61
|
-
v-if="showDescription && (formTypeEnum.Examination || componentProps.description)"
|
|
62
|
-
class="dynamic-form-item-description show-description"
|
|
63
|
-
>
|
|
64
|
-
<wd-icon custom-class="description-tip" class-prefix="iconfont zhy" name="tip" color="#ff0000" />
|
|
65
|
-
{{ `${formType === formTypeEnum.Form ? "项目说明" : "答案解析"}:${componentProps.description || "无"}` }}
|
|
66
|
-
</view>
|
|
67
|
-
</view>
|
|
68
|
-
</template>
|
|
69
|
-
<script setup lang="ts">
|
|
70
|
-
import { formTypeEnum } from "../../types/enum";
|
|
71
|
-
import type { baseAttribute, editAttribute, gradeAttribute } from "../../types/componentAttribute/index";
|
|
72
|
-
type componentType = baseAttribute & editAttribute & gradeAttribute;
|
|
73
|
-
const props = defineProps({
|
|
74
|
-
/**
|
|
75
|
-
* 是否禁用
|
|
76
|
-
*/
|
|
77
|
-
disabled: {
|
|
78
|
-
type: Boolean,
|
|
79
|
-
default: false
|
|
80
|
-
},
|
|
81
|
-
/**
|
|
82
|
-
* 组件ID
|
|
83
|
-
*/
|
|
84
|
-
componentID: {
|
|
85
|
-
type: [String, Number],
|
|
86
|
-
required: true
|
|
87
|
-
},
|
|
88
|
-
/**
|
|
89
|
-
* 表单数据
|
|
90
|
-
*/
|
|
91
|
-
datas: {
|
|
92
|
-
type: Object as PropType<Record<string, any>>,
|
|
93
|
-
required: true
|
|
94
|
-
},
|
|
95
|
-
/**
|
|
96
|
-
* 组件属性
|
|
97
|
-
*/
|
|
98
|
-
componentProps: {
|
|
99
|
-
type: Object as PropType<componentType>,
|
|
100
|
-
required: true
|
|
101
|
-
},
|
|
102
|
-
/**
|
|
103
|
-
* 是否项目说明/答案解析
|
|
104
|
-
*/
|
|
105
|
-
showDescription: {
|
|
106
|
-
type: Boolean,
|
|
107
|
-
default: false
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
// 表单类型
|
|
111
|
-
const formType = inject("formType") as ComputedRef<string>;
|
|
112
|
-
// 双向绑定
|
|
113
|
-
const { datas, componentProps } = toRefs(props);
|
|
114
|
-
const emits = defineEmits(["update:datas"]);
|
|
115
|
-
watch(datas, (newValue) => emits("update:datas", newValue));
|
|
116
|
-
const data = ref<Record<string, string>>(datas.value[props.componentID] || {});
|
|
117
|
-
const { isEmpty } = useUtils();
|
|
118
|
-
watch(
|
|
119
|
-
data,
|
|
120
|
-
(newValue) => {
|
|
121
|
-
let hasValue = false;
|
|
122
|
-
datas.value[props.componentID] = {};
|
|
123
|
-
Object.keys(newValue ?? {}).forEach((key) => {
|
|
124
|
-
if (!isEmpty(newValue[key])) {
|
|
125
|
-
datas.value[props.componentID][key] = newValue[key];
|
|
126
|
-
hasValue = true;
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
// 如果有有效值才添加maxScore
|
|
130
|
-
if (hasValue) {
|
|
131
|
-
datas.value[props.componentID].maxScore = componentProps.value.maxScore;
|
|
132
|
-
}
|
|
133
|
-
},
|
|
134
|
-
{ deep: true }
|
|
135
|
-
);
|
|
136
|
-
const gradeItems = ref<Record<string, string>[]>([]);
|
|
137
|
-
onMounted(() => getGradeItems());
|
|
138
|
-
/**
|
|
139
|
-
* @description: 根据属性获取分数集合
|
|
140
|
-
*/
|
|
141
|
-
const getGradeItems = () => {
|
|
142
|
-
if (!componentProps.value.maxScore) {
|
|
143
|
-
return gradeItems;
|
|
144
|
-
}
|
|
145
|
-
// 依据配置显示单项否决项
|
|
146
|
-
if (componentProps.value.showVeto) {
|
|
147
|
-
gradeItems.value.push({ value: "-2", label: "单项否决" });
|
|
148
|
-
}
|
|
149
|
-
// 依据配置显示不考评选项
|
|
150
|
-
if (componentProps.value.showNotGrade) {
|
|
151
|
-
gradeItems.value.push({ value: "-1", label: "不考评" });
|
|
152
|
-
}
|
|
153
|
-
// 依据配置显示0分选项
|
|
154
|
-
if (componentProps.value.showZero) {
|
|
155
|
-
gradeItems.value.push({ value: "0", label: "0分" });
|
|
156
|
-
}
|
|
157
|
-
// 依据最大分数展开
|
|
158
|
-
let gradeScore = Number(componentProps.value.maxScore);
|
|
159
|
-
for (let i = 1; i <= gradeScore; i++) {
|
|
160
|
-
gradeItems.value.push({ value: String(i), label: `${String(i)}分` });
|
|
161
|
-
}
|
|
162
|
-
if (componentProps.value.scoreReverseFlag) {
|
|
163
|
-
gradeItems.value.reverse();
|
|
164
|
-
}
|
|
165
|
-
};
|
|
166
|
-
let oldValue: string | number | boolean | undefined = (datas.value[props.componentID] || {}).score;
|
|
167
|
-
/**
|
|
168
|
-
* @description: 清空选项检核
|
|
169
|
-
* @param event
|
|
170
|
-
* @param value
|
|
171
|
-
* @return
|
|
172
|
-
*/
|
|
173
|
-
const clearCheck = (event: any, value: string) => {
|
|
174
|
-
// 如果点击项目已选中,且允许取消,则取消选中
|
|
175
|
-
if (componentProps.value.clearable && oldValue === value) {
|
|
176
|
-
delete datas.value[props.componentID].score;
|
|
177
|
-
oldValue = undefined;
|
|
178
|
-
event.preventDefault();
|
|
179
|
-
return;
|
|
180
|
-
}
|
|
181
|
-
oldValue = value;
|
|
182
|
-
};
|
|
183
|
-
</script>
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\application\index.ts
|
|
3
|
-
* Author : 苏军志
|
|
4
|
-
* Date : 2024-03-04 19:04
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2024-05-18 17:56
|
|
7
|
-
* Description : 业务应用组件集合
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
import employee from "./employee.vue";
|
|
12
|
-
import grade from "./grade.vue";
|
|
13
|
-
import post from "./post.vue";
|
|
14
|
-
export { employee, grade, post };
|
|
@@ -1,136 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\application\post.vue
|
|
3
|
-
* Author : 郭鹏超
|
|
4
|
-
* Date : 2024-04-22 11:12
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2025-09-05 10:08
|
|
7
|
-
* Description :岗位(post)组件渲染器
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
-->
|
|
10
|
-
|
|
11
|
-
<template>
|
|
12
|
-
<view class="zhy-form-component-post">
|
|
13
|
-
<wd-radio-group
|
|
14
|
-
v-if="componentProps.type === 'radio'"
|
|
15
|
-
custom-class="zhy"
|
|
16
|
-
v-model="datas[componentID]"
|
|
17
|
-
:disabled="disabled"
|
|
18
|
-
:inline="!componentProps.newLine"
|
|
19
|
-
icon-placement="left"
|
|
20
|
-
shape="dot"
|
|
21
|
-
>
|
|
22
|
-
<wd-radio v-for="(post, index) in componentProps.options" :key="index" :value="post.value" @click="clearCheck($event, post.value)">
|
|
23
|
-
{{ post.label }}
|
|
24
|
-
</wd-radio>
|
|
25
|
-
</wd-radio-group>
|
|
26
|
-
<wd-checkbox-group
|
|
27
|
-
v-if="componentProps.type === 'checkbox'"
|
|
28
|
-
custom-class="zhy"
|
|
29
|
-
v-model="datas[componentID]"
|
|
30
|
-
:disabled="disabled"
|
|
31
|
-
:min="componentProps.min"
|
|
32
|
-
:max="componentProps.max"
|
|
33
|
-
:inline="!componentProps.newLine"
|
|
34
|
-
>
|
|
35
|
-
<wd-checkbox v-for="(post, index) in componentProps.options" :key="index" :modelValue="post.value" shape="square">
|
|
36
|
-
{{ post.label }}
|
|
37
|
-
</wd-checkbox>
|
|
38
|
-
</wd-checkbox-group>
|
|
39
|
-
<wd-picker
|
|
40
|
-
v-if="componentProps.type === 'selector'"
|
|
41
|
-
custom-class="zhy"
|
|
42
|
-
v-model="post.value"
|
|
43
|
-
:columns="componentProps.options"
|
|
44
|
-
:disabled="disabled"
|
|
45
|
-
use-default-slot
|
|
46
|
-
@confirm="confirm"
|
|
47
|
-
>
|
|
48
|
-
<wd-input custom-class="zhy" type="text" v-model="post.label" :placeholder="`请选择${componentProps.label}`" readonly />
|
|
49
|
-
</wd-picker>
|
|
50
|
-
<view
|
|
51
|
-
v-if="showDescription && (formTypeEnum.Examination || componentProps.description)"
|
|
52
|
-
class="dynamic-form-item-description show-description"
|
|
53
|
-
>
|
|
54
|
-
<wd-icon custom-class="description-tip" class-prefix="iconfont zhy" name="tip" color="#ff0000" />
|
|
55
|
-
{{ `${formType === formTypeEnum.Form ? "项目说明" : "答案解析"}:${componentProps.description || "无"}` }}
|
|
56
|
-
</view>
|
|
57
|
-
</view>
|
|
58
|
-
</template>
|
|
59
|
-
<script setup lang="ts">
|
|
60
|
-
import { formTypeEnum } from "../../types/enum";
|
|
61
|
-
import type { baseAttribute, editAttribute, employeeAttribute, postAttribute } from "../../types/componentAttribute/index";
|
|
62
|
-
type componentType = baseAttribute & editAttribute & employeeAttribute & postAttribute;
|
|
63
|
-
const props = defineProps({
|
|
64
|
-
/**
|
|
65
|
-
* 是否禁用
|
|
66
|
-
*/
|
|
67
|
-
disabled: {
|
|
68
|
-
type: Boolean,
|
|
69
|
-
default: false
|
|
70
|
-
},
|
|
71
|
-
/**
|
|
72
|
-
* 组件ID
|
|
73
|
-
*/
|
|
74
|
-
componentID: {
|
|
75
|
-
type: [String, Number],
|
|
76
|
-
required: true
|
|
77
|
-
},
|
|
78
|
-
/**
|
|
79
|
-
* 表单数据
|
|
80
|
-
*/
|
|
81
|
-
datas: {
|
|
82
|
-
type: Object as PropType<Record<string, any>>,
|
|
83
|
-
required: true
|
|
84
|
-
},
|
|
85
|
-
/**
|
|
86
|
-
* 组件属性
|
|
87
|
-
*/
|
|
88
|
-
componentProps: {
|
|
89
|
-
type: Object as PropType<componentType>,
|
|
90
|
-
required: true
|
|
91
|
-
},
|
|
92
|
-
/**
|
|
93
|
-
* 是否项目说明/答案解析
|
|
94
|
-
*/
|
|
95
|
-
showDescription: {
|
|
96
|
-
type: Boolean,
|
|
97
|
-
default: false
|
|
98
|
-
}
|
|
99
|
-
});
|
|
100
|
-
// 表单类型
|
|
101
|
-
const formType = inject("formType") as ComputedRef<string>;
|
|
102
|
-
// 双向绑定
|
|
103
|
-
const { datas, componentProps } = toRefs(props);
|
|
104
|
-
const emits = defineEmits(["update:datas"]);
|
|
105
|
-
watch(datas, (newValue) => emits("update:datas", newValue));
|
|
106
|
-
const post = ref<Record<string, string>>({});
|
|
107
|
-
onMounted(async () => {
|
|
108
|
-
confirm(datas.value[props.componentID]);
|
|
109
|
-
});
|
|
110
|
-
/**
|
|
111
|
-
* @description: 选择岗位
|
|
112
|
-
* @param value
|
|
113
|
-
* @return
|
|
114
|
-
*/
|
|
115
|
-
const confirm = (data: Record<string, any>) => {
|
|
116
|
-
post.value = data?.selectedItems ?? {};
|
|
117
|
-
datas.value[props.componentID] = post.value.value;
|
|
118
|
-
};
|
|
119
|
-
let oldValue: string | number | boolean | undefined = datas.value[props.componentID];
|
|
120
|
-
/**
|
|
121
|
-
* @description: 清空选项检核
|
|
122
|
-
* @param event
|
|
123
|
-
* @param value
|
|
124
|
-
* @return
|
|
125
|
-
*/
|
|
126
|
-
const clearCheck = (event: any, value: string) => {
|
|
127
|
-
// 如果点击项目已选中,且允许取消,则取消选中
|
|
128
|
-
if (componentProps.value.clearable && oldValue === value) {
|
|
129
|
-
delete datas.value[props.componentID];
|
|
130
|
-
oldValue = undefined;
|
|
131
|
-
event.preventDefault();
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
oldValue = value;
|
|
135
|
-
};
|
|
136
|
-
</script>
|
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\base\checkbox.vue
|
|
3
|
-
* Author : 苏军志
|
|
4
|
-
* Date : 2024-03-06 19:12
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2025-09-05 20:35
|
|
7
|
-
* Description : 多选框(checkbox)组件渲染器
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
-->
|
|
10
|
-
<template>
|
|
11
|
-
<view class="zhy-form-component-checkbox">
|
|
12
|
-
<wd-checkbox-group
|
|
13
|
-
custom-class="zhy"
|
|
14
|
-
v-model="datas[componentID]"
|
|
15
|
-
:disabled="disabled"
|
|
16
|
-
:min="componentProps.min"
|
|
17
|
-
:max="componentProps.max"
|
|
18
|
-
:inline="!componentProps.newLine"
|
|
19
|
-
>
|
|
20
|
-
<template v-for="(item, index) in componentProps.options" :key="index">
|
|
21
|
-
<wd-checkbox :modelValue="item.value" shape="square">{{ item.label }} </wd-checkbox>
|
|
22
|
-
<wd-input
|
|
23
|
-
v-if="item.inputEnable && datas[componentID]?.includes(item.value)"
|
|
24
|
-
custom-class="zhy ml-20!"
|
|
25
|
-
type="text"
|
|
26
|
-
placeholder=""
|
|
27
|
-
:clearable="true"
|
|
28
|
-
clearTrigger="focus"
|
|
29
|
-
v-model="datas[`${componentID}||${item.value}`]"
|
|
30
|
-
/>
|
|
31
|
-
</template>
|
|
32
|
-
</wd-checkbox-group>
|
|
33
|
-
<view
|
|
34
|
-
v-if="
|
|
35
|
-
everyItemDisplayAnalysisSwitch ||
|
|
36
|
-
displayAnswerDescription ||
|
|
37
|
-
(showDescription && (formType === formTypeEnum.Examination || componentProps.description))
|
|
38
|
-
"
|
|
39
|
-
:class="['dynamic-form-item-description', { 'show-description': displayAnswerDescription }]"
|
|
40
|
-
>
|
|
41
|
-
<wd-icon
|
|
42
|
-
custom-class="description-tip"
|
|
43
|
-
class-prefix="iconfont zhy"
|
|
44
|
-
name="tip"
|
|
45
|
-
color="#ff0000"
|
|
46
|
-
@click="displayAnswerDescription = !displayAnswerDescription"
|
|
47
|
-
/>
|
|
48
|
-
<view v-if="displayAnswerDescription">
|
|
49
|
-
{{ `${formType === formTypeEnum.Form ? "项目说明" : "答案解析"}:${componentProps.description || "无"}` }}</view
|
|
50
|
-
>
|
|
51
|
-
</view>
|
|
52
|
-
</view>
|
|
53
|
-
</template>
|
|
54
|
-
<script setup lang="ts">
|
|
55
|
-
import { formTypeEnum, examinationStatusEnum } from "../../types/enum";
|
|
56
|
-
import type { baseAttribute, checkboxAttribute, editAttribute } from "../../types/componentAttribute/index";
|
|
57
|
-
type componentType = baseAttribute & editAttribute & checkboxAttribute;
|
|
58
|
-
const props = defineProps({
|
|
59
|
-
/**
|
|
60
|
-
* 是否禁用
|
|
61
|
-
*/
|
|
62
|
-
disabled: {
|
|
63
|
-
type: Boolean,
|
|
64
|
-
default: false
|
|
65
|
-
},
|
|
66
|
-
/**
|
|
67
|
-
* 组件ID
|
|
68
|
-
*/
|
|
69
|
-
componentID: {
|
|
70
|
-
type: [String, Number],
|
|
71
|
-
required: true
|
|
72
|
-
},
|
|
73
|
-
/**
|
|
74
|
-
* 表单数据
|
|
75
|
-
*/
|
|
76
|
-
datas: {
|
|
77
|
-
type: Object as PropType<Record<string, any>>,
|
|
78
|
-
required: true
|
|
79
|
-
},
|
|
80
|
-
/**
|
|
81
|
-
* 组件属性
|
|
82
|
-
*/
|
|
83
|
-
componentProps: {
|
|
84
|
-
type: Object as PropType<componentType>,
|
|
85
|
-
required: true
|
|
86
|
-
},
|
|
87
|
-
/**
|
|
88
|
-
* 是否项目说明/答案解析
|
|
89
|
-
*/
|
|
90
|
-
showDescription: {
|
|
91
|
-
type: Boolean,
|
|
92
|
-
default: false
|
|
93
|
-
}
|
|
94
|
-
});
|
|
95
|
-
// 表单类型
|
|
96
|
-
const formType = inject("formType") as ComputedRef<string>;
|
|
97
|
-
const realTimeDisplayAnswerMode = inject("realTimeDisplayAnswerMode") as boolean;
|
|
98
|
-
const everyItemDisplayAnalysisSwitch = inject("everyItemDisplayAnalysisSwitch") as boolean;
|
|
99
|
-
// 双向绑定
|
|
100
|
-
const { datas, componentProps } = toRefs(props);
|
|
101
|
-
const emits = defineEmits(["update:datas"]);
|
|
102
|
-
const displayAnswerDescription = ref<boolean>(false);
|
|
103
|
-
/**
|
|
104
|
-
* @description: 选项值改变,如果允许填空的选项被取消勾选,填空内容也清空
|
|
105
|
-
* @param values
|
|
106
|
-
* @return
|
|
107
|
-
*/
|
|
108
|
-
const change = (values: any) => {
|
|
109
|
-
// 如果是考试,并且打开了实时显示答案模式
|
|
110
|
-
if (
|
|
111
|
-
formType.value === formTypeEnum.Examination &&
|
|
112
|
-
realTimeDisplayAnswerMode &&
|
|
113
|
-
values?.length &&
|
|
114
|
-
componentProps.value.correctOptions?.length
|
|
115
|
-
) {
|
|
116
|
-
const errorValue = values?.find((value: any) => !componentProps.value.correctOptions?.includes(value));
|
|
117
|
-
if (!errorValue && componentProps.value.correctOptions?.length === values.length) {
|
|
118
|
-
componentProps.value.examinationStatus = examinationStatusEnum.Correct;
|
|
119
|
-
componentProps.value.color = "#000000";
|
|
120
|
-
displayAnswerDescription.value = false;
|
|
121
|
-
} else {
|
|
122
|
-
componentProps.value.examinationStatus = examinationStatusEnum.Error;
|
|
123
|
-
componentProps.value.color = "#ff0000";
|
|
124
|
-
displayAnswerDescription.value = true;
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
// 如果取消选中的选项,清空输入框
|
|
128
|
-
componentProps.value.options.forEach((option) => {
|
|
129
|
-
const inputKey = `${props.componentID}||${option.value}`;
|
|
130
|
-
if (!(values ?? []).includes(option.value) && datas.value[inputKey]) {
|
|
131
|
-
delete datas.value[inputKey];
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
};
|
|
135
|
-
watch(
|
|
136
|
-
datas,
|
|
137
|
-
(newValue) => {
|
|
138
|
-
change(newValue?.[props.componentID]);
|
|
139
|
-
emits("update:datas", newValue);
|
|
140
|
-
},
|
|
141
|
-
{ deep: true, immediate: true }
|
|
142
|
-
);
|
|
143
|
-
</script>
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* FilePath : \src\components\dynamicForm\components\base\index.ts
|
|
3
|
-
* Author : 苏军志
|
|
4
|
-
* Date : 2024-03-04 19:04
|
|
5
|
-
* LastEditors : 苏军志
|
|
6
|
-
* LastEditTime : 2024-05-18 17:31
|
|
7
|
-
* Description : 基础组件集合
|
|
8
|
-
* CodeIterationRecord:
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
import checkbox from "./checkbox.vue";
|
|
12
|
-
import input from "./input.vue";
|
|
13
|
-
import label from "./label.vue";
|
|
14
|
-
import radio from "./radio.vue";
|
|
15
|
-
export { label, input, radio, checkbox };
|