hookehuyr

表单页面测试调整

<!--
* @Date: 2022-07-18 10:22:22
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-11-17 16:02:16
* @LastEditTime: 2022-11-18 11:09:09
* @FilePath: /data-table/src/views/index.vue
* @Description: 首页
-->
......@@ -87,221 +87,9 @@ onMounted(async () => {
// required: true,
// },
// },
// {
// key: "field_1",
// value: "test",
// component: "",
// component_props: {
// name: "text",
// label: "用户名",
// placeholder: "请输入用户名",
// required: true,
// readonly: true,
// disabled: true,
// align: "left",
// },
// },
// // {
// // key: 'email',
// // value: '',
// // component: '',
// // component_props: {
// // name: 'email',
// // label: '邮箱',
// // placeholder: '请输入邮箱',
// // required: true,
// // },
// // },
// // {
// // key: 'id_code',
// // value: '',
// // component: '',
// // component_props: {
// // name: 'id_code',
// // label: '身份证号码',
// // placeholder: '请输入身份证号码',
// // required: true,
// // },
// // },
// // {
// // key: 'age',
// // value: '',
// // component: '',
// // component_props: {
// // label: '年龄',
// // placeholder: '请输入年龄',
// // name: 'number',
// // required: true,
// // },
// // },
// // {
// // key: 'gender',
// // value: '',
// // component: '',
// // component_props: {
// // name: 'radio',
// // label: '性别',
// // placeholder: '',
// // direction: 'horizontal',
// // options: [{
// // key: '男',
// // value: '男'
// // }, {
// // key: '女',
// // value: '女'
// // }],
// // required: true,
// // },
// // },
// // {
// // key: 'hobby',
// // value: [],
// // component: '',
// // component_props: {
// // name: 'checkbox',
// // label: '兴趣爱好',
// // placeholder: '',
// // direction: 'horizontal',
// // max: '3',
// // options: [{
// // key: '足球',
// // value: '足球'
// // }, {
// // key: '篮球',
// // value: '篮球'
// // }, {
// // key: '羽毛球',
// // value: '羽毛球'
// // }, {
// // key: '乒乓球',
// // value: '乒乓球'
// // }],
// // },
// // },
// // {
// // key: 'message',
// // value: '一种可以用来记录,展示文字信息的载体,有比较强的时效性。一般以黑板、木板为载体。用来留言。各种各样的留言使用。留言板还有引申的“网络留言板”。这个和网络留言本不一样的地方是留言板一般比较集中的反应信息的。',
// // label: '留言',
// // placeholder: '请输入留言',
// // component: '',
// // component_props: {
// // name: 'textarea',
// // rows: 3,
// // maxlength: null,
// // },
// // },
// // {
// // key: 'vehicle',
// // value: '自行车',
// // label: '交通工具',
// // placeholder: '请选择交通工具',
// // component: '',
// // component_props: {
// // name: 'picker'
// // },
// // options: [
// // { text: '自行车', value: '自行车' },
// // { text: '汽车', value: '汽车' },
// // { text: '地铁', value: '地铁' },
// // ],
// // required: true,
// // },
// // {
// // key: 'sign',
// // value: '',
// // label: '电子签名',
// // placeholder: '',
// // component: '',
// // component_props: {
// // name: 'sign',
// // },
// // required: true,
// // },
// // {
// // key: 'city',
// // value: '天津市/天津市/和平区',
// // city_code: '120101',
// // label: '地址',
// // address: '',
// // placeholder: '请选择省市区',
// // component_props: {
// // name: 'area_picker'
// // },
// // },
// // {
// // key: 'date',
// // value: '2022-10',
// // label: '日期选择',
// // placeholder: '请选择日期',
// // component_props: {
// // name: 'date_picker',
// // title: '请选择',
// // min_date: new Date(),
// // columns_type: ['year', 'month']
// // },
// // },
// // {
// // key: 'time',
// // value: '',
// // label: '时间选择',
// // placeholder: '请选择时间',
// // component_props: {
// // name: 'time_picker',
// // title: '请选择',
// // columns_type: ['hour', 'minute']
// // },
// // required: true,
// // },
// // {
// // key: 'image_src',
// // value: '',
// // label: '图片上传',
// // component_props: {
// // name: 'image_uploader',
// // image_type: ['jpg', 'png'],
// // multiple: false
// // }
// // }
// // {
// // key: 'datetime',
// // value: '2022-06-01 12:00',
// // component_props: {
// // name: 'datetime_picker',
// // title: '请选择',
// // label: '日期时间',
// // placeholder: '请选择日期时间',
// // minDate: new Date(),
// // required: true,
// // },
// // },
// // {
// // key: 'date',
// // value: '',
// // label: '日历选择',
// // placeholder: '请选择日历日期',
// // component: '',
// // component_props: {
// // name: 'calendar',
// // type: 'range', // 日期区间 ['multiple', 'range']
// // minDate: new Date(2022, 0, 1), // 最小日期
// // maxDate: new Date(2023, 0, 31), // 最大日期
// // maxRange: 5, // 最大可选天数
// // },
// // required: false,
// // },
// // {
// // key: 'rate',
// // value: '',
// // label: '评分',
// // placeholder: '请选择评分',
// // component_props: {
// // name: 'rate_picker',
// // count: 10
// // },
// // required: true,
// // }
// ];
// 生成自定义组件
// createComponentType(mockData.value);
createComponentType(formData.value);
});
......@@ -309,22 +97,22 @@ const sign = ref(null);
const rate_picker = ref(null);
const onSubmit = async (values) => {
console.warn(values);
// 合并自定义字段到提交表单字段
postData.value = _.assign(postData.value, values);
// console.warn(mockData.value);
// 检查非表单输入项
if (validOther()) {
// 通过验证
const result = await addFormDataAPI({
form_code: $route.query.code,
data: JSON.stringify(postData.value),
});
console.warn(result);
// const result = await addFormDataAPI({
// form_code: $route.query.code,
// data: JSON.stringify(postData.value),
// });
// console.warn(result);
// if (code) {
// console.warn("提交成功");
// console.warn(data);
// }
// console.warn("通过验证");
console.warn("通过验证");
} else {
console.warn("不通过验证");
}
......