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

docs: 二开自动拆分脚本支持明细表

Browse Source
This commit is contained in:
gaoyunqi
2024-06-13 18:42:34 +08:00
parent 1ed4b6f5d4
commit a9d3fe6943
3 changed files with 220 additions and 409 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
dev_tools/template_extend.js
View File

@ -1,6 +1,10 @@
const fs = require('fs');
const path = require('path');
const filePath = path.join(process.cwd(), 'config.ts');
const argv = process.argv;
const fixResponsive = argv.indexOf('fix-responsive') > 0;
const templates = require('./templates');
if (fs.existsSync(filePath)) {
console.log('Reading ' + filePath);
const file = fs.readFileSync(filePath, 'utf-8');
@ -31,7 +35,10 @@ if (fs.existsSync(filePath)) {
let tmpl = '';
let tabCount = 0;
let tableCount = 0;
const refList = [];
const importList = [];
const components = [];
// 用于将config的表单格式展开成字段，以便二开
formProps.schemas.forEach((prop) => {
@ -41,6 +48,7 @@ formProps.schemas.forEach((prop) => {
function appendTmpl(prop) {
let schema = `schemaMap['${prop.key}']`;
// 栅格布局
tmpl += `<!-- ${prop.label || prop.field || prop.component} -->\n`;
if (prop.component == 'Grid') {
prop.children.forEach((child) => {
child.list.forEach((listChild) => {
@ -54,9 +62,10 @@ function appendTmpl(prop) {
appendTableLayoutTmpl(prop);
} else if (prop.component == 'Card') {
appendCardTmpl(prop);
} else if (prop.component == 'SubForm') {
return appendSubFormTmpl(prop);
}
tmpl += `
<!-- ${prop.label || prop.field || prop.component} -->
<Col v-if="getIfShow2('${prop.key}')" v-show="getIsShow2('${prop.key}')" :span="getColWidth(${schema})">
<template v-if="showComponent(${schema})">
<SimpleFormItem v-model:value="formModel[${schema}.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="${schema}" />
@ -65,6 +74,34 @@ function appendTmpl(prop) {
`;
}
function appendSubFormTmpl(prop){
let schema = `schemaMap['${prop.key}']`;
tableCount += 1;
createSubFormFile();
tmpl += `
<Col v-if="getIfShow2('${prop.key}')" v-show="getIsShow2('${prop.key}')" :span="getColWidth(${schema})">
<template v-if="showComponent(${schema})">
<CustomDevTableItem${tableCount} v-model:value="formModel[${schema}.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="${schema}" />
</template>
</Col>
`
importList.push(`import CustomDevTableItem${tableCount} from './CustomDevTableItem${tableCount}.vue';`);
components.push(`CustomDevTableItem${tableCount}`);
}
function createSubFormFile(){
const subFormStr = templates.subFormTmpl;
fs.writeFile(`./CustomDevSubForm${tableCount}.vue`, subFormStr, (err) => {
if (err) throw err;
console.log(`Write SubForm CustomDevSubForm${tabCount}.vue success`);
});
const formItemStr = templates.subFormItem.replace('[count]', tableCount);
fs.writeFile(`./CustomDevTableItem${tableCount}.vue`, formItemStr, (err) => {
if (err) throw err;
console.log(`Write FormItem CustomDevTableItem${tabCount}.vue success`);
});
}
function appendTabTmpl(prop) {
let schema = `schemaMap['${prop.key}']`;
tabCount += 1;
@ -82,28 +119,28 @@ function appendTabTmpl(prop) {
function appendTableLayoutTmpl(prop) {
let schema = `schemaMap['${prop.key}']`;
tmpl += `<TableLayoutPreview :element="${schema}">`;
tmpl += ` <template #tdElement="{ tdElement }">`;
tmpl += ` <div class="h-full">`;
tmpl += `<div style="getTdStyle(tdElement)">`;
prop.children.forEach((child) => {
let childSchema = `schemaMap['${child.key}']`;
tmpl += `<SimpleFormItem v-if="getIfShow2(${childSchema})" v-show="getIsShow2(${childSchema})" v-model:value="formModel[${childSchema}.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="${childSchema}" />`;
tmpl += `<TableLayoutPreview :element="${schema}">\n`;
tmpl += ` <template #tdElement="{ tdElement }">\n`;
tmpl += ` <div class="h-full">\n`;
tmpl += `<div :style="getTdStyle(tdElement)">\n`;
prop.children[0].list.forEach((lChild) => {
lChild.children.forEach((child) => {
appendTmpl(child);
});
});
tmpl += `</div>`;
tmpl += ` </div>`;
tmpl += ` </template>`;
tmpl += `</TableLayoutPreview>`;
tmpl += `</div>\n`;
tmpl += ` </div>\n`;
tmpl += ` </template>\n`;
tmpl += `</TableLayoutPreview>\n`;
}
function appendCardTmpl(prop) {
let schema = `schemaMap['${prop.key}']`;
tmpl += `<CollapseContainer :bordered="false" :hasLeftBorder="true" title="${prop.componentProps.title}">`;
tmpl += `<CollapseContainer :bordered="false" :hasLeftBorder="true" title="${prop.componentProps.title}">\n`;
prop.children[0].list.forEach((lChild) => {
const childSchema = `schemaMap['${lChild.key}']`;
tmpl += ` <SimpleFormItem v-model:value="formModel[${childSchema}.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="${childSchema}" />`;
appendTmpl(lChild);
});
tmpl += `</CollapseContainer>`;
tmpl += `</CollapseContainer>\n`;
}
const fullVue = `
@ -132,11 +169,20 @@ const fullVue = `
import SimpleFormItem from '/@/components/SimpleForm/src/components/SimpleFormItem.vue';
import { ref } from 'vue';
import { CheckCircleOutlined } from '@ant-design/icons-vue';
${importList.join('\n')}
const FormItem = Form.Item;
export default {
components: { CheckCircleOutlined, Form, Col, SimpleFormItem, Row, FormItem },
components: {
CheckCircleOutlined,
Form,
Col,
SimpleFormItem,
Row,
FormItem,
${components.join('\n')}
},
mixins: [SimpleFormSetup],
setup(props, ctx) {
const ret = SimpleFormSetup.setup(props, ctx);
@ -200,7 +246,7 @@ const fullVue = `
</script>
`;
fs.writeFile('./template.vue', fullVue, (err) => {
fs.writeFile('./CustomDevForm.vue', fullVue, (err) => {
if (err) throw err;
console.log('The file has been saved!');
});