geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

表单创建页面及只读页面修改，formlist列表跳转修改

Browse Source
This commit is contained in:
GAOANG
2024-04-02 14:18:15 +08:00
parent 6fa16313cc
commit 528e8038bb
6 changed files with 546 additions and 508 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Form/src/componentMap.ts
View File

@ -142,6 +142,16 @@ componentMap.set('ErpApply', ErpApply);
componentMap.set('ErpUpload', ErpUpload); componentMap.set('ErpUpload', ErpUpload);
componentMap.set('ErpCheck', ErpCheck); componentMap.set('ErpCheck', ErpCheck);
componentMap.set('AutoComplete', AutoComplete); componentMap.set('AutoComplete', AutoComplete);
const readonlySupportList = [
"Input",
"AutoCodeRule",
"DatePicker",
"TimePicker",
"Info",
"Text",
'InputTextArea',
'InputNumber'
]
export function add(compName: ComponentType, component: Component) { export function add(compName: ComponentType, component: Component) {
componentMap.set(compName, component); componentMap.set(compName, component);
@ -151,4 +161,10 @@ export function del(compName: ComponentType) {
componentMap.delete(compName); componentMap.delete(compName);
} }
export { componentMap }; export function isreadComponent() {
let str = readonlySupportList.join('|')
const reg = new RegExp(str);
return reg
}
export { componentMap, readonlySupportList };

3
src/components/Form/src/components/Readonly.vue
View File

@ -4,6 +4,7 @@
<script setup> <script setup>
import { ref, watch } from 'vue'; import { ref, watch } from 'vue';
import { readonlySupportList } from '/@/components/Form/src/componentMap';
const props = defineProps({ const props = defineProps({
value: String, value: String,
@ -19,7 +20,7 @@
const schema = props.schema; const schema = props.schema;
const { componentProps, component } = schema; const { componentProps, component } = schema;
if (['Input', 'AutoCodeRule', 'DatePicker', 'InputTextArea', 'InputNumber'].includes(component)) { if (readonlySupportList.includes(component)) {
return `${componentProps?.addonBefore || ''}${val}${componentProps?.addonAfter || ''}`; return `${componentProps?.addonBefore || ''}${val}${componentProps?.addonAfter || ''}`;
} }
if (component === 'Switch') { if (component === 'Switch') {

148
src/components/SimpleForm/src/components/SimpleFormItem.vue
View File

@ -2,68 +2,65 @@
<div> <div>
<!--如果是grid 组件 需要新增grid布局包裹--> <!--如果是grid 组件 需要新增grid布局包裹-->
<template v-if="schema.component.includes('Grid')"> <template v-if="schema.component.includes('Grid')">
<Row v-show="getIsShow(schema)" :align="(schema.componentProps as any ).align" :gutter="(schema.componentProps as any ).gutter ?? 0" :justify="(schema.componentProps as any ).justify" type="flex"> <Row v-show="getIsShow(schema)" :align="(schema.componentProps as any).align"
:gutter="(schema.componentProps as any).gutter ?? 0" :justify="(schema.componentProps as any).justify"
type="flex">
<Col v-for="(col, colIndex) in schema.children" :key="colIndex" :span="col.span"> <Col v-for="(col, colIndex) in schema.children" :key="colIndex" :span="col.span">
<template v-for="childSchema in col.list" :key="childSchema.field"> <template v-for="childSchema in col.list" :key="childSchema.field">
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :label-col="labelCol" :refreshFieldObj="refreshFieldObj" :schema="childSchema" /> <SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
:form-api="formApi" :isWorkFlow="isWorkFlow" :label-col="labelCol"
:refreshFieldObj="refreshFieldObj" :schema="childSchema" />
</template> </template>
</Col> </Col>
</Row> </Row>
</template> </template>
<!--如果是tab 组件 需要新增tab组件包裹--> <!--如果是tab 组件 需要新增tab组件包裹-->
<template v-else-if="schema.component === 'Tab'"> <template v-else-if="schema.component === 'Tab'">
<Tabs v-show="getIsShow(schema)" v-model:activeKey="activeKey" :size="(schema.componentProps as any ).tabSize" :tabPosition="(schema.componentProps as any ).tabPosition" :type="(schema.componentProps as any ).type"> <Tabs v-show="getIsShow(schema)" v-model:activeKey="activeKey"
:size="(schema.componentProps as any).tabSize" :tabPosition="(schema.componentProps as any).tabPosition"
:type="(schema.componentProps as any).type">
<TabPane v-for="(tab, tabIndex) in schema.children" :key="tabIndex" :forceRender="true" :tab="tab.name"> <TabPane v-for="(tab, tabIndex) in schema.children" :key="tabIndex" :forceRender="true" :tab="tab.name">
<template v-for="childSchema in tab.list" :key="childSchema.field"> <template v-for="childSchema in tab.list" :key="childSchema.field">
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" /> <SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
:form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj"
:schema="childSchema" />
</template> </template>
</TabPane> </TabPane>
</Tabs> </Tabs>
</template> </template>
<!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"--> <!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"-->
<template v-else-if="schema.component.includes('Form')"> <template v-else-if="schema.component.includes('Form')">
<FormItem <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
v-if="getShow(schema)" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol"
v-show="getIsShow(schema)" :labelAlign="formProps?.labelAlign" :name="schema.field" :wrapperCol="itemLabelWidthProp.wrapperCol">
:key="schema.key" <component :is="formComponent(schema)" v-model:value="formModel![schema.field]" :disabled="getDisable"
:label="getComponentsProps.showLabel ? schema.label : ''" :size="formProps?.size" v-bind="schema.componentProps" />
:label-col="labelCol"
:labelAlign="formProps?.labelAlign"
:name="schema.field"
:wrapperCol="itemLabelWidthProp.wrapperCol"
>
<component :is="formComponent(schema)" v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="schema.componentProps" />
</FormItem> </FormItem>
</template> </template>
<!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"--> <!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"-->
<template v-else-if="schema.component.includes('OneForOne')"> <template v-else-if="schema.component.includes('OneForOne')">
<FormItem <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
v-if="getShow(schema)" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol"
v-show="getIsShow(schema)" :labelAlign="formProps?.labelAlign" :name="schema.field" :wrapperCol="itemLabelWidthProp.wrapperCol">
:key="schema.key" <component :is="componentMap.get(schema.component)" v-model:value="formModel![schema.field]"
:label="getComponentsProps.showLabel ? schema.label : ''" :disabled="getDisable" :refreshFieldObj="refreshFieldObj" :size="formProps?.size"
:label-col="labelCol" v-bind="schema.componentProps" />
:labelAlign="formProps?.labelAlign"
:name="schema.field"
:wrapperCol="itemLabelWidthProp.wrapperCol"
>
<component :is="componentMap.get(schema.component)" v-model:value="formModel![schema.field]" :disabled="getDisable" :refreshFieldObj="refreshFieldObj" :size="formProps?.size" v-bind="schema.componentProps" />
</FormItem> </FormItem>
</template> </template>
<template v-else-if="schema.component === 'TableLayout'"> <template v-else-if="schema.component === 'TableLayout'">
<TableLayoutPreview v-if="getShow(schema)" v-show="getIsShow(schema)" :element="schema"> <TableLayoutPreview v-if="getShow(schema)" v-show="getIsShow(schema)" :element="schema">
<template #tdElement="{ tdElement }"> <template #tdElement="{ tdElement }">
<div class="h-full"> <div class="h-full">
<div <div :style="{
:style="{
height: tdElement.height ? tdElement.height + 'px' : '', height: tdElement.height ? tdElement.height + 'px' : '',
minHeight: (tdElement.height || '42') + 'px', minHeight: (tdElement.height || '42') + 'px',
overflow: 'hidden', overflow: 'hidden',
padding: '10px' padding: '10px'
}" }">
>
<template v-for="childSchema in tdElement.children" :key="childSchema.field"> <template v-for="childSchema in tdElement.children" :key="childSchema.field">
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" /> <SimpleFormItem v-if="showComponent(childSchema)"
v-model:value="formModel![childSchema.field]" :form-api="formApi"
:isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
</template> </template>
</div> </div>
</div> </div>
@ -72,46 +69,41 @@
</template> </template>
<!--如果是时间区间 组件 需要v-model:startField="表单对象[字段名]" v-model:endField="表单对象[字段名]"--> <!--如果是时间区间 组件 需要v-model:startField="表单对象[字段名]" v-model:endField="表单对象[字段名]"-->
<template v-else-if="schema.component.includes('Range')"> <template v-else-if="schema.component.includes('Range')">
<FormItem <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
v-if="getShow(schema)" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
v-show="getIsShow(schema)" :rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
:key="schema.key" <component :is="componentMap.get(schema.component)" v-model:endField="schema.field.split(',')[1]"
:label="getComponentsProps.showLabel ? schema.label : ''" v-model:startField="schema.field.split(',')[0]" v-model:value="formModel![schema.field]"
:label-col="labelCol" :disabled="getDisable" :size="formProps?.size" v-bind="schema.componentProps" />
:name="schema.field"
:rules="rules"
:validateTrigger="['blur', 'change']"
:wrapperCol="itemLabelWidthProp.wrapperCol"
>
<component
:is="componentMap.get(schema.component)"
v-model:endField="schema.field.split(',')[1]"
v-model:startField="schema.field.split(',')[0]"
v-model:value="formModel![schema.field]"
:disabled="getDisable"
:size="formProps?.size"
v-bind="schema.componentProps"
/>
</FormItem> </FormItem>
<!-- 因为Range会变为 开始时间 和 结束时间 2个属性给与表单数据 所以需要2个隐藏框绑定 starTime 和 endTime --> <!-- 因为Range会变为 开始时间 和 结束时间 2个属性给与表单数据 所以需要2个隐藏框绑定 starTime 和 endTime -->
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :name="schema.field.split(',')[0]"> <FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''"
:name="schema.field.split(',')[0]">
<input type="hidden" /> <input type="hidden" />
</FormItem> </FormItem>
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :name="schema.field.split(',')[1]"> <FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''"
:name="schema.field.split(',')[1]">
<input type="hidden" /> <input type="hidden" />
</FormItem> </FormItem>
</template> </template>
<!--如果checked 或者 switch组件 需要v-model:checked="表单对象[字段名]" "--> <!--如果checked 或者 switch组件 需要v-model:checked="表单对象[字段名]" "-->
<template v-else-if="checkedValueComponents.includes(schema.component)"> <template v-else-if="checkedValueComponents.includes(schema.component)">
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field" :rules="rules" :wrapperCol="itemLabelWidthProp.wrapperCol"> <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]" v-model:checked="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="getComponentsProps" /> :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
:rules="rules" :wrapperCol="itemLabelWidthProp.wrapperCol">
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]"
v-model:checked="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size"
v-bind="getComponentsProps" />
</FormItem> </FormItem>
</template> </template>
<!--如果是card 组件 需要新增card组件包裹--> <!--如果是card 组件 需要新增card组件包裹-->
<template v-else-if="schema.component.includes('Card')"> <template v-else-if="schema.component.includes('Card')">
<CollapseContainer v-show="getIsShow(schema)" :bordered="false" :hasLeftBorder="true" :title="(schema.componentProps as any ).title"> <CollapseContainer v-show="getIsShow(schema)" :bordered="false" :hasLeftBorder="true"
:title="(schema.componentProps as any).title">
<template v-for="childSchema in schema.children![0].list" :key="childSchema.field"> <template v-for="childSchema in schema.children![0].list" :key="childSchema.field">
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" /> <SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
:form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj"
:schema="childSchema" />
</template> </template>
</CollapseContainer> </CollapseContainer>
</template> </template>
@ -123,37 +115,25 @@
</template> </template>
<!--如果是 意见簿 组件 需要使用defaultValue直接赋值 --> <!--如果是 意见簿 组件 需要使用defaultValue直接赋值 -->
<template v-else-if="schema.component.includes('Opinion')"> <template v-else-if="schema.component.includes('Opinion')">
<FormItem <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
v-if="getShow(schema)" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
v-show="getIsShow(schema)" :rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
:key="schema.key" <component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]"
:label="getComponentsProps.showLabel ? schema.label : ''" :disabled="getDisable" :size="formProps?.size" :value="schema.defaultValue"
:label-col="labelCol" v-bind="getComponentsProps" />
:name="schema.field"
:rules="rules"
:validateTrigger="['blur', 'change']"
:wrapperCol="itemLabelWidthProp.wrapperCol"
>
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]" :disabled="getDisable" :size="formProps?.size" :value="schema.defaultValue" v-bind="getComponentsProps" />
</FormItem> </FormItem>
</template> </template>
<template v-else> <template v-else>
<FormItem <FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
v-if="getShow(schema)" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
v-show="getIsShow(schema)" :rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
:key="schema.key" <template v-if="getDisable && readonlySupport(schema.component)">
:label="getComponentsProps.showLabel ? schema.label : ''"
:label-col="labelCol"
:name="schema.field"
:rules="rules"
:validateTrigger="['blur', 'change']"
:wrapperCol="itemLabelWidthProp.wrapperCol"
>
<template v-if="getDisable && /Input|AutoCodeRule|DatePicker/.test(schema.component)">
<readonly :schema="schema" :value="formModel![schema.field]" /> <readonly :schema="schema" :value="formModel![schema.field]" />
</template> </template>
<template v-else> <template v-else>
<component :is="defaultComponent(schema)" :key="refreshFieldObj[schema.field]" v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="getComponentsProps" /> <component :is="defaultComponent(schema)" :key="refreshFieldObj[schema.field]"
v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size"
v-bind="getComponentsProps" />
</template> </template>
</FormItem> </FormItem>
</template> </template>
@ -411,6 +391,10 @@
return props.isWorkFlow ? !noShowWorkFlowComponents.includes(schema.type) : !noShowGenerateComponents.includes(schema.type); return props.isWorkFlow ? !noShowWorkFlowComponents.includes(schema.type) : !noShowGenerateComponents.includes(schema.type);
} }
function readonlySupport(name) {
return /Input|AutoCodeRule|DatePicker|Text|TimePicker|Info/.test(name)
}
function getShow(schema: FormSchema): boolean { function getShow(schema: FormSchema): boolean {
const { show } = schema; const { show } = schema;
let isIfShow = true; let isIfShow = true;

40
src/utils/helper/generatorHelper.ts
View File

@ -523,7 +523,7 @@ export function buildListCode(model: GeneratorConfig): string {
hasBatchDeleteButton || hasTemplatePrint || (hasSetUserIdButton && isSetDataAuth) hasBatchDeleteButton || hasTemplatePrint || (hasSetUserIdButton && isSetDataAuth)
? `:row-selection="{ selectedRowKeys: selectedKeys, onChange: onSelectChange }"` ? `:row-selection="{ selectedRowKeys: selectedKeys, onChange: onSelectChange }"`
: '' : ''
}> } @row-dbClick="dbClickRow">
${ ${
hasFilterButton hasFilterButton
? `<template #customFilterIcon="{ filtered, column }" > ? `<template #customFilterIcon="{ filtered, column }" >
@ -988,6 +988,43 @@ ${hasTemplatePrint ? ' reactive ' : ''}
} }
}); });
function dbClickRow(record) {
if (!record.workflowData.schemaId && !record.workflowData.taskIds) {
${
formType === 'modal'
? `
router.push({
path: '/form/${lowerClassName}/' + record.id + '/viewForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}'
}
});`
: `
openDrawer(true, {
isView: true,
id: record.${camelCaseString(mainTable.pkField)},
});`
}
} else if (record.workflowData.taskIds && record.workflowData.taskIds.length) {
const { processId, taskIds, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0]
}
});
} else {
const { processId, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
readonly: 1,
taskId: ''
}
});
}
}
function buttonClick(code) { function buttonClick(code) {
${ ${
hasTemplatePrint hasTemplatePrint
@ -1682,6 +1719,7 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
systemFormRef.value, systemFormRef.value,
formProps.schemas); //表单事件：加载表单 formProps.schemas); //表单事件：加载表单
} }
emits('form-mounted', formProps);
} catch (error) { } catch (error) {
} }

3
src/views/secondDev/approveFlowPage.vue
View File

@ -173,7 +173,6 @@ function getTaskRecords() {
} }
onMounted(async () => { onMounted(async () => {
if (unref(taskId)) {
try { try {
let res = await getApprovalProcess(unref(taskId), unref(processId)); let res = await getApprovalProcess(unref(taskId), unref(processId));
initProcessData(res); initProcessData(res);
@ -197,8 +196,6 @@ onMounted(async () => {
} }
renderKey.value = Math.random() + ''; renderKey.value = Math.random() + '';
} catch (error) { } } catch (error) { }
} else {
}
}); });
async function submit() { async function submit() {

2
src/views/secondDev/formCreatePage.vue
View File

@ -44,6 +44,7 @@
const tabStore = useMultipleTabStore(); const tabStore = useMultipleTabStore();
const formProps = ref(null); const formProps = ref(null);
console.error(currentRoute.value)
const formId = ref(currentRoute.value?.params?.id); const formId = ref(currentRoute.value?.params?.id);
const { notification } = useMessage(); const { notification } = useMessage();
@ -76,6 +77,7 @@
if (_mode === 'view') { if (_mode === 'view') {
await formRef.value.setDisabledForm(); await formRef.value.setDisabledForm();
} }
// console.error(55555, _formProps)
await formRef.value.setFormDataFromId(formId.value); await formRef.value.setFormDataFromId(formId.value);
} }