Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
80d6d566 1 parent 8d24a310

group组件删除和提交逻辑调整

Expand all
Inline Side-by-side
Showing 3 changed files with 150 additions and 55 deletions
......@@ -77,8 +77,10 @@ declare module '@vue/runtime-core' {
VanSearch: typeof import('vant/es')['Search']
VanSwipe: typeof import('vant/es')['Swipe']
VanSwipeItem: typeof import('vant/es')['SwipeItem']
VanTa: typeof import('vant/es')['Ta']
VanTab: typeof import('vant/es')['Tab']
VanTabs: typeof import('vant/es')['Tabs']
VanTag: typeof import('vant/es')['Tag']
VanTimePicker: typeof import('vant/es')['TimePicker']
VanUploader: typeof import('vant/es')['Uploader']
VideoField: typeof import('./src/components/VideoField/index.vue')['default']
......
This diff is collapsed. Click to expand it.
<!--
* @Date: 2022-07-18 10:22:22
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-05-29 14:28:37
* @LastEditTime: 2024-06-03 17:06:34
* @FilePath: /data-table/src/views/index.vue
* @Description: 首页
-->
......@@ -25,7 +25,7 @@
<van-form @submit="onSubmit" :scroll-to-error="true">
<van-cell-group :border="false">
<component v-for="(item, index) in formData" :id="item.key" :ref="(el) => setRefMap(el, item)" :key="index"
:is="item.component" :item="item" @active="onActive" />
:is="item.component" :item="item" @active="onActive" @remove="onRemove" />
</van-cell-group>
<div v-if="formData.length && PCommit.visible" style="margin: 16px">
<van-button round block type="primary" native-type="submit" :disabled="submitStatus">
......@@ -253,63 +253,129 @@ onMounted(async () => {
// name : "name_41",
// placeholder : "请输入",
// readonly : false,
// required : false,
// required : true,
// tag : "tree",
// unique : false,
// });
// page_form.unshift({
// data_type : "text",
// default : "",
// disabled : false,
// field_id : 1414832,
// field_name : "field_4",
// index : 41,
// interaction_type : "h5edit",
// label : "物品详情",
// name : "name_41",
// placeholder : "请输入",
// readonly : false,
// required : false,
// tag : "group",
// unique : false,
// field_groups: [{
// "tag": "input",
// "name": "input_21",
// "index": 2,
// "label": "物品描述",
// "unique": false,
// "default": "",
// "disabled": false,
// "field_id": 7985071,
// "readonly": false,
// "required": false,
// "data_type": "text",
// "field_name": "field_21",
// "placeholder": "请输入",
// "is_camera_scan": false,
// "camera_scan_type": "",
// "interaction_type": "h5edit",
// "is_edit_camera_scan_result": false,
// "group_field_name" : "field_4",
// },{
// "tag": "name",
// "name": "name_71",
// "index": 7,
// "label": "序列号",
// "unique": false,
// "default": "",
// "disabled": false,
// "field_id": 7995031,
// "readonly": false,
// "required": true,
// "data_type": "text",
// "field_name": "field_91",
// "placeholder": "请输入",
// "interaction_type": "h5edit",
// "group_field_name" : "field_4",
// },]
// });
page_form.unshift({
data_type : "text",
default : "",
disabled : false,
field_id : 1414832,
field_name : "field_4",
index : 41,
interaction_type : "h5edit",
label : "物品详情",
name : "name_41",
placeholder : "请输入",
readonly : false,
required : false,
tag : "group",
unique : false,
field_groups: [{
"tag": "input",
"name": "input_21",
"index": 2,
"label": "物品描述",
"unique": false,
"default": "",
"disabled": false,
"field_id": 7985071,
"readonly": false,
"required": false,
"data_type": "text",
"field_name": "field_10",
"placeholder": "请输入",
"is_camera_scan": false,
"camera_scan_type": "",
"interaction_type": "h5edit",
"is_edit_camera_scan_result": false,
"group_field_name" : "field_4",
},{
"tag": "gender",
"name": "gender_3",
"note": "",
"index": 3,
"label": "性别",
"options": [
{
"title": "男",
"value": "男",
"checked": false,
"desc_url": "",
"is_input": false,
"desc_text": "",
"desc_type": "",
"desc_btn_name": "",
"input_required": false,
"input_placeholder": "请输入补充信息"
},
{
"title": "女",
"value": "女",
"checked": false,
"desc_url": "",
"is_input": false,
"desc_text": "",
"desc_type": "",
"desc_btn_name": "",
"input_required": false,
"input_placeholder": "请输入补充信息"
}
],
"disabled": false,
"field_id": 799603,
"required": false,
"data_type": "text",
"direction": "vertical",
"field_name": "field_4",
"option_map": {
"女": {
"title": "女",
"value": "女",
"checked": false,
"desc_url": "",
"is_input": false,
"desc_text": "",
"desc_type": "",
"desc_btn_name": "",
"input_required": false,
"input_placeholder": "请输入补充信息"
},
"男": {
"title": "男",
"value": "男",
"checked": false,
"desc_url": "",
"is_input": false,
"desc_text": "",
"desc_type": "",
"desc_btn_name": "",
"input_required": false,
"input_placeholder": "请输入补充信息"
}
},
"interaction_type": "h5edit"
},]
});
page_form.push({
"tag": "name",
"name": "name_2",
"index": 2,
"label": "姓名",
"unique": false,
"default": "",
"disabled": false,
"field_id": 799599,
"readonly": false,
"required": true,
"data_type": "text",
"field_name": "field_2",
"placeholder": "请输入",
"interaction_type": "h5edit"
})
formData.value = formatData(page_form);
// TODO：再次提交测试, 需要获取原来表单数据
// formData.value.forEach((item) => {
......@@ -645,6 +711,33 @@ const preValidData = (values) => {
return _.assign(postData.value, rest_data);
}
const onRemove = (value) => { // 处理组件删除事件回调, 数据结构是二维数组，删除时返回被删除的一组数据
value[0].forEach(item => {
for (const key in postData.value) {
if (item.key === key) {
delete postData.value[key]; // 删除对应的键值对
}
}
});
}
const adjGroupData = (values) => { // 调整group组件的数据结构
// let obj = {
// "field_10_group[0]_7653" : "1",
// "field_10_group[1]_4154" : "11",
// "field_11_group[0]_3440" : "2",
// "field_11_group[1]_4282" : "22"
// }
// let arr = [{
// "field_10": "1",
// "field_11": "2",
// }, {
// "field_10": "11",
// "field_11": "22",
// }]
}
const submitStatus = ref(false);
const onSubmit = async (values) => {
......