HC_YFZX
/
CaiYuanYiTiHua
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua

dianlixunjian
徐景良 2024-06-24 18:02:45 +08:00
parent def981873a 8364b57559
commit bb5d095900
6 changed files with 152 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Form/src/BasicForm.vue
View File

@ -131,6 +131,9 @@
componentProps = {},
isHandleDateDefaultValue = true,
} = schema;
// if (component == 'Transfer') {
// formModel[schema.field] = schema.componentProps.targetKeys;
// }
// handle date type
if (
isHandleDateDefaultValue &&
@ -272,6 +275,9 @@
}
function setFormModel(key: string, value: any, schema: FormSchema) {
if (schema.component == 'Transfer') {
schema.componentProps.targetKeys = value;
}
formModel[key] = value;
emit('field-value-change', key, value);
// TODO 优化验证，这里如果是autoLink=false手动关联的情况下才会再次触发此函数

58
src/views/demo/form-design/components/VFormItem/index.vue
View File

@ -53,19 +53,19 @@
</template>
{{ schema.label }}
</a-button>
<div v-else-if="['CreateUser','ModifyUser'].includes(schema.component)">
<div v-else-if="['CreateUser', 'ModifyUser'].includes(schema.component)">
<a-input v-model:value="loginUserName" readOnly>
<template #prefix>
<user-outlined />
</template>
</a-input>
<template #prefix>
<user-outlined />
</template>
</a-input>
</div>
<div v-else-if="['CreateTime','ModifyTime'].includes(schema.component)">
<div v-else-if="['CreateTime', 'ModifyTime'].includes(schema.component)">
<a-input v-model:value="nowTime" readOnly>
<template #prefix>
<user-outlined />
</template>
</a-input>
<template #prefix>
<user-outlined />
</template>
</a-input>
</div>
<div v-else-if="schema.component == 'Select'">
<a-select
@ -74,8 +74,9 @@
:mode="schema.componentProps.mode"
:showSearch="schema.componentProps.showSearch"
:disabled="schema.componentProps.disabled"
:options="selectUseOptions? schema.componentProps.options: showSelectDictionaryList"
:defaultValue="schema.defaultValue">
:options="selectUseOptions ? schema.componentProps.options : showSelectDictionaryList"
:defaultValue="schema.defaultValue"
>
</a-select>
</div>
<a-transfer
@ -93,7 +94,6 @@
:showSelectAll="schema.componentProps.showSelectAll"
@change="transferChange"
@search="transferSearch"
@selectChange="transferSelectChange"
@click="handleClick(schema)"
/>
<component
@ -122,9 +122,9 @@
import { Tooltip, FormItem, Divider, Col } from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import { useFormModelState } from '../../hooks/useFormDesignState';
import { UserOutlined } from '@ant-design/icons-vue'
import { UserOutlined } from '@ant-design/icons-vue';
import dayjs from 'dayjs';
import { useOnlineFormDesignStore } from '@/store/modules/onlineFormDesign'
import { useOnlineFormDesignStore } from '@/store/modules/onlineFormDesign';
export default defineComponent({
name: 'VFormItem',
@ -155,22 +155,24 @@
const state = reactive({
componentMap,
loginUserName: localStorage.getItem('fireUserLoginName'),
nowTime: dayjs().format('YYYY-MM-DD HH:mm:ss')
nowTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
});
const onlineFormDesignStore = useOnlineFormDesignStore()
const onlineFormDesignStore = useOnlineFormDesignStore();
const { formModel: formData1, setFormModel } = useFormModelState();
const colPropsComputed = computed(() => {
const { colProps = {} } = props.schema;
return colProps;
});
const selectUseOptions = computed(() => {
if(props.schema.dataType === undefined || props.schema.dataType === '1'){
return true
}else{
return false
if (props.schema.dataType === undefined || props.schema.dataType === '1') {
return true;
} else {
return false;
}
})
const showSelectDictionaryList = computed(() => onlineFormDesignStore.getSelectOption(props.schema.field))
});
const showSelectDictionaryList = computed(() =>
onlineFormDesignStore.getSelectOption(props.schema.field),
);
const formItemProps = computed(() => {
const { formConfig } = unref(props);
let { field, required, rules, labelCol, wrapperCol } = unref(props.schema);
@ -283,10 +285,10 @@
};
// 穿梭框-查找
const transferSearch = (dir: string, value: string) => {};
// 穿梭框-选中
const transferSelectChange = (sourceSelectedKeys: string[], targetSelectedKeys: string[]) => {
props.schema.componentProps.selectedKeys = sourceSelectedKeys.concat(targetSelectedKeys);
};
// // 穿梭框-选中
// const transferSelectChange = (sourceSelectedKeys: string[], targetSelectedKeys: string[]) => {
// props.schema.componentProps.selectedKeys = sourceSelectedKeys.concat(targetSelectedKeys);
// };
return {
...toRefs(state),
componentItem,
@ -300,7 +302,7 @@
showSelectDictionaryList,
transferChange,
transferSearch,
transferSelectChange,
// transferSelectChange,
};
},
});

2
src/views/demo/form-design/core/formItemConfig.ts
View File

@ -387,7 +387,7 @@ export const commonComponents: IVFormComponent[] = [
},
],
targetKeys: [],
selectedKeys: [],
// selectedKeys: [],
},
},
];

73
src/views/demo/onlineform/formCall/CallModal.vue
View File

@ -32,7 +32,12 @@
</template>
</BasicForm>
<template v-for="(item, useIndex) in createOrModifyList[index]" :key="useIndex">
<CreateOrModifyComponent :data="item" :createOrModifyData="createOrModifyData" :isUpdate="isUpdate" :isDetail="isDetail"/>
<CreateOrModifyComponent
:data="item"
:createOrModifyData="createOrModifyData"
:isUpdate="isUpdate"
:isDetail="isDetail"
/>
</template>
</a-tab-pane>
</a-tabs>
@ -120,7 +125,7 @@
<!-- todo 创建/修改 人/时间 -->
<template v-if="!(tabsColumns.length > 1)">
<template v-for="(item, index) in createOrModifyList" :key="index">
<CreateOrModifyComponent :data="item" :createOrModifyData="createOrModifyData"/>
<CreateOrModifyComponent :data="item" :createOrModifyData="createOrModifyData" />
</template>
</template>
</BasicModal>
@ -176,7 +181,7 @@
const scrollValue = ref();
const cardLayout = ref([]);
const createOrModifyList = ref([]);
const createOrModifyData = ref({})
const createOrModifyData = ref({});
// 按钮
const buttonLayout = ref([]);
// 脚本
@ -224,9 +229,9 @@
const arr: FormSchema[] = [];
data.tab.forEach((item) => {
if (item.field == 'Tabs') {
let arrayLength = item.componentProps.options.length
for(let i = 0; i < arrayLength; i++){
createOrModifyList.value.push([])
let arrayLength = item.componentProps.options.length;
for (let i = 0; i < arrayLength; i++) {
createOrModifyList.value.push([]);
}
item.componentProps.options.forEach((val, index) => {
val.children.forEach((opt) => {
@ -255,6 +260,12 @@
if (['createuser', 'createtime', 'modifyuser', 'modifytime'].includes(opt.type)) {
createOrModifyList.value[index].push(opt);
}
if (opt.component === 'Transfer') {
opt.componentProps.render = (item) => `${item.title} ${item.description}`;
opt.componentProps.targetKeys = JSON.parse(
data.record[item.field]?.replace(/\r\n/g, ''),
);
}
subTableColumns.value = [
{
dataIndex: 'setting',
@ -370,6 +381,12 @@
if (['createuser', 'createtime', 'modifyuser', 'modifytime'].includes(item.type)) {
createOrModifyList.value.push(item);
}
if (item.component === 'Transfer') {
item.componentProps.render = (item) => `${item.title} ${item.description}`;
item.componentProps.targetKeys = JSON.parse(
data.record[item.field]?.replace(/\r\n/g, ''),
);
}
subTableColumns.value = [
{
dataIndex: 'setting',
@ -414,11 +431,11 @@
}
if (unref(isUpdate) && !unref(isDetail)) {
getTitle.value = '编辑';
Object.keys(data.infoUseMainTableData).forEach(itemKey => {
if(itemKey.indexOf('_time_') !== -1 || itemKey.indexOf('_user_') !== -1){
createOrModifyData.value[itemKey] = data.infoUseMainTableData[itemKey]
}
})
Object.keys(data.infoUseMainTableData).forEach((itemKey) => {
if (itemKey.indexOf('_time_') !== -1 || itemKey.indexOf('_user_') !== -1) {
createOrModifyData.value[itemKey] = data.infoUseMainTableData[itemKey];
}
});
data.btnList.forEach((element) => {
if (element.prop === 'Edit' && element.isWFlow) {
flowCode.value = element.wFlowCode;
@ -447,11 +464,11 @@
}
if (!unref(isUpdate) && unref(isDetail)) {
getTitle.value = '详情';
Object.keys(data.infoUseMainTableData).forEach(itemKey => {
if(itemKey.indexOf('_time_') !== -1 || itemKey.indexOf('_user_') !== -1){
createOrModifyData.value[itemKey] = data.infoUseMainTableData[itemKey]
}
})
Object.keys(data.infoUseMainTableData).forEach((itemKey) => {
if (itemKey.indexOf('_time_') !== -1 || itemKey.indexOf('_user_') !== -1) {
createOrModifyData.value[itemKey] = data.infoUseMainTableData[itemKey];
}
});
let isTabs = false;
data.tab = changeCardStructure(data.tab);
data.tab.forEach((itemComponent) => {
@ -563,7 +580,7 @@
updateSchema(columns);
resetFields();
}, 100);
if(!isDetail.value){
if (!isDetail.value) {
const obj = await validate();
setTimeout(() => {
setFieldsValue(obj);
@ -609,21 +626,25 @@
try {
let values = await validate();
// 将老创建人创建时间赋值
values = {...values, ...createOrModifyData.value}
values = { ...values, ...createOrModifyData.value };
// 添加校验后脚本
let cardValueList = Object.values(cardValues.value);
cardValueList.forEach((item) => {
values = { ...values, ...item };
});
Object.keys(values).forEach(itemKey => {
if(!isUpdate.value){
if(itemKey.indexOf('_time_') !== -1) values[itemKey] = dayjs().format('YYYY-MM-DD HH:mm:ss')
if(itemKey.indexOf('_user_') !== -1) values[itemKey] = localStorage.getItem('fireUserLoginName')
}else{
if(itemKey.indexOf('_modify_time') !== -1) values[itemKey] = dayjs().format('YYYY-MM-DD HH:mm:ss')
if(itemKey.indexOf('_modify_user') !== -1) values[itemKey] = localStorage.getItem('fireUserLoginName')
Object.keys(values).forEach((itemKey) => {
if (!isUpdate.value) {
if (itemKey.indexOf('_time_') !== -1)
values[itemKey] = dayjs().format('YYYY-MM-DD HH:mm:ss');
if (itemKey.indexOf('_user_') !== -1)
values[itemKey] = localStorage.getItem('fireUserLoginName');
} else {
if (itemKey.indexOf('_modify_time') !== -1)
values[itemKey] = dayjs().format('YYYY-MM-DD HH:mm:ss');
if (itemKey.indexOf('_modify_user') !== -1)
values[itemKey] = localStorage.getItem('fireUserLoginName');
}
})
});
codeClickFunction('afterValidateForm', afterValidateForm.value);
console.log('values', values);
let query = values;

97
src/views/demo/onlineform/formCall/index.vue
View File

@ -29,7 +29,11 @@
</div>
</template>
<template #bodyCell="{ column, record }">
<template v-if="['树形选择', '级联选择', '复选框-组'].includes(column.title)">
<template
v-if="
['TreeSelect', 'Cascader', 'CheckboxGroup', 'Transfer'].includes(column.component)
"
>
{{ dataModification(column, record) }}
</template>
</template>
@ -86,7 +90,13 @@
<InfoCallModal :data="infoCallModalData" />
</div>
</a-modal>
<a-modal v-model:open="importOpen" title="导入" :footer="null" @cancel="importOpen = false" :destroyOnClose="true">
<a-modal
v-model:open="importOpen"
title="导入"
:footer="null"
@cancel="importOpen = false"
:destroyOnClose="true"
>
<ImportModal v-model:open="importOpen" :paramsId="paramsId" :pkey="pkey" />
</a-modal>
@ -136,7 +146,7 @@
import { v4 as uuidv4 } from 'uuid';
import { changeCardStructure, cardNestStructure } from '@/views/demo/onlineform/util.ts';
import { useFormCallStore } from '@/store/modules/formCall.ts';
import ImportModal from './ImportModal/index.vue'
import ImportModal from './ImportModal/index.vue';
const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
const mapFormShow = ref<boolean>(false);
const mapFormData = ref<Object>({});
@ -152,8 +162,8 @@
const mapSetData = ref({
width: 100,
});
const importOpen = ref (false)
const pkey = ref("")
const importOpen = ref(false);
const pkey = ref('');
const infoCallModalOpen = ref(false);
const infoCallModalData = ref({});
const selectedSubTableDataId = ref('');
@ -607,7 +617,7 @@
}
break;
case 'Import':
importOpen.value = true
importOpen.value = true;
break;
case 'Export':
let params = exportParams.value;
@ -753,7 +763,7 @@
getFormsDesignData(params).then((res: Recordable) => {
let columnObj = JSON.parse(res.entity.scheme);
let formObj = JSON.parse(res.formScheme.scheme);
pkey.value = formObj.primaryKey
pkey.value = formObj.primaryKey;
console.log('formObj', formObj);
console.log('columnObj', columnObj);
if (formObj.formInfo.tabList && formObj.formInfo.tabList.length > 0) {
@ -818,36 +828,33 @@
callColumns.push({
title: item.label,
dataIndex: item.key,
// 用于表单列表数据修饰
component: item.component,
});
});
}
if (columnObj.table.querys) {
columnObj.table.querys.forEach((item) => {
// if (item.options) {
// searchFormSchema.push({
// field: item.key,
// component: item.type || 'Input',
// label: item.label,
// colProps: { span: 6 },
// componentProps: {
// options: item.options,
// },
// });
// } else {
// searchFormSchema.push({
// field: item.key,
// component: item.type || 'Input',
// label: item.label,
// colProps: { span: 6 },
// });
// }
searchFormSchema.push({
field: item.key,
component: item.type,
label: item.label,
colProps: ['Transfer'].includes(item.type) ? { span: 12 } : { span: 6 },
componentProps: item.componentProps || { options: item.options },
});
if (['Transfer'].includes(item.type)) {
searchFormSchema.push({
field: item.key,
component: item.type,
label: item.label,
colProps: { span: 12 },
componentProps: {
render: (item) => `${item.title} ${item.description}`,
...item.componentProps,
} || { options: item.options },
});
} else {
searchFormSchema.push({
field: item.key,
component: item.type,
label: item.label,
colProps: { span: 6 },
componentProps: item.componentProps || { options: item.options },
});
}
});
}
callColumns.forEach((item) => {
@ -1016,13 +1023,13 @@
// 表单列表数据修饰
const dataModification = (column, record) => {
let res: any = '';
if (column.title == '树形选择') {
if (column.component == 'TreeSelect') {
searchFormSchema?.forEach((item: any) => {
if (item.component && item.component == 'TreeSelect') {
res = getTreeSelectLabel(res, item.componentProps.treeData, record[column.dataIndex]);
}
});
} else if (column.title == '级联选择') {
} else if (column.component == 'Cascader') {
searchFormSchema?.forEach((item: any) => {
if (item.component && item.component == 'Cascader') {
// 转成数组
@ -1043,7 +1050,7 @@
});
}
});
} else if (column.title == '复选框-组') {
} else if (column.component == 'CheckboxGroup') {
searchFormSchema?.forEach((item: any) => {
if (item.component && item.component == 'CheckboxGroup') {
item.componentProps.options?.forEach((op) => {
@ -1063,8 +1070,26 @@
});
}
});
} else if (column.component == 'Transfer') {
searchFormSchema?.forEach((item: any) => {
if (item.component && item.component == 'Transfer') {
item.componentProps.dataSource?.forEach((ds) => {
// 转成数组
let TransferData = JSON.parse(record[column.dataIndex]?.replace(/\r\n/g, '') || '[]');
TransferData?.forEach((TransferData_item, index) => {
if (ds.key == TransferData_item) {
if (index == 0) {
res = ds.title + ' ' + ds.description;
} else {
res = res + ' | ' + ds.title + ' ' + ds.description;
}
}
});
});
}
});
} else {
// console.log(1012);
// console.log(1080);
// console.log(column);
// console.log(record);
// console.log(searchFormSchema);

13
src/views/demo/onlineform/formModule/modalDesign.vue
View File

@ -219,13 +219,13 @@
const arr: any = [];
formScheme.value.formInfo.tabList.forEach((item, index) => {
item.schemas.forEach((val) => {
if (val.columns && (val.component === "Grid" && val.type === "subTable")) {
if (val.columns && val.component === 'Grid' && val.type === 'subTable') {
val.columns.forEach((col) => {
col.children.forEach((chil) => {
arr.push(chil);
});
});
}else if(val.component && val.component !== "Grid"){
} else if (val.component && val.component !== 'Grid') {
arr.push(val);
}
});
@ -235,14 +235,14 @@
if (formScheme.value.formInfo.tabList && formScheme.value.formInfo.tabList.length == 1) {
const arr: any = [];
formScheme.value.formInfo.tabList[0].schemas.forEach((item) => {
if (item.columns && (item.component === "Grid" && item.type === "subTable")) {
if (item.columns && item.component === 'Grid' && item.type === 'subTable') {
item.columns.forEach((col) => {
col.children.forEach((chil) => {
arr.push(chil);
});
});
}else if(item.component && item.component !== "Grid"){
arr.push(item)
} else if (item.component && item.component !== 'Grid') {
arr.push(item);
}
});
formScheme.value.formInfo.schemas = arr;
@ -269,6 +269,7 @@
width: 120,
align: 'left',
isMinWidth: false,
component: t.component,
};
columnsTree.value[0].children.push(temp);
});
@ -424,4 +425,4 @@
defineExpose({
config,
});
</script>
</script>