herenshan112
/
ShutongInterconnectedChemicalCloudPlatform
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修复紧急BUG完成

qin_v9
hreenshan112 12 months ago
parent
1c44ea0c01
commit
3ec5e1f0cd
15 changed files with 10734 additions and 9637 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 287
      src/components/DesignForm/aceDrawer.vue
  2. 61
      src/components/DesignForm/app/index.vue
  3. 4225
      src/components/DesignForm/formControlPropertiNew.vue
  4. 50
      src/components/DesignForm/public/expand/cascader.vue
  5. 6
      src/components/DesignForm/public/form/calculate/cssInfo.ts
  6. 580
      src/components/DesignForm/public/form/formGroup.vue
  7. 1012
      src/components/DesignForm/public/form/formItem.vue
  8. 1011
      src/components/DesignForm/tableListPage/index.vue
  9. 45
      src/components/IconSelect/appMenuSvgPage.vue
  10. 190
      src/views/sysworkflow/codepage/index.vue
  11. 363
      src/views/sysworkflow/lowcodepage/appCardPage.vue
  12. 668
      src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
  13. 241
      src/views/sysworkflow/lowcodepage/newLowCode/appLayoutEdit/appContainerPage.vue
  14. 4
      src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue
  15. 194
      src/widget/number/index.vue

287
src/components/DesignForm/aceDrawer.vue
View File

@ -3,90 +3,123 @@
@ 时间: 2023-07-19 08:39:34 @ 时间: 2023-07-19 08:39:34
@ 备注: 抽屉 @ 备注: 抽屉
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { ref, nextTick, watch, onMounted, onUnmounted } from 'vue' import { ref, nextTick, watch, onMounted, onUnmounted } from "vue";
import { aceEdit } from '@/api/DesignForm/utils' import { aceEdit } from "@/api/DesignForm/utils";
import { treeStruct } from '@/api/DesignForm/type' import { treeStruct } from "@/api/DesignForm/type";
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
data?:object data?: object;
modelValue: boolean modelValue: boolean;
// eslint-disable-next-line vue/require-default-prop // eslint-disable-next-line vue/require-default-prop
title?: string title?: string;
direction?: 'rtl' | 'ltr' direction?: "rtl" | "ltr";
content: string content: string;
id?: string id?: string;
// eslint-disable-next-line vue/require-default-prop // eslint-disable-next-line vue/require-default-prop
codeType?: string codeType?: string;
data?: object data?: object;
}>(), }>(),
{ {
id: 'editJson', id: "editJson",
content: '', content: "",
direction: 'ltr' direction: "ltr",
} }
) );
const emits = defineEmits<{ const emits = defineEmits<{
(e: 'beforeClose'): void (e: "beforeClose"): void;
(e: 'confirm', content: string): void (e: "confirm", content: string): void;
(e: 'confirmTree', content: string): void (e: "confirmTree", content: string): void;
(e: 'update:modelValue', val: boolean): void (e: "update:modelValue", val: boolean): void;
}>() }>();
const editor = ref<any>({}) const editor = ref<any>({});
const visible = ref(false) const visible = ref(false);
const treeSelectAry = reactive<treeStruct[]>([]) //树形数据 // const treeSelectAry = ref<treeStruct[]>(props.data.content ? props.data.content : []); //树形数据
const editTitleFormRef = ref(ElForm); //编辑表单 const editTitleFormRef = ref(ElForm); //编辑表单
const editTitleInfoRef = ref(ElForm); const editTitleInfoRef = ref(ElForm);
let jibuqi = 0 //计步器计算最大值 let jibuqi = 0; //计步器计算最大值
const isTopHeader = ref(false) //是否为添加顶级树脂 const isTopHeader = ref(false); //是否为添加顶级树脂
const guodu = ref<treeStruct>({}) //数据中转使用 const guodu = ref<treeStruct>({}); //数据中转使用
const addIsShow = ref(false) //添加数据 const addIsShow = ref(false); //添加数据
const treeSelectTitle = reactive<treeStruct>({ const treeSelectTitle = reactive<treeStruct>({
value: "1", value: "1",
label: "" label: "",
}) //编辑表格结构及数据 }); //编辑表格结构及数据
const butLoad = ref(false) //按钮状态 const butLoad = ref(false); //按钮状态
/** /**
* 表单验证规则 * 表单验证规则
*/ */
const editTitleRules = reactive({ const editTitleRules = reactive({
label: [{ required: true, message: "请输入名称", trigger: "blur" }], label: [{ required: true, message: "请输入名称", trigger: "blur" }],
}); });
const treeSelectAry = computed({
get() {
return props.data.content ? props.data.content : [];
},
set(val: treeStruct[]) {
// emits("confirmTree", val);
return val;
},
});
/**
@ 作者: 秦东
@ 时间: 2024-12-02 11:22:18
@ 功能: 递归查数
*/
const jiShuDiGui = (val: []) => {
if (!Array.isArray(val)) return (jibuqi = 0);
val.forEach((item: any) => {
jibuqi++;
console.log("递归查数", jibuqi);
if (item.children && item.children.length > 0) {
jiShuDiGui(item.children);
}
});
};
watch(
() => visible,
(val: booble) => {
jiShuDiGui(props.data.content);
},
{ deep: true }
);
watch( watch(
() => props.modelValue, () => props.modelValue,
(val: boolean) => { (val: boolean) => {
visible.value = val visible.value = val;
if (val) { if (val) {
initEditor() initEditor();
} }
} }
) );
const initEditor = () => { const initEditor = () => {
nextTick(() => { nextTick(() => {
editor.value = aceEdit(props.content, props.id, props.codeType) editor.value = aceEdit(props.content, props.id, props.codeType);
}) });
} };
const dialogConfirm = () => { const dialogConfirm = () => {
const editVal = editor.value.getValue() const editVal = editor.value.getValue();
emits('confirm', editVal) emits("confirm", editVal);
} };
const drawerBeforeClose = () => { const drawerBeforeClose = () => {
emits('update:modelValue', false) emits("update:modelValue", false);
emits('beforeClose') emits("beforeClose");
treeSelectAry=[] treeSelectAry.value = [];
} };
onMounted(() => {}) onMounted(() => {});
onUnmounted(() => { onUnmounted(() => {
if (Object.keys(editor.value).length !== 0) { if (Object.keys(editor.value).length !== 0) {
editor.value.destroy() editor.value.destroy();
editor.value.container.remove() editor.value.container.remove();
} }
}) });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ -94,78 +127,77 @@ onUnmounted(() => {
@ 功能: 打开添加弹窗 @ 功能: 打开添加弹窗
*/ */
const pickAdd = (val: treeStruct) => { const pickAdd = (val: treeStruct) => {
guodu.value = val guodu.value = val;
isTopHeader.value = false isTopHeader.value = false;
addIsShow.value = true addIsShow.value = true;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 16:06:41 @ 时间: 2024-09-27 16:06:41
@ 功能: 关闭弹窗 @ 功能: 关闭弹窗
*/ */
const pickAddClose = () => { const pickAddClose = () => {
guodu.value = {} guodu.value = {};
treeSelectTitle.label = "" treeSelectTitle.label = "";
addIsShow.value = false addIsShow.value = false;
butLoad.value = false butLoad.value = false;
editTitleFormRef.value.resetFields(); editTitleFormRef.value.resetFields();
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 16:09:53 @ 时间: 2024-09-27 16:09:53
@ 功能: 添加顶级分类 @ 功能: 添加顶级分类
*/ */
const addTopClass = () => { const addTopClass = () => {
isTopHeader.value = true isTopHeader.value = true;
addIsShow.value = true addIsShow.value = true;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 16:10:27 @ 时间: 2024-09-27 16:10:27
@ 功能: 确定添加分类 @ 功能: 确定添加分类
*/ */
const pickIsTrue = () => { const pickIsTrue = () => {
butLoad.value = true butLoad.value = true;
editTitleFormRef.value.validate((isValid: boolean) => { editTitleFormRef.value.validate((isValid: boolean) => {
if (isValid) { if (isValid) {
jibuqi++ jibuqi++;
if (isTopHeader.value) { if (isTopHeader.value) {
treeSelectAry.push({ treeSelectAry.value.push({
value: jibuqi, value: jibuqi,
label: treeSelectTitle.label, label: treeSelectTitle.label,
children: [] children: [],
}) });
} else { } else {
if (guodu.value.children) { if (guodu.value.children) {
guodu.value.children.push({ guodu.value.children.push({
value: jibuqi, value: jibuqi,
label: treeSelectTitle.label, label: treeSelectTitle.label,
children: [] children: [],
}) });
} else { } else {
guodu.value.children = [ guodu.value.children = [
{ {
value: jibuqi, value: jibuqi,
label: treeSelectTitle.label, label: treeSelectTitle.label,
children: [] children: [],
} },
] ];
} }
} }
pickAddClose() pickAddClose();
} else { } else {
butLoad.value = false butLoad.value = false;
}
})
} }
});
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 08:38:35 @ 时间: 2024-09-27 08:38:35
@ 功能: 回填主表值 @ 功能: 回填主表值
*/ */
const dialogConfirmTree = () => { const dialogConfirmTree = () => {
// let drawer = ({ // let drawer = ({
// visible: false, // visible: false,
// type: '', // type: '',
@ -184,19 +216,20 @@ const dialogConfirmTree = () => {
// }) // })
// emits('confirm', treeSelectAry) // emits('confirm', treeSelectAry)
emits('confirmTree', treeSelectAry) console.log("回填主表值", treeSelectAry.value);
drawerBeforeClose() emits("confirmTree", treeSelectAry.value, props.data.type);
} drawerBeforeClose();
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 13:51:31 @ 时间: 2024-09-27 13:51:31
@ 功能: 删除指定节点数据 @ 功能: 删除指定节点数据
*/ */
const pickDel = (val: treeStruct) => { const pickDel = (val: treeStruct) => {
console.log("要删除得节点-->",val.value) console.log("要删除得节点-->", val.value);
delDiGui(treeSelectAry,val) delDiGui(treeSelectAry, val);
console.log("删除指定节点数据---结果-->",treeSelectAry) console.log("删除指定节点数据---结果-->", treeSelectAry);
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-27 14:13:23 @ 时间: 2024-09-27 14:13:23
@ -213,47 +246,47 @@ const delDiGui = (tree: treeStruct[],val:treeStruct) => {
return delDiGui(node.children, val); return delDiGui(node.children, val);
} }
} }
} };
const edisIsShow = ref(false) const edisIsShow = ref(false);
const butLoadEdit = ref(false) const butLoadEdit = ref(false);
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-29 13:29:17 @ 时间: 2024-09-29 13:29:17
@ 功能: 编辑级联舒体 @ 功能: 编辑级联舒体
*/ */
const pickEdis = (val: treeStruct) => { const pickEdis = (val: treeStruct) => {
guodu.value = val guodu.value = val;
treeSelectTitle.label = val.label treeSelectTitle.label = val.label;
edisIsShow.value = true edisIsShow.value = true;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-29 13:33:51 @ 时间: 2024-09-29 13:33:51
@ 功能: 关闭编辑窗体 @ 功能: 关闭编辑窗体
*/ */
const pickEditClose = () => { const pickEditClose = () => {
guodu.value = {} guodu.value = {};
treeSelectTitle.label = "" treeSelectTitle.label = "";
edisIsShow.value = false edisIsShow.value = false;
butLoadEdit.value = false butLoadEdit.value = false;
editTitleInfoRef.value.resetFields(); editTitleInfoRef.value.resetFields();
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-09-29 13:36:30 @ 时间: 2024-09-29 13:36:30
@ 功能: 确定修改 @ 功能: 确定修改
*/ */
const pickEditIsTrue = () => { const pickEditIsTrue = () => {
butLoadEdit.value = true butLoadEdit.value = true;
editTitleInfoRef.value.validate((isValid: boolean) => { editTitleInfoRef.value.validate((isValid: boolean) => {
if (isValid) { if (isValid) {
guodu.value.label = treeSelectTitle.label guodu.value.label = treeSelectTitle.label;
pickEditClose() pickEditClose();
} else { } else {
butLoad.value = false butLoad.value = false;
}
})
} }
});
};
</script> </script>
<template> <template>
<el-drawer <el-drawer
@ -269,11 +302,7 @@ const pickEditIsTrue = () => {
<div v-html="title"></div> <div v-html="title"></div>
</template> </template>
<div v-if="['cascader', 'treeSelect'].includes(props.data.type)"> <div v-if="['cascader', 'treeSelect'].includes(props.data.type)">
<el-table <el-table :data="treeSelectAry" row-key="value" default-expand-all>
:data="treeSelectAry"
row-key="value"
default-expand-all
>
<el-table-column prop="label" label="名称" /> <el-table-column prop="label" label="名称" />
<el-table-column label="操作" width="200" align="center"> <el-table-column label="操作" width="200" align="center">
<template #header> <template #header>
@ -291,7 +320,12 @@ const pickEditIsTrue = () => {
</div> </div>
<div v-else :id="id"></div> <div v-else :id="id"></div>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button v-if="['cascader', 'treeSelect'].includes(props.data.type)" type="primary" size="small" @click="dialogConfirmTree"> <el-button
v-if="['cascader', 'treeSelect'].includes(props.data.type)"
type="primary"
size="small"
@click="dialogConfirmTree"
>
确定 确定
</el-button> </el-button>
<el-button v-else type="primary" size="small" @click="dialogConfirm"> <el-button v-else type="primary" size="small" @click="dialogConfirm">
@ -299,13 +333,14 @@ const pickEditIsTrue = () => {
</el-button> </el-button>
</div> </div>
<el-dialog <el-dialog v-model="addIsShow" title="编辑" width="500" :before-close="pickAddClose">
v-model="addIsShow" <el-form
title="编辑" ref="editTitleFormRef"
width="500" :rules="editTitleRules"
:before-close="pickAddClose" :model="treeSelectTitle"
label-width="auto"
style="max-width: 600px"
> >
<el-form ref="editTitleFormRef" :rules="editTitleRules" :model="treeSelectTitle" label-width="auto" style="max-width: 600px">
<el-form-item label="名称：" prop="label"> <el-form-item label="名称：" prop="label">
<el-input v-model="treeSelectTitle.label" /> <el-input v-model="treeSelectTitle.label" />
</el-form-item> </el-form-item>
@ -313,20 +348,26 @@ const pickEditIsTrue = () => {
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="pickAddClose">取消</el-button> <el-button @click="pickAddClose">取消</el-button>
<el-button v-loading="butLoad" type="primary" @click="pickIsTrue">确定</el-button> <el-button v-loading="butLoad" type="primary" @click="pickIsTrue"
>确定</el-button
>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
<el-dialog <el-dialog
v-model="edisIsShow" v-model="edisIsShow"
title="编辑" title="编辑"
width="500" width="500"
:before-close="pickEditClose" :before-close="pickEditClose"
> >
<el-form ref="editTitleInfoRef" :rules="editTitleRules" :model="treeSelectTitle" label-width="auto" style="max-width: 600px"> <el-form
ref="editTitleInfoRef"
:rules="editTitleRules"
:model="treeSelectTitle"
label-width="auto"
style="max-width: 600px"
>
<el-form-item label="名称：" prop="label"> <el-form-item label="名称：" prop="label">
<el-input v-model="treeSelectTitle.label" /> <el-input v-model="treeSelectTitle.label" />
</el-form-item> </el-form-item>
@ -334,15 +375,17 @@ const pickEditIsTrue = () => {
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="pickEditClose">取消</el-button> <el-button @click="pickEditClose">取消</el-button>
<el-button v-loading="butLoadEdit" type="primary" @click="pickEditIsTrue">确定</el-button> <el-button v-loading="butLoadEdit" type="primary" @click="pickEditIsTrue"
>确定</el-button
>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
</el-drawer> </el-drawer>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
#editJson, #editJsonCopy { #editJson,
#editJsonCopy {
width: 100%; width: 100%;
height: calc(100vh - 90px); height: calc(100vh - 90px);
} }

61
src/components/DesignForm/app/index.vue
View File

@ -113,6 +113,7 @@ const emits = defineEmits<{
(e: "selectionChange", row: any): void; (e: "selectionChange", row: any): void;
(e: "btnClick", btn: any, row?: any): void; // 列表上面及表格列表里添加删除按钮事件 (e: "btnClick", btn: any, row?: any): void; // 列表上面及表格列表里添加删除按钮事件
}>(); }>();
const loadData = ref(false);
const operState = ref<number>(1); //操作状态 1：新增；2：重新发起；3：申请修改；4：提交审批;5:普通表单修改 const operState = ref<number>(1); //操作状态 1：新增；2：重新发起；3：申请修改；4：提交审批;5:普通表单修改
const idList = ref<string[]>([]); const idList = ref<string[]>([]);
const designStore = useDesignFormStore(); const designStore = useDesignFormStore();
@ -271,7 +272,7 @@ const selectionChange = (row: any) => {
@ 功能: 获取表格头内容 @ 功能: 获取表格头内容
*/ */
const columnsFilter = computed(() => { const columnsFilter = computed(() => {
// console.log("props.data判断是否有标题",props.data) console.log("props.data判断是否有标题", props.data);
if (!state.columnsCheck?.length) { if (!state.columnsCheck?.length) {
// console.log("props.data判断是否有标题",props.data) // console.log("props.data判断是否有标题",props.data)
return props.data.columns; return props.data.columns;
@ -631,6 +632,60 @@ const judjeRadio = (val: any, options: any[]) => {
} }
return val; return val;
}; };
/**
@ 作者: 秦东
@ 时间: 2024-11-29 13:46:36
@ 功能: 获取级联选择值
*/
const judjeCascader = (val: any[], options: any[]) => {
if (val.length < 0) return "";
let valAry = stringToObj(val);
console.log("获取级联选择值", stringToObj(val), val.length, options);
if (!Array.isArray(valAry)) return "";
let title = "";
valAry.forEach((item: any) => {
// console.log("item", item);
console.log(item + "=============:", item, diGuiJilian(item, options));
if (title == "") {
title = title + diGuiJilian(item, options);
} else {
title = title + " / " + diGuiJilian(item, options);
}
});
return title;
};
/**
@ 作者: 秦东
@ 时间: 2024-11-29 13:57:04
@ 功能: 递归查询数据
*/
const diGuiJilian = (val: any, options: any[]) => {
if (!Array.isArray(options)) return "";
let dataVal = "";
options.forEach((item: any) => {
if (item.value == val) {
// console.log(val + "=======递归查询数据======:", item.value, item.label);
dataVal = item.label;
// return dataVal;
// return item.label;
}
if (item.children && item.children.length > 0) {
// console.log(
// val + "=======递归查询数据====1==:",
// item.children,
// item.children.length
// );
let gdVal = diGuiJilian(val, item.children);
if (gdVal != "") {
dataVal = gdVal;
}
}
});
return dataVal;
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-02 14:49:40 @ 时间: 2024-04-02 14:49:40
@ -1091,6 +1146,7 @@ const transformOption = (val: string | number, type?: string) => {
:data="tableDataList" :data="tableDataList"
@selection-change="selectionChange" @selection-change="selectionChange"
table-layout="fixed" table-layout="fixed"
v-loading="state.loading"
> >
<template v-for="item in columnsFilter" :key="item.id || item.label"> <template v-for="item in columnsFilter" :key="item.id || item.label">
<el-table-column <el-table-column
@ -1245,6 +1301,9 @@ const transformOption = (val: string | number, type?: string) => {
<!-- {{scope.row[scope.column.property]}}{{item}} --> <!-- {{scope.row[scope.column.property]}}{{item}} -->
{{ scope.row[scope.column.property] }} {{ scope.row[scope.column.property] }}
</template> </template>
<template v-if="item.fieldClass == 'cascader'" #default="scope">
{{ judjeCascader(scope.row[scope.column.property], item.options) }}
</template>
<template v-if="item.fieldClass == 'radio'" #default="scope"> <template v-if="item.fieldClass == 'radio'" #default="scope">
<!-- {{scope.row[scope.column.property]}}{{item}} --> <!-- {{scope.row[scope.column.property]}}{{item}} -->
{{ judjeRadio(scope.row[scope.column.property], item.options) }} {{ judjeRadio(scope.row[scope.column.property], item.options) }}

4225
src/components/DesignForm/formControlPropertiNew.vue
View File

File diff suppressed because it is too large

50
src/components/DesignForm/public/expand/cascader.vue
View File

@ -3,45 +3,49 @@
@ 时间: 2024-09-29 13:46:55 @ 时间: 2024-09-29 13:46:55
@ 备注: 级联器 @ 备注: 级联器
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { stringToObj } from "@/utils/DesignForm/form";
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
modelValue?: string modelValue?: string;
disabled?: boolean disabled?: boolean;
action?: string action?: string;
name?: string name?: string;
fileList?: Object fileList?: Object;
control?: Object control?: Object;
config?: Object config?: Object;
data?: Object data?: Object;
options?: Object options?: Object;
}>(), }>(),
{} {}
) );
const emits = defineEmits<{ const emits = defineEmits<{
(e: 'update:modelValue', value: string): void (e: "update:modelValue", value: string): void;
}>() }>();
const value = computed({ const value = computed({
get: () => { get: () => {
console.log("图片上传处理-112->",props.modelValue) console.log("图片上传处理-112->", props.modelValue, stringToObj(props.modelValue));
return props.modelValue return stringToObj(props.modelValue);
}, },
set: (newVal: any) => { set: (newVal: any) => {
emits('update:modelValue', newVal) emits("update:modelValue", newVal);
return newVal return newVal;
}, },
}); });
const handleChange = () => { const handleChange = () => {};
const cascaderProps = {
} label: "label",
value: "value",
children: "children",
};
</script> </script>
<template> <template>
<el-cascader <el-cascader
v-model="value" v-model="value"
:options="props.options" :options="props.options"
clearable
:props="cascaderProps"
@change="handleChange" @change="handleChange"
/> />
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped></style>
</style>

6
src/components/DesignForm/public/form/calculate/cssInfo.ts
View File

@ -110,8 +110,14 @@ export const AnalysisCss = (ele:any) =>{
if(ele['width']){ if(ele['width']){
if(ele['width'] != ""){ if(ele['width'] != ""){
if(ele['width'].includes('%')){
styleObject['width'] = ele['width']
}else{
styleObject['width'] = ele['width'].toString()+"px"; styleObject['width'] = ele['width'].toString()+"px";
} }
}
} }
if(ele['widthMax'] && ele['widthMax'] != ""){ if(ele['widthMax'] && ele['widthMax'] != ""){
styleObject['max-width'] = ele['widthMax'].toString()+"px"; styleObject['max-width'] = ele['widthMax'].toString()+"px";

580
src/components/DesignForm/public/form/formGroup.vue
View File

File diff suppressed because it is too large

1012
src/components/DesignForm/public/form/formItem.vue
View File

File diff suppressed because it is too large

1011
src/components/DesignForm/tableListPage/index.vue
View File

File diff suppressed because it is too large

45
src/components/IconSelect/appMenuSvgPage.vue
View File

@ -3,7 +3,7 @@
@ 时间: 2024-04-22 14:39:07 @ 时间: 2024-04-22 14:39:07
@ 备注: 选择图标弹窗 @ 备注: 选择图标弹窗
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import SvgIcon from "@/components/SvgIcon/index.vue"; import SvgIcon from "@/components/SvgIcon/index.vue";
import SvgPage from "@/components/IconSelect/svgPage.vue"; import SvgPage from "@/components/IconSelect/svgPage.vue";
@ -15,19 +15,19 @@ const props = defineProps({
svgName: { svgName: {
type: String, type: String,
require: false, require: false,
default:"" default: "",
}, },
svgId: { svgId: {
type: String, type: String,
require: false, require: false,
default:"" default: "",
}, },
iconList: { iconList: {
type: Object, type: Object,
default() { default() {
return {} return {};
} },
} },
}); });
const visible = ref(false); // 弹窗显示状态 const visible = ref(false); // 弹窗显示状态
const iconSelectorRef = ref(); const iconSelectorRef = ref();
@ -39,30 +39,32 @@ onClickOutside(iconSelectorRef, () => (visible.value = false), {
ignore: [iconSelectorDialogRef], ignore: [iconSelectorDialogRef],
}); });
watch(
watch(() => props.isShow, (val:boolean) =>{ () => props.isShow,
(val: boolean) => {
if (val) { if (val) {
filterIconNames.value = props.iconList filterIconNames.value = props.iconList;
} }
}) }
);
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-22 16:43:49 @ 时间: 2024-04-22 16:43:49
@ 功能: 关闭 @ 功能: 关闭
*/ */
const handleClose = () => { const handleClose = () => {
emits("update:isShow",false) emits("update:isShow", false);
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-22 16:54:03 @ 时间: 2024-04-22 16:54:03
@ 功能: 确定 @ 功能: 确定
*/ */
const handleSelect = (svgName: string) => { const handleSelect = (svgName: string) => {
console.log("确定",props.svgId,svgName) console.log("确定", props.svgId, svgName);
emits("update:svgName",svgName) emits("update:svgName", svgName);
handleClose() handleClose();
} };
</script> </script>
<template> <template>
<el-dialog <el-dialog
@ -78,7 +80,7 @@ const handleSelect = (svgName:string) => {
clearable clearable
@input="handleFilter" @input="handleFilter"
/> />
<el-divider border-style="dashed" style="margin:0px;" /> <el-divider border-style="dashed" style="margin: 0px" />
<el-scrollbar height="250px"> <el-scrollbar height="250px">
<ul class="icon_list"> <ul class="icon_list">
@ -89,15 +91,18 @@ const handleSelect = (svgName:string) => {
@click="handleSelect(iconName)" @click="handleSelect(iconName)"
> >
<el-tooltip :content="iconName" placement="bottom" effect="light"> <el-tooltip :content="iconName" placement="bottom" effect="light">
<svg-icon color="var(--el-text-color-regular)" :icon-class="iconName" /> <svg-icon
color="var(--el-text-color-regular)"
:size="40"
:icon-class="iconName"
/>
</el-tooltip> </el-tooltip>
</li> </li>
</ul> </ul>
</el-scrollbar> </el-scrollbar>
</el-dialog> </el-dialog>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.icon_list { .icon_list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

190
src/views/sysworkflow/codepage/index.vue
View File

@ -3,20 +3,24 @@
@ 时间: 2023-08-28 14:47:07 @ 时间: 2023-08-28 14:47:07
@ 备注: 表单设计 @ 备注: 表单设计
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { SearchForm, customerFormCont, customerFormConfig } from "@/api/DesignForm/type"; import { SearchForm, customerFormCont, customerFormConfig } from "@/api/DesignForm/type";
import { getCustomerFormList,getProductionMarkForm,editProductionFormStatus } from '@/api/DesignForm/requestapi' import {
getCustomerFormList,
getProductionMarkForm,
editProductionFormStatus,
} from "@/api/DesignForm/requestapi";
//引入页面 //引入页面
import CreateForm from '@/views/sysworkflow/codepage/createform.vue' import CreateForm from "@/views/sysworkflow/codepage/createform.vue";
import SetupConfig from '@/views/sysworkflow/codepage/setupconfig.vue' import SetupConfig from "@/views/sysworkflow/codepage/setupconfig.vue";
import DataTableStructure from '@/views/sysworkflow/codepage/datatablestructure.vue' import DataTableStructure from "@/views/sysworkflow/codepage/datatablestructure.vue";
import FlowDrawingBoard from '@/views/sysworkflow/flow/flowDrawingBoard.vue' import FlowDrawingBoard from "@/views/sysworkflow/flow/flowDrawingBoard.vue";
const contbody = ref() const contbody = ref();
const queryParams = reactive<SearchForm>({ const queryParams = reactive<SearchForm>({
page: 1, page: 1,
pagesize:15 pagesize: 15,
}); });
const ids = ref<number[]>([]); //记录总数 const ids = ref<number[]>([]); //记录总数
const editIds = reactive<string[]>([]); //记录总数 const editIds = reactive<string[]>([]); //记录总数
@ -24,23 +28,23 @@ const loading =ref(false); //加载表单
const show = ref(false); //加载表单 const show = ref(false); //加载表单
const drawerOpenOrClose = ref(false); const drawerOpenOrClose = ref(false);
const total = ref(0); //记录总数 const total = ref(0); //记录总数
const contList = ref<customerFormCont[]>() const contList = ref<customerFormCont[]>();
const drawerWith = ref(); const drawerWith = ref();
const editid = ref<string>("") const editid = ref<string>("");
const formConfigCont = reactive<customerFormConfig>({ const formConfigCont = reactive<customerFormConfig>({
formname: "", formname: "",
formlogo:"" formlogo: "",
}) });
const formId = ref<string>(""); const formId = ref<string>("");
//搜索表单 //搜索表单
function handleQuery() { function handleQuery() {
getCustomerFormList(queryParams) getCustomerFormList(queryParams)
.then(({ data }) => { .then(({ data }) => {
// console.log("搜索表单-->",data); // console.log("搜索表单-->",data);
total.value = data.total total.value = data.total;
contList.value = data.list contList.value = data.list;
}) })
.finally(() => {}) .finally(() => {});
} }
//重置搜索条件 //重置搜索条件
function resetQuery() { function resetQuery() {
@ -49,68 +53,64 @@ function resetQuery(){
} }
//新增表单 //新增表单
function openDialog() { function openDialog() {
formId.value = "" formId.value = "";
drawerWith.value = contbody.value?.clientWidth drawerWith.value = contbody.value?.clientWidth;
getProductionMarkForm() getProductionMarkForm()
.then(({ data }) => { .then(({ data }) => {
formConfigCont.formlogo = data.formlogo formConfigCont.formlogo = data.formlogo;
formConfigCont.formname = data.formname formConfigCont.formname = data.formname;
// console.log("新增表单",formConfigCont) // console.log("新增表单",formConfigCont)
}) })
.finally(() => { .finally(() => {
drawerOpenOrClose.value = true; drawerOpenOrClose.value = true;
}) });
} }
//删除表单 //删除表单
function handleDelete() { function handleDelete() {
if (ids.value.length < 1) { if (ids.value.length < 1) {
ElMessage.error('没有选中要删除得数据！') ElMessage.error("没有选中要删除得数据！");
} else { } else {
ElMessageBox.confirm( ElMessageBox.confirm("请问是否真的删除？删除后数据将无法找回！", "温馨提示！", {
'请问是否真的删除？删除后数据将无法找回！', confirmButtonText: "删除",
'温馨提示！', cancelButtonText: "取消",
{ type: "warning",
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
draggable: true, draggable: true,
}) })
.then(() => { .then(() => {
editProductionFormStatus({id:ids.value.map(String),status:3,is_delete:false}) editProductionFormStatus({
.then(({data})=>{ id: ids.value.map(String),
handleQuery() status: 3,
}) is_delete: false,
}).then(({ data }) => {
handleQuery();
});
}) })
.catch(() => { .catch(() => {
handleQuery() handleQuery();
}) });
} }
} }
//删除单一自定义表单 //删除单一自定义表单
function editCustomerFormState(cont: customerFormCont) { function editCustomerFormState(cont: customerFormCont) {
// console.log("删除单一自定义表单",cont) // console.log("删除单一自定义表单",cont)
editIds.push(cont.id) editIds.push(cont.id);
ElMessageBox.confirm( ElMessageBox.confirm("请问是否真的删除？删除后数据将无法找回！", "温馨提示！", {
'请问是否真的删除？删除后数据将无法找回！', confirmButtonText: "删除",
'温馨提示！', cancelButtonText: "取消",
{ type: "warning",
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
draggable: true, draggable: true,
}) })
.then(() => { .then(() => {
editProductionFormStatus({id:editIds,status:3,is_delete:false}) editProductionFormStatus({ id: editIds, status: 3, is_delete: false }).then(
.then(({data})=>{ ({ data }) => {
handleQuery() handleQuery();
editIds.splice(0, editIds.length); editIds.splice(0, editIds.length);
}) }
);
}) })
.catch(() => { .catch(() => {
handleQuery() handleQuery();
}) });
} }
/** /**
* 行checkbox change事件 * 行checkbox change事件
@ -120,8 +120,8 @@ function handleSelectionChange(selection: any) {
} }
//设置自定义表单 //设置自定义表单
function setupCustomerForm(cont: customerFormCont) { function setupCustomerForm(cont: customerFormCont) {
editid.value = cont.id editid.value = cont.id;
show.value = true show.value = true;
} }
onMounted(() => { onMounted(() => {
handleQuery(); handleQuery();
@ -130,42 +130,40 @@ onMounted(()=>{
window.addEventListener("resize", function () { window.addEventListener("resize", function () {
// drawerWith.value = window.innerWidth -220 // drawerWith.value = window.innerWidth -220
// console.log("搜索表单-->",window.innerWidth); // console.log("搜索表单-->",window.innerWidth);
}) });
//编辑表单 //编辑表单
function editCustomerForm(cont: customerFormCont) { function editCustomerForm(cont: customerFormCont) {
drawerWith.value = contbody.value?.clientWidth drawerWith.value = contbody.value?.clientWidth;
formId.value = cont.id.toString(); formId.value = cont.id.toString();
drawerOpenOrClose.value = true; drawerOpenOrClose.value = true;
} }
const dataTableIsShow = ref(false) const dataTableIsShow = ref(false);
const formCont = ref<customerFormCont>() const formCont = ref<customerFormCont>();
//打开数据表结构图 //打开数据表结构图
const openDataTableStructure = (cont: customerFormCont) => { const openDataTableStructure = (cont: customerFormCont) => {
formCont.value = cont formCont.value = cont;
dataTableIsShow.value = true; dataTableIsShow.value = true;
// console.log("打开数据表结构图",cont) // console.log("打开数据表结构图",cont)
} };
//设置工作流 //设置工作流
const drawer = ref(false) const drawer = ref(false);
const drawerWidht = ref() const drawerWidht = ref();
const isFormFlow = ref(false) const isFormFlow = ref(false);
const customerFormKey = ref<string>() const customerFormKey = ref<string>();
const customerFormName = ref<string>() const customerFormName = ref<string>();
const flowKey = ref<string>() const flowKey = ref<string>();
const setupWorkFlow = (cont: customerFormCont) => { const setupWorkFlow = (cont: customerFormCont) => {
drawerWidht.value = contbody.value?.clientWidth drawerWidht.value = contbody.value?.clientWidth;
// console.log("clientHeight--->",cont) // console.log("clientHeight--->",cont)
drawer.value = true drawer.value = true;
isFormFlow.value = true; isFormFlow.value = true;
customerFormName.value = cont.name customerFormName.value = cont.name;
customerFormKey.value = cont.id.toString() customerFormKey.value = cont.id.toString();
flowKey.value = cont.flowkey.toString() flowKey.value = cont.flowkey.toString();
} };
</script> </script>
<template> <template>
<div ref="contbody"> <div ref="contbody">
<div class="app-container"> <div class="app-container">
<div class="search"> <div class="search">
<el-form ref="queryFormRef" :model="queryParams" :inline="true"> <el-form ref="queryFormRef" :model="queryParams" :inline="true">
@ -182,20 +180,17 @@ const setupWorkFlow = (cont:customerFormCont) => {
<template #icon><i-ep-search /></template>搜索 <template #icon><i-ep-search /></template>搜索
</el-button> </el-button>
<el-button @click="resetQuery"> <el-button @click="resetQuery">
<template #icon> <template #icon> <i-ep-refresh /></template>重置
<i-ep-refresh /></template>重置
</el-button> </el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<el-button type="success" @click="openDialog()"><i-ep-plus />新增表单</el-button> <el-button type="success" @click="openDialog()"
<el-button ><i-ep-plus />新增表单</el-button
type="danger"
:disabled="ids.length === 0"
@click="handleDelete()"
> >
<el-button type="danger" :disabled="ids.length === 0" @click="handleDelete()">
<i-ep-delete />删除表单 <i-ep-delete />删除表单
</el-button> </el-button>
</template> </template>
@ -273,24 +268,39 @@ const setupWorkFlow = (cont:customerFormCont) => {
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination
v-if="total > 0"
v-model:total="total"
v-model:page="queryParams.page"
v-model:limit="queryParams.pagesize"
@pagination="handleQuery"
/>
</el-card> </el-card>
</div> </div>
</div> </div>
<el-drawer v-model="drawerOpenOrClose" title="设置/编辑自定义表单" :with-header="false" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="drawerWith" class="drawerClass"> <el-drawer
<CreateForm v-model:draweropenclose="drawerOpenOrClose" :formid="formId" :formconfigcont="formConfigCont" @handlequery="handleQuery" /> v-model="drawerOpenOrClose"
title="设置/编辑自定义表单"
:with-header="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
:destroy-on-close="true"
:size="drawerWith"
class="drawerClass"
>
<CreateForm
v-model:draweropenclose="drawerOpenOrClose"
:formid="formId"
:formconfigcont="formConfigCont"
@handlequery="handleQuery"
/>
</el-drawer> </el-drawer>
<SetupConfig v-model:show="show" :editid="editid" @handle_query="handleQuery" /> <SetupConfig v-model:show="show" :editid="editid" @handle_query="handleQuery" />
<DataTableStructure v-model:isshow="dataTableIsShow" :formcont="formCont" /> <DataTableStructure v-model:isshow="dataTableIsShow" :formcont="formCont" />
<FlowDrawingBoard v-model:open-drawer="drawer" :drawer-widht="drawerWidht" :is-form-flow="isFormFlow" :customer-form-name="customerFormName" :customer-form-key="customerFormKey" :flow-key="flowKey" @chanerequest="handleQuery" /> <FlowDrawingBoard
v-model:open-drawer="drawer"
:drawer-widht="drawerWidht"
:is-form-flow="isFormFlow"
:customer-form-name="customerFormName"
:customer-form-key="customerFormKey"
:flow-key="flowKey"
@chanerequest="handleQuery"
/>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.drawerClass { .drawerClass {
.el-drawer__body { .el-drawer__body {
padding: 0; padding: 0;

363
src/views/sysworkflow/lowcodepage/appCardPage.vue
View File

@ -3,153 +3,166 @@
@ 时间: 2024-07-22 08:53:50 @ 时间: 2024-07-22 08:53:50
@ 备注: 自定义应用卡片视图 @ 备注: 自定义应用卡片视图
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form' import {
json2string,
objToStringify,
string2json,
stringToObj,
} from "@/utils/DesignForm/form";
import { customerFormCont } from "@/api/DesignForm/type"; import { customerFormCont } from "@/api/DesignForm/type";
import { getCustomerFormList,editProductionFormStatus,appJwtPower,getFieldRecord } from '@/api/DesignForm/requestapi' import {
getCustomerFormList,
editProductionFormStatus,
appJwtPower,
getFieldRecord,
} from "@/api/DesignForm/requestapi";
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 11:30:11 @ 时间: 2024-07-22 11:30:11
@ 功能: 引入组件 @ 功能: 引入组件
*/ */
import AppContainer from '@/views/sysworkflow/lowcodepage/newLowCode/appLayout/appContainer.vue' import AppContainer from "@/views/sysworkflow/lowcodepage/newLowCode/appLayout/appContainer.vue";
import AppContainerPage from '@/views/sysworkflow/lowcodepage/newLowCode/appLayoutEdit/appContainerPage.vue' //自建应用编辑 import AppContainerPage from "@/views/sysworkflow/lowcodepage/newLowCode/appLayoutEdit/appContainerPage.vue"; //自建应用编辑
import LowCodeFormPage from "@/views/sysworkflow/lowcodepage/lowCodeFormPage.vue" import LowCodeFormPage from "@/views/sysworkflow/lowcodepage/lowCodeFormPage.vue";
import TableFlow from '@/views/sysworkflow/lowcodepage/pageFlow/tableFlow.vue' import TableFlow from "@/views/sysworkflow/lowcodepage/pageFlow/tableFlow.vue";
const props = defineProps({ const props = defineProps({
searchQuery: { searchQuery: {
type: Object, type: Object,
default() { default() {
return {} return {};
} },
}, },
appGroup: { appGroup: {
type: String, type: String,
default:"" default: "",
}, },
drawerWith: { drawerWith: {
type: Number, type: Number,
default:true default: true,
} },
}); });
const emits = defineEmits(["getRongQiAttr"]); const emits = defineEmits(["getRongQiAttr"]);
const openTaskDrawer = ref(false) //新增任务 const openTaskDrawer = ref(false); //新增任务
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 09:09:29 @ 时间: 2024-07-22 09:09:29
@ 功能: 总记录数 @ 功能: 总记录数
*/ */
const pageTotal = ref(0) const pageTotal = ref(0);
const contList = ref<customerFormCont[]>() //记录 const contList = ref<customerFormCont[]>(); //记录
const loadingApp = ref(false) const loadingApp = ref(false);
const runIsOpen = ref(false) const runIsOpen = ref(false);
const pickAppInfo = ref<customerFormCont>() //应用或表单内容 const pickAppInfo = ref<customerFormCont>(); //应用或表单内容
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-03-21 10:54:23 @ 时间: 2024-03-21 10:54:23
@ 功能: 获取表单列表 @ 功能: 获取表单列表
*/ */
const getFormAppList = (val: any) => { const getFormAppList = (val: any) => {
loadingApp.value = true loadingApp.value = true;
let sendInfo = { let sendInfo = {
page: val.page, page: val.page,
pagesize: val.pagesize, pagesize: val.pagesize,
keywords: val.searchWork, keywords: val.searchWork,
groupId:props.appGroup groupId: props.appGroup,
} };
getCustomerFormList(sendInfo) getCustomerFormList(sendInfo)
.then(({ data }) => { .then(({ data }) => {
// console.log("打开应用-->",data); // console.log("打开应用-->",data);
pageTotal.value = data.total pageTotal.value = data.total;
contList.value = data.list contList.value = data.list;
}) })
.finally(() => { .finally(() => {
loadingApp.value = false loadingApp.value = false;
}) });
} };
onMounted(() => { onMounted(() => {
nextTick(() => { nextTick(() => {
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
}) });
}) });
watch(()=>props.appGroup,()=>{ watch(
() => props.appGroup,
() => {
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
}) }
);
const srcList = (val: string) => { const srcList = (val: string) => {
if (val) { if (val) {
return [val] return [val];
} else { } else {
return ["https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png"] return [
} "https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png",
];
} }
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 09:57:45 @ 时间: 2024-07-22 09:57:45
@ 功能: 编辑应用 @ 功能: 编辑应用
*/ */
const editIsOpen = ref(false) const editIsOpen = ref(false);
const appKey = ref<string>("") const appKey = ref<string>("");
const editForm = (val: any) => { const editForm = (val: any) => {
emits("getRongQiAttr") emits("getRongQiAttr");
pickAppInfo.value = val pickAppInfo.value = val;
editIsOpen.value = true; editIsOpen.value = true;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 09:58:19 @ 时间: 2024-07-22 09:58:19
@ 功能: 编辑应用状态 @ 功能: 编辑应用状态
*/ */
const eidtStatus = (val: any) => { const eidtStatus = (val: any) => {
emits("getRongQiAttr") emits("getRongQiAttr");
ElMessageBox.confirm( ElMessageBox.confirm("请问是否真的删除？删除后数据将无法找回！", "温馨提示！", {
'请问是否真的删除？删除后数据将无法找回！', confirmButtonText: "删除",
'温馨提示！', cancelButtonText: "取消",
{ type: "warning",
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
draggable: true, draggable: true,
} })
)
.then(() => { .then(() => {
editProductionFormStatus({id:[val.id.toString()],status:3,is_delete:false}) editProductionFormStatus({
.then(({data})=>{ id: [val.id.toString()],
status: 3,
is_delete: false,
}).then(({ data }) => {
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
}) });
}) })
.catch(() => { .catch(() => {
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
}) });
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 10:01:17 @ 时间: 2024-07-22 10:01:17
@ 功能: 打开应用 @ 功能: 打开应用
*/ */
const openApp = (val: any) => { const openApp = (val: any) => {
emits("getRongQiAttr") emits("getRongQiAttr");
pickAppInfo.value = val pickAppInfo.value = val;
appJwtPower({id:val.signCodeStr,types:1}) appJwtPower({ id: val.signCodeStr, types: 1 }).then(({ data }) => {
.then(({data})=>{
// console.log("打开应用------>data:",data) // console.log("打开应用------>data:",data)
if (data) { if (data) {
runIsOpen.value = true runIsOpen.value = true;
} else { } else {
ElMessage({ ElMessage({
message: '对不起！您不可使用此App！请联系管理员进行授权！', message: "对不起！您不可使用此App！请联系管理员进行授权！",
type: 'error', type: "error",
plain: true, plain: true,
}) });
}
})
} }
});
};
defineExpose({ defineExpose({
getFormAppList getFormAppList,
}) });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-23 15:27:51 @ 时间: 2024-07-23 15:27:51
@ -161,7 +174,7 @@ const state = reactive({
columns: [], columns: [],
config: {}, config: {},
controlBtn: [], controlBtn: [],
operateBtn:[] operateBtn: [],
}, },
searchData: [], searchData: [],
loading: false, loading: false,
@ -170,22 +183,22 @@ const state = reactive({
pageSize: 10, pageSize: 10,
searchIsShow: true, searchIsShow: true,
searchFormIsShow: true, searchFormIsShow: true,
openPageMode:"drawer" openPageMode: "drawer",
}, },
tagList: {}, tagList: {},
formId: props.formKey || '', formId: props.formKey || "",
formList: [], // 所有可选表单数据源 formList: [], // 所有可选表单数据源
name: '', name: "",
treeData: {}, // 左侧树相关 treeData: {}, // 左侧树相关
previewVisible: false, previewVisible: false,
tabsName: 'second', tabsName: "second",
formFieldList: [], // 表单数据源所有可选字段 formFieldList: [], // 表单数据源所有可选字段
formApi: { formApi: {
type: "1", type: "1",
addApiUrl: "", addApiUrl: "",
editApiUrl: "", editApiUrl: "",
delApiUrl: "", delApiUrl: "",
lookApiUrl:"" lookApiUrl: "",
}, },
dict: {}, dict: {},
refreshTable: true, refreshTable: true,
@ -196,8 +209,8 @@ const state = reactive({
form: { form: {
sortWord: "", sortWord: "",
sortClass: 1, sortClass: 1,
title:[] title: [],
} },
}, },
date: { date: {
status: false, status: false,
@ -206,20 +219,18 @@ const state = reactive({
startTime: "", startTime: "",
endTime: "", endTime: "",
dayType: 1, dayType: 1,
title:[] title: [],
} },
} },
,
time: { time: {
status: false, status: false,
isClick: false, isClick: false,
form: { form: {
sortWord: "", sortWord: "",
sort: 1, sort: 1,
title:[] title: [],
} },
} },
,
gantt: { gantt: {
status: false, status: false,
isClick: false, isClick: false,
@ -229,10 +240,9 @@ const state = reactive({
dayType: 2, dayType: 2,
sortWord: "", sortWord: "",
sort: 1, sort: 1,
title:[] title: [],
} },
} },
,
map: { map: {
status: false, status: false,
isClick: false, isClick: false,
@ -240,8 +250,8 @@ const state = reactive({
mapWord: "", mapWord: "",
sortWord: "", sortWord: "",
sort: 1, sort: 1,
title:[] title: [],
} },
}, },
card: { card: {
status: false, status: false,
@ -257,96 +267,94 @@ const state = reactive({
titleWork: "", titleWork: "",
describe: "", describe: "",
ranks: 3, ranks: 3,
title:[] title: [],
} },
} },
} },
}) });
const lookPageIsShow = ref(false) const lookPageIsShow = ref(false);
const versionTitle = ref<string>("") //表单名称 const versionTitle = ref<string>(""); //表单名称
const versionId = ref<string>("") //表单版本号 const versionId = ref<string>(""); //表单版本号
const formId = ref<string>("") const formId = ref<string>("");
const addFormIsShow = ref(false) const addFormIsShow = ref(false);
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-01 14:32:18 @ 时间: 2024-04-01 14:32:18
@ 功能: 查看表单列表 @ 功能: 查看表单列表
*/ */
const lookFormList = (val: any) => { const lookFormList = (val: any) => {
emits('getRongQiAttr') emits("getRongQiAttr");
// console.log("查看表单列表aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa", val) // console.log("查看表单列表aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa", val)
versionId.value = val.versionId;
versionId.value = val.versionId versionTitle.value = val.name;
versionTitle.value = val.name
if (val.listjson != "" && val.listjson != null) { if (val.listjson != "" && val.listjson != null) {
lookPageIsShow.value = true lookPageIsShow.value = true;
state.formId = val.idStr state.formId = val.idStr;
let stateData = string2json(val.listjson) let stateData = string2json(val.listjson);
// console.log(val.listjson) // console.log(val.listjson)
// console.log("查看表单列表---->",stateData) // console.log("查看表单列表---->",stateData)
//let holeControlAndConfigStateData = string2json(data.data.appForm.mastesformjson) //let holeControlAndConfigStateData = string2json(data.data.appForm.mastesformjson)
if (stateData.tableData.columns && stateData.tableData.columns.length > 0) { if (stateData.tableData.columns && stateData.tableData.columns.length > 0) {
for (let i = 0; i < stateData.tableData.columns.length; i++) { for (let i = 0; i < stateData.tableData.columns.length; i++) {
if(stateData.tableData.columns[i].config!=undefined && stateData.tableData.columns[i].control!=undefined){ if (
stateData.tableData.columns[i].config != undefined &&
stateData.tableData.columns[i].control != undefined
) {
// console.log(stateData.tableData.columns[i]) // console.log(stateData.tableData.columns[i])
let paramx:string = ""+stateData.tableData.columns[i].control.optionsValue3Field let paramx: string =
"" + stateData.tableData.columns[i].control.optionsValue3Field;
/* /*
在这里请求后台获取字段 在这里请求后台获取字段
*/ */
console.log("addCardPage---298",paramx) console.log("addCardPage---298", paramx);
if (paramx && paramx != "" && paramx != null && paramx != "undefined") { if (paramx && paramx != "" && paramx != null && paramx != "undefined") {
getFieldRecord(paramx).then(({ data }) => { getFieldRecord(paramx).then(({ data }) => {
stateData.tableData.columns[i].options = data stateData.tableData.columns[i].options = data;
if (stateData.searchData.length > 0) { if (stateData.searchData.length > 0) {
for (let j = 0; j < stateData.searchData.length; j++) { for (let j = 0; j < stateData.searchData.length; j++) {
// console.log(stateData.searchData[j]) // console.log(stateData.searchData[j])
if (stateData.searchData[j].id == stateData.tableData.columns[i].id) { if (stateData.searchData[j].id == stateData.tableData.columns[i].id) {
stateData.searchData[j].options = data stateData.searchData[j].options = data;
} }
} }
} }
}) });
} }
} }
} }
} }
state.tableData = stateData.tableData state.tableData = stateData.tableData;
state.searchData = stateData.searchData state.searchData = stateData.searchData;
state.loading = stateData.loading state.loading = stateData.loading;
state.attrObj = stateData.attrObj state.attrObj = stateData.attrObj;
state.config = stateData.config state.config = stateData.config;
state.tagList = stateData.tagList state.tagList = stateData.tagList;
state.formList = stateData.formList state.formList = stateData.formList;
state.name = stateData.name state.name = stateData.name;
state.treeData = stateData.treeData state.treeData = stateData.treeData;
state.previewVisible = stateData.previewVisible state.previewVisible = stateData.previewVisible;
state.formFieldList = stateData.formFieldList state.formFieldList = stateData.formFieldList;
state.formApi = stateData.formApi state.formApi = stateData.formApi;
state.dict = stateData.dict state.dict = stateData.dict;
state.refreshTable = stateData.refreshTable state.refreshTable = stateData.refreshTable;
} else { } else {
openTaskDrawer.value = true openTaskDrawer.value = true;
}
} }
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-03-21 10:57:11 @ 时间: 2024-03-21 10:57:11
@ 功能: 编辑表单 @ 功能: 编辑表单
*/ */
const editFormApp = (val: any) => { const editFormApp = (val: any) => {
emits('getRongQiAttr') emits("getRongQiAttr");
formId.value = val.id.toString() formId.value = val.id.toString();
addFormIsShow.value= true addFormIsShow.value = true;
// console.log("编辑表单",val.id,"-",formId.value,"-",addFormIsShow.value) // console.log("编辑表单",val.id,"-",formId.value,"-",addFormIsShow.value)
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-03-09 09:06:44 @ 时间: 2024-03-09 09:06:44
@ -355,7 +363,7 @@ const editFormApp = (val:any) => {
const refreshPage = (pageType: string) => { const refreshPage = (pageType: string) => {
addFormIsShow.value = false; addFormIsShow.value = false;
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-08-09 11:28:39 @ 时间: 2024-08-09 11:28:39
@ -363,15 +371,14 @@ const refreshPage = (pageType:string) =>{
*/ */
const handleCurrentChange = (val: any) => { const handleCurrentChange = (val: any) => {
// console.log("翻页",val) // console.log("翻页",val)
props.searchQuery.page = val props.searchQuery.page = val;
getFormAppList(props.searchQuery); getFormAppList(props.searchQuery);
} };
</script> </script>
<template> <template>
<div> <div>
<div v-loading="loadingApp" class="content1 flex flex-wrap gap-4"> <div v-loading="loadingApp" class="content1 flex flex-wrap gap-4">
<el-card v-for="item in contList" :key="item.id" class="cardBox"> <el-card v-for="item in contList" :key="item.id" class="cardBox">
<template #header> <template #header>
<el-dropdown v-if="item.classify == 3"> <el-dropdown v-if="item.classify == 3">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
@ -380,7 +387,9 @@ const handleCurrentChange = (val:any) =>{
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item @click="editForm(item)">编辑</el-dropdown-item> <el-dropdown-item @click="editForm(item)">编辑</el-dropdown-item>
<el-dropdown-item @click="eidtStatus(item)" divided>删除</el-dropdown-item> <el-dropdown-item @click="eidtStatus(item)" divided
>删除</el-dropdown-item
>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> </el-dropdown>
@ -391,7 +400,9 @@ const handleCurrentChange = (val:any) =>{
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item @click="editFormApp(item)">编辑</el-dropdown-item> <el-dropdown-item @click="editFormApp(item)">编辑</el-dropdown-item>
<el-dropdown-item @click="eidtStatus(item)" divided>删除</el-dropdown-item> <el-dropdown-item @click="eidtStatus(item)" divided
>删除</el-dropdown-item
>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> </el-dropdown>
@ -399,14 +410,21 @@ const handleCurrentChange = (val:any) =>{
<div v-if="item.classify == 3" class="cardContBox" @click="openApp(item)"> <div v-if="item.classify == 3" class="cardContBox" @click="openApp(item)">
<el-image <el-image
style="width: 100px; height: 100px" style="width: 100px; height: 100px"
:src="item.icon?item.icon:'https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png'" :src="
item.icon
? item.icon
: 'https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png'
"
:zoom-rate="1.2" :zoom-rate="1.2"
:max-scale="7" :max-scale="7"
:min-scale="0.2" :min-scale="0.2"
:initial-index="4" :initial-index="4"
fit="cover" fit="cover"
/> />
<div class="cardInfo" :style="'width: calc(100% - 100px); height: 100px; overflow: hidden;' "> <div
class="cardInfo"
:style="'width: calc(100% - 100px); height: 100px; overflow: hidden;'"
>
<div class="title">{{ item.name }}</div> <div class="title">{{ item.name }}</div>
<div class="content">{{ item.describe }}</div> <div class="content">{{ item.describe }}</div>
</div> </div>
@ -414,29 +432,52 @@ const handleCurrentChange = (val:any) =>{
<div v-else class="cardContBox" @click="lookFormList(item)"> <div v-else class="cardContBox" @click="lookFormList(item)">
<el-image <el-image
style="width: 100px; height: 100px" style="width: 100px; height: 100px"
:src="item.icon?item.icon:'https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png'" :src="
item.icon
? item.icon
: 'https://docu.hxgk.group/images/2024_04/482167d1bf2b75a5717bcf68e18235f7.png'
"
:zoom-rate="1.2" :zoom-rate="1.2"
:max-scale="7" :max-scale="7"
:min-scale="0.2" :min-scale="0.2"
:initial-index="4" :initial-index="4"
fit="cover" fit="cover"
/> />
<div class="cardInfo" :style="'width: calc(100% - 100px); height: 100px; overflow: hidden;' "> <div
class="cardInfo"
:style="'width: calc(100% - 100px); height: 100px; overflow: hidden;'"
>
<div class="title">{{ item.name }}</div> <div class="title">{{ item.name }}</div>
<div class="content">{{ item.describe }}</div> <div class="content">{{ item.describe }}</div>
</div> </div>
</div> </div>
</el-card> </el-card>
</div> </div>
<div class="pagination-box"> <div class="pagination-box">
<el-pagination background v-if="pageTotal > 0" v-model:current-page="props.searchQuery.page" <el-pagination
background
v-if="pageTotal > 0"
v-model:current-page="props.searchQuery.page"
v-model:page-size="props.searchQuery.pagesize" v-model:page-size="props.searchQuery.pagesize"
:total="pageTotal" @current-change="handleCurrentChange" /> :total="pageTotal"
@current-change="handleCurrentChange"
/>
</div> </div>
<AppContainer v-model:run-is-open="runIsOpen" :pick-app-info="pickAppInfo" :drawer-with="props.drawerWith" :search-query="props.searchQuery" @refreshPage="getFormAppList" /> <AppContainer
<AppContainerPage v-model:edit-is-open="editIsOpen" :pick-app-info="pickAppInfo" :drawer-with="props.drawerWith" :search-query="props.searchQuery" :group-key="props.appGroup" @refreshPage="getFormAppList" /> v-model:run-is-open="runIsOpen"
:pick-app-info="pickAppInfo"
:drawer-with="props.drawerWith"
:search-query="props.searchQuery"
@refreshPage="getFormAppList"
/>
<AppContainerPage
v-model:edit-is-open="editIsOpen"
:pick-app-info="pickAppInfo"
:drawer-with="props.drawerWith"
:search-query="props.searchQuery"
:group-key="props.appGroup"
@refreshPage="getFormAppList"
/>
<el-drawer <el-drawer
v-model="lookPageIsShow" v-model="lookPageIsShow"
@ -453,17 +494,26 @@ const handleCurrentChange = (val:any) =>{
:versionid="versionId" :versionid="versionId"
:viewPage="state.view" :viewPage="state.view"
:versiontitle="versionTitle" :versiontitle="versionTitle"
v-model:look-page-is-show="lookPageIsShow" v-model:look-page-is-show="lookPageIsShow"
/> />
</el-drawer> </el-drawer>
<LowCodeFormPage v-if="addFormIsShow" :drawer-with="props.drawerWith" v-model:form-key="formId" @refreshPage="refreshPage" /> <LowCodeFormPage
v-if="addFormIsShow"
:drawer-with="props.drawerWith"
v-model:form-key="formId"
@refreshPage="refreshPage"
/>
<TableFlow v-model:isopen="openTaskDrawer" :versionid="versionId" :versiontitle="versionTitle" :drawerwith="props.drawerWith" @searchquery="getFormAppList" /> <TableFlow
v-model:isopen="openTaskDrawer"
:versionid="versionId"
:versiontitle="versionTitle"
:drawerwith="props.drawerWith"
@searchquery="getFormAppList"
/>
</div> </div>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.pagination-box { .pagination-box {
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -483,7 +533,6 @@ const handleCurrentChange = (val:any) =>{
background-color: #eeeeee; background-color: #eeeeee;
} }
.content1 { .content1 {
padding: 1rem 1rem 0 1rem; padding: 1rem 1rem 0 1rem;
::v-deep .el-card__body { ::v-deep .el-card__body {

668
src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
View File

File diff suppressed because it is too large

241
src/views/sysworkflow/lowcodepage/newLowCode/appLayoutEdit/appContainerPage.vue
View File

@ -3,22 +3,22 @@
@ 时间: 2024-07-22 13:57:57 @ 时间: 2024-07-22 13:57:57
@ 备注: 编辑App @ 备注: 编辑App
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { appMenuTreeInfo,appSetInfo } from "@/api/date/type" import { appMenuTreeInfo, appSetInfo } from "@/api/date/type";
import { gainAppEditPsge } from '@/api/DesignForm/requestapi' import { gainAppEditPsge } from "@/api/DesignForm/requestapi";
import SvgIcon from "@/components/SvgIcon/index.vue"; import SvgIcon from "@/components/SvgIcon/index.vue";
import AppMenus from "@/views/sysworkflow/lowcodepage/appPage/appMenus.vue" import AppMenus from "@/views/sysworkflow/lowcodepage/appPage/appMenus.vue";
import AppMenuGroup from "@/views/sysworkflow/lowcodepage/appPage/appMenuGroup.vue" import AppMenuGroup from "@/views/sysworkflow/lowcodepage/appPage/appMenuGroup.vue";
import CreateAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue" import CreateAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue";
import OpenAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue" import OpenAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue";
import AppSetUp from "@/views/sysworkflow/lowcodepage/appPage/appSetUp/index.vue" import AppSetUp from "@/views/sysworkflow/lowcodepage/appPage/appSetUp/index.vue";
import ReleaseApp from '@/views/sysworkflow/lowcodepage/appPage/releaseApp/index.vue' import ReleaseApp from "@/views/sysworkflow/lowcodepage/appPage/releaseApp/index.vue";
const props = defineProps({ const props = defineProps({
drawerWith: { drawerWith: {
type: Number, type: Number,
default:0 default: 0,
}, },
editIsOpen: { editIsOpen: {
type: Boolean, type: Boolean,
@ -27,29 +27,29 @@ const props = defineProps({
pickAppInfo: { pickAppInfo: {
type: Object, type: Object,
default() { default() {
return {} return {};
} },
}, },
searchQuery: { searchQuery: {
type: Object, type: Object,
default() { default() {
return {} return {};
} },
}, },
groupKey: { groupKey: {
type: String, type: String,
default:"" default: "",
} },
}); });
const emits = defineEmits(["update:editIsOpen", "refreshPage"]); const emits = defineEmits(["update:editIsOpen", "refreshPage"]);
const tabsActive = ref(1) const tabsActive = ref(1);
const menusTree = ref<appMenuTreeInfo[]>([]) //菜单树 const menusTree = ref<appMenuTreeInfo[]>([]); //菜单树
const checkedMenu = ref<appMenuTreeInfo>("") const checkedMenu = ref<appMenuTreeInfo>("");
const appPageKey = ref<string>("") //自定义App表单Id const appPageKey = ref<string>(""); //自定义App表单Id
const isNew = ref(false) const isNew = ref(false);
const saveAppFormIsShow = ref(false) const saveAppFormIsShow = ref(false);
const menuParentKey = ref<string>("") const menuParentKey = ref<string>("");
const menuGroupShow = ref(false) //添加菜单分组 const menuGroupShow = ref(false); //添加菜单分组
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 11:40:06 @ 时间: 2024-07-22 11:40:06
@ -61,8 +61,8 @@ const appCont = reactive<appSetInfo>({
appSvg: "", appSvg: "",
state: 1, state: 1,
uuid: "1", uuid: "1",
describe:"" describe: "",
}) });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-23 15:23:31 @ 时间: 2024-04-23 15:23:31
@ -70,70 +70,71 @@ const appCont = reactive<appSetInfo>({
*/ */
const gainAppContent = () => { const gainAppContent = () => {
let sendInfo = { let sendInfo = {
id:props.pickAppInfo.signCodeStr id: props.pickAppInfo.signCodeStr,
} };
gainAppEditPsge(sendInfo) gainAppEditPsge(sendInfo).then((data) => {
.then((data)=>{
// console.log("获取app信息---》",data) // console.log("获取app信息---》",data)
menusTree.value = data.data.menuTree menusTree.value = data.data.menuTree;
appCont.appKey = data.data.appKey; appCont.appKey = data.data.appKey;
appCont.appName = data.data.appName; appCont.appName = data.data.appName;
appCont.appSvg = data.data.appSvg; appCont.appSvg = data.data.appSvg;
appCont.state = data.data.state; appCont.state = data.data.state;
appCont.uuid = data.data.uuid; appCont.uuid = data.data.uuid;
}) });
} };
watch(()=>props.editIsOpen,(val:boolean)=>{ watch(
() => props.editIsOpen,
(val: boolean) => {
if (val) { if (val) {
gainAppContent() gainAppContent();
} }
})
const closeAppDraw = () =>{
emits("update:editIsOpen",false)
emits("refreshPage",props.searchQuery)
tabsActive.value = 1
checkedMenu.value = ""
appPageKey.value = ""
checkedMenu.appkey=""
isNew.value = false
} }
);
const closeAppDraw = () => {
emits("update:editIsOpen", false);
emits("refreshPage", props.searchQuery);
tabsActive.value = 1;
checkedMenu.value = "";
appPageKey.value = "";
checkedMenu.appkey = "";
isNew.value = false;
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-18 09:00:00 @ 时间: 2024-05-18 09:00:00
@ 功能: 操作表单页面 @ 功能: 操作表单页面
*/ */
const openAppPageForm = (val: appMenuTreeInfo) => { const openAppPageForm = (val: appMenuTreeInfo) => {
checkedMenu.value = val checkedMenu.value = val;
console.log("操作表单页面",val) console.log("操作表单页面", val);
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-20 13:27:37 @ 时间: 2024-05-20 13:27:37
@ 功能: 编辑app页面 @ 功能: 编辑app页面
*/ */
const editAppInfo = (id: string) => { const editAppInfo = (id: string) => {
appPageKey.value = id appPageKey.value = id;
saveAppFormIsShow.value = true saveAppFormIsShow.value = true;
isNew.value = false isNew.value = false;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-19 15:47:12 @ 时间: 2024-04-19 15:47:12
@ 功能: 选择选项 @ 功能: 选择选项
*/ */
const handleClick = () =>{} const handleClick = () => {};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-23 14:49:15 @ 时间: 2024-07-23 14:49:15
@ 功能: 创建页面 @ 功能: 创建页面
*/ */
const addAppPageForm = (key?: string) => { const addAppPageForm = (key?: string) => {
saveAppFormIsShow.value = true saveAppFormIsShow.value = true;
isNew.value = true isNew.value = true;
// console.log("新建-->") // console.log("新建-->")
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ -147,16 +148,21 @@ const addMenu = (key?:string) => {
menuParentKey.value = ""; menuParentKey.value = "";
} }
menuGroupShow.value = true; menuGroupShow.value = true;
} };
const openAppPageInit = ref(null) const openAppPageInit = ref(null);
const updataPageInit = () => { const updataPageInit = () => {
openAppPageInit.value.gainAppFormPageInit();
openAppPageInit.value.gainAppFormPageInit() };
}
</script> </script>
<template> <template>
<el-drawer v-model="props.editIsOpen" :with-header="false" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="props.drawerWith"> <el-drawer
v-model="props.editIsOpen"
:with-header="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
:destroy-on-close="true"
:size="props.drawerWith"
>
<div class="common-layout"> <div class="common-layout">
<el-container> <el-container>
<el-header class="headerEditBox"> <el-header class="headerEditBox">
@ -169,21 +175,34 @@ const updataPageInit = () => {
</el-space> </el-space>
</div> </div>
<div> <div>
<el-tabs v-model="tabsActive" @tab-click="handleClick" :stretch="true" class="tabsMain"> <el-tabs
<el-tab-pane label="① 页面管理" :name="1"> v-model="tabsActive"
</el-tab-pane> @tab-click="handleClick"
<el-tab-pane label="② 集成&自动化" :name="2"> :stretch="true"
</el-tab-pane> class="tabsMain"
<el-tab-pane label="③ 应用设置" :name="3"> >
</el-tab-pane> <el-tab-pane label="① 页面管理" :name="1"> </el-tab-pane>
<el-tab-pane label="④ 应用发布" :name="4"> <el-tab-pane label="② 集成&自动化" :name="2"> </el-tab-pane>
</el-tab-pane> <el-tab-pane label="③ 应用设置" :name="3"> </el-tab-pane>
<el-tab-pane label="④ 应用发布" :name="4"> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<div> <div>
<el-button-group> <el-button-group>
<el-button plain size="small" class="fa fa-paper-plane-o" @click="accessRunApp">访问</el-button> <el-button
<el-button type="danger" size="small" class="fa fa-times" @click="closeAppDraw">关闭</el-button> plain
size="small"
class="fa fa-paper-plane-o"
@click="accessRunApp"
>访问</el-button
>
<el-button
type="danger"
size="small"
class="fa fa-times"
@click="closeAppDraw"
>关闭</el-button
>
</el-button-group> </el-button-group>
</div> </div>
</el-header> </el-header>
@ -205,12 +224,16 @@ const updataPageInit = () => {
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-space wrap> <el-space wrap>
<svg-icon style="color: #eebe77;" prefix="icon" icon-class="liuChengBiaoDan" /> <svg-icon
style="color: #eebe77"
prefix="icon"
icon-class="liuChengBiaoDan"
/>
新建页面 新建页面
</el-space> </el-space>
</el-col> </el-col>
<el-col :span="24" style="padding-left:20px; font-size:12px;"> <el-col :span="24" style="padding-left: 20px; font-size: 12px">
数据收集、事件记录<br>任务协同、业务审批 数据收集、事件记录<br />任务协同、业务审批
</el-col> </el-col>
</el-row> </el-row>
</el-dropdown-item> </el-dropdown-item>
@ -218,11 +241,15 @@ const updataPageInit = () => {
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-space wrap> <el-space wrap>
<svg-icon style="color: #337ecc;" prefix="icon" icon-class="fenZhu" /> <svg-icon
style="color: #337ecc"
prefix="icon"
icon-class="fenZhu"
/>
新建分组 新建分组
</el-space> </el-space>
</el-col> </el-col>
<el-col :span="24" style="padding-left:20px; font-size:12px;"> <el-col :span="24" style="padding-left: 20px; font-size: 12px">
应用项目管理 应用项目管理
</el-col> </el-col>
</el-row> </el-row>
@ -233,22 +260,46 @@ const updataPageInit = () => {
</el-col> </el-col>
</el-row> </el-row>
<el-scrollbar class="scroBox"> <el-scrollbar class="scroBox">
<AppMenus
:form-Key="appCont.uuid"
v-model:menus-tree="menusTree"
v-model:app-page-key="appPageKey"
:group-key="props.groupKey"
:app-cont="appCont"
:drawer-with="props.drawerWith"
@openAppPageForm="openAppPageForm"
/>
<AppMenus :form-Key="appCont.uuid" v-model:menus-tree="menusTree" v-model:app-page-key="appPageKey" :group-key="props.groupKey" :app-cont="appCont" :drawer-with="props.drawerWith" @openAppPageForm="openAppPageForm" /> <CreateAppFormPage
v-if="saveAppFormIsShow"
<CreateAppFormPage v-if="saveAppFormIsShow" v-model:is-show="saveAppFormIsShow" :is-new="isNew" :drawer-with="props.drawerWith" :form-Key="appCont.uuid" :app-cont="appCont" :group-key="props.groupKey" :menu-id="appCont.uuid" v-model:app-page-key="appPageKey" @gainSunAppContent="gainAppContent" @updateInit="updataPageInit" /> v-model:is-show="saveAppFormIsShow"
:is-new="isNew"
:drawer-with="props.drawerWith"
:form-Key="appCont.uuid"
:app-cont="appCont"
:group-key="props.groupKey"
:menu-id="appCont.uuid"
v-model:app-page-key="appPageKey"
@gainSunAppContent="gainAppContent"
@updateInit="updataPageInit"
/>
</el-scrollbar> </el-scrollbar>
</el-aside> </el-aside>
<el-main class="mainBox"> <el-main class="mainBox">
<el-scrollbar class="scroBox"> <el-scrollbar class="scroBox">
<OpenAppFormPage ref="openAppPageInit" :form-Key="checkedMenu.appkey" :group-key="props.groupKey" :app-cont="appCont" :drawer-with="props.drawerWith" :menus-info="checkedMenu" @editAppInfo="editAppInfo" /> <OpenAppFormPage
ref="openAppPageInit"
:form-Key="checkedMenu.appkey"
:group-key="props.groupKey"
:app-cont="appCont"
:drawer-with="props.drawerWith"
:menus-info="checkedMenu"
@editAppInfo="editAppInfo"
/>
</el-scrollbar> </el-scrollbar>
</el-main> </el-main>
</el-container> </el-container>
<el-container v-if="tabsActive==2"> <el-container v-if="tabsActive == 2"> 集成与自动化 </el-container>
集成与自动化
</el-container>
<el-container v-if="tabsActive == 3"> <el-container v-if="tabsActive == 3">
<AppSetUp :app-cont="appCont" :group-key="props.groupKey" /> <AppSetUp :app-cont="appCont" :group-key="props.groupKey" />
</el-container> </el-container>
@ -257,10 +308,15 @@ const updataPageInit = () => {
</el-container> </el-container>
</el-container> </el-container>
</div> </div>
<AppMenuGroup v-model:is-show="menuGroupShow" :menu-parent-key="menuParentKey" :app-cont="appCont" @updateMenu="gainAppContent" /> <AppMenuGroup
v-model:is-show="menuGroupShow"
:menu-parent-key="menuParentKey"
:app-cont="appCont"
@updateMenu="gainAppContent"
/>
</el-drawer> </el-drawer>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.common-layout { .common-layout {
.el-header { .el-header {
padding-left: 10px; padding-left: 10px;
@ -270,7 +326,7 @@ const updataPageInit = () => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid #F1F2F3; border-bottom: 1px solid #f1f2f3;
:deep(.el-tabs) { :deep(.el-tabs) {
width: 100%; width: 100%;
height: 40px; height: 40px;
@ -299,14 +355,13 @@ const updataPageInit = () => {
} }
.asideBox { .asideBox {
width: 250px; width: 250px;
border-right: 1px solid #F1F2F3; border-right: 1px solid #f1f2f3;
height: calc(100vh - 40px); height: calc(100vh - 40px);
.asideBoxSearch { .asideBoxSearch {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 10px 10px; padding: 10px 10px;
} }
.appMenuTitle { .appMenuTitle {
width: 100%; width: 100%;
@ -329,7 +384,7 @@ const updataPageInit = () => {
padding: 0px; padding: 0px;
} }
.mainBox { .mainBox {
background-color: #F1F2F3; background-color: #f1f2f3;
padding: 0px; padding: 0px;
.scroBox { .scroBox {
height: calc(100vh - 40px); height: calc(100vh - 40px);

4
src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue
View File

@ -204,7 +204,7 @@ const initLoadData = () => {
versionTitle.value = data.data.appForm.name; versionTitle.value = data.data.appForm.name;
if (data.data.pageList) { if (data.data.pageList) {
let stateData = string2json(data.data.appForm.listjson); let stateData = string2json(data.data.appForm.listjson);
// console.log("接邂逅的数",stateData) console.log("接邂逅的数", stateData);
let holeControlAndConfigStateData = string2json(data.data.appForm.mastesformjson); let holeControlAndConfigStateData = string2json(data.data.appForm.mastesformjson);
if (stateData.tableData.columns && stateData.tableData.columns.length > 0) { if (stateData.tableData.columns && stateData.tableData.columns.length > 0) {
for (let i = 0; i < stateData.tableData.columns.length; i++) { for (let i = 0; i < stateData.tableData.columns.length; i++) {
@ -325,7 +325,7 @@ watch(
); );
function optionsValue3Get3(data: any, fieldName: string) { function optionsValue3Get3(data: any, fieldName: string) {
console.log("runAppForm","optionsValue3Get3") console.log("runAppForm", "optionsValue3Get3");
for (let i = 0; i < stateForm.formData.list.length; i++) { for (let i = 0; i < stateForm.formData.list.length; i++) {
if (stateForm.formData.list[i].name == fieldName) { if (stateForm.formData.list[i].name == fieldName) {
stateForm.formData.list[i].options = []; stateForm.formData.list[i].options = [];

194
src/widget/number/index.vue
View File

@ -3,73 +3,75 @@
@ 时间: 2023-12-05 09:40:32 @ 时间: 2023-12-05 09:40:32
@ 备注: 链接地址组件 @ 备注: 链接地址组件
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { import {
constControlChange, constControlChange,
constFormProps, constFormProps,
constGetControlByName constGetControlByName,
} from '@/api/DesignForm/utils' } from "@/api/DesignForm/utils";
import validate from '@/api/DesignForm/validate' import validate from "@/api/DesignForm/validate";
import { useRoute } from 'vue-router' import { useRoute } from "vue-router";
import { FormItem, FormList } from '@/api/DesignForm/types' import { FormItem, FormList } from "@/api/DesignForm/types";
import { gainNumber } from '@/api/DesignForm/requestapi' import { gainNumber } from "@/api/DesignForm/requestapi";
import Tooltips from '@/components/DesignForm/tooltip.vue' import Tooltips from "@/components/DesignForm/tooltip.vue";
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
data: FormList data: FormList;
tablekey: any tablekey: any;
numrun?: number numrun?: number;
modelValue?: any // 子表和弹性布局时时有传 modelValue?: any; // 子表和弹性布局时时有传
tProp?: string // 子表时的form-item的prop值，用于子表校验用 tProp?: string; // 子表时的form-item的prop值，用于子表校验用
}>(), }>(),
{} {}
) );
const emits = defineEmits<{ const emits = defineEmits<{
(e: 'update:modelValue', numVal: any): void (e: "update:modelValue", numVal: any): void;
}>() }>();
const route = useRoute() const route = useRoute();
const formProps = inject(constFormProps, {}) as any const formProps = inject(constFormProps, {}) as any;
const type = computed(() => { const type = computed(() => {
return formProps.value.type return formProps.value.type;
}) });
const config = computed(() => { const config = computed(() => {
return props.data.config || {} return props.data.config || {};
}) });
const control = computed(() => { const control = computed(() => {
return props.data.control;
return props.data.control
// return props.data // return props.data
}) });
const options = ref(props.data.options) const options = ref(props.data.options);
const changeEvent = inject(constControlChange, '') as any const changeEvent = inject(constControlChange, "") as any;
watch(() => props.tablekey,() => { watch(
() => props.tablekey,
() => {
// console.log("编码组件1---》",props.tablekey) // console.log("编码组件1---》",props.tablekey)
}) }
);
const editDisabled = ref(false); //是否手动编辑 const editDisabled = ref(false); //是否手动编辑
const value = computed({ const value = computed({
get() { get() {
if (props.tProp) { if (props.tProp) {
// 表格和弹性布局 // 表格和弹性布局
return props.modelValue return props.modelValue;
} else { } else {
return formProps.value.model[props.data.name] return formProps.value.model[props.data.name];
} }
}, },
set(newVal: any) { set(newVal: any) {
if (props.tProp) { if (props.tProp) {
emits('update:modelValue', newVal) emits("update:modelValue", newVal);
}
updateModel(newVal)
} }
}) updateModel(newVal);
},
});
const updateModel = (val: any) => { const updateModel = (val: any) => {
let controlAttribute = "" let controlAttribute = "";
if (props.data.control) { if (props.data.control) {
if (props.data.control.type) { if (props.data.control.type) {
controlAttribute = props.data.control.type controlAttribute = props.data.control.type;
} }
} }
changeEvent && changeEvent &&
@ -79,109 +81,113 @@ const updateModel = (val: any) => {
data: props.data, data: props.data,
tProp: props.tProp, tProp: props.tProp,
type: props.data.type, type: props.data.type,
attribute: controlAttribute attribute: controlAttribute,
}) });
} };
onMounted(() => { onMounted(() => {
// console.log("编码组件---》",props.numrun,props.data,props.data.control.config) console.log("编码组件---》", props.numrun, props.data, props.data.control.config);
if(props.numrun == 2){ // if (props.numrun == 2) {
getNumber() // getNumber();
// }
if (props.data.config && props.data.config.automatic) {
getNumber();
editDisabled.value = true;
} else {
editDisabled.value = false;
} }
}) });
//获取编号 //获取编号
const getNumber = () => { const getNumber = () => {
let sendData = { let sendData = {
table: props.tablekey, table: props.tablekey,
automatic: props.data.config.automatic, automatic: props.data.config.automatic,
customRules:props.data.config.customRules customRules: props.data.config.customRules,
} };
editDisabled.value = props.data.config.automatic editDisabled.value = props.data.config.automatic;
gainNumber(sendData) gainNumber(sendData).then((data: any) => {
.then((data:any) =>{
// console.log("编码组件2---》",data,sendData) // console.log("编码组件2---》",data,sendData)
value.value = data.data value.value = data.data;
}) });
} };
// 当通用修改属性功能添加新字段时，数组更新但toRefs没更新 // 当通用修改属性功能添加新字段时，数组更新但toRefs没更新
const getControlByName = inject(constGetControlByName) as any const getControlByName = inject(constGetControlByName) as any;
const sourceFunKey = computed(() => { const sourceFunKey = computed(() => {
const iReg = new RegExp('(?<=\\${)(.*?)(?=})', 'g') const iReg = new RegExp("(?<=\\${)(.*?)(?=})", "g");
//const iReg = new RegExp('\\${.*?}', 'g') // 结果会包含开头和结尾=>${name} //const iReg = new RegExp('\\${.*?}', 'g') // 结果会包含开头和结尾=>${name}
const apiUrl = config.value.optionsFun const apiUrl = config.value.optionsFun;
const replace = apiUrl?.match(iReg) const replace = apiUrl?.match(iReg);
return replace && replace[0] return replace && replace[0];
}) });
const getLabel = (ele: FormItem) => { const getLabel = (ele: FormItem) => {
const showColon = formProps.value.showColon ? '：' : '' const showColon = formProps.value.showColon ? "：" : "";
if (ele) { if (ele) {
return ele.showLabel ? '' : ele.label + showColon return ele.showLabel ? "" : ele.label + showColon;
} else { } else {
return '' return "";
}
} }
};
// 返回当前item项的校验规则 // 返回当前item项的校验规则
const itemRules = computed(() => { const itemRules = computed(() => {
let temp let temp;
const itemR: any = props.data.item?.rules || [] const itemR: any = props.data.item?.rules || [];
const customR = formatCustomRules() const customR = formatCustomRules();
// 如果三个都没有设置，则返回undefined // 如果三个都没有设置，则返回undefined
if (itemR?.length || customR?.length) { if (itemR?.length || customR?.length) {
temp = [...customR, ...itemR] temp = [...customR, ...itemR];
} }
return temp return temp;
}) });
// 处理自定义校验规则，将customRules转换后追加到rules里 // 处理自定义校验规则，将customRules转换后追加到rules里
const formatCustomRules = () => { const formatCustomRules = () => {
const rulesReg: any = {} const rulesReg: any = {};
validate && validate &&
validate.forEach(item => { validate.forEach((item) => {
rulesReg[item.type] = item.regExp rulesReg[item.type] = item.regExp;
}) });
// 获取校验方法 父级使用provide方法注入 // 获取校验方法 父级使用provide方法注入
const temp: any = [] const temp: any = [];
props.data.customRules?.forEach((item: any) => { props.data.customRules?.forEach((item: any) => {
if (!item.message && item.type !== 'methods') { if (!item.message && item.type !== "methods") {
return // 方法时允许提示信息为空 return; // 方法时允许提示信息为空
} }
let obj = {} let obj = {};
if (item.type === 'required') { if (item.type === "required") {
obj = { required: true } obj = { required: true };
} else if (item.type === 'rules') { } else if (item.type === "rules") {
// 自定义表达式 // 自定义表达式
obj = { pattern: item.rules } obj = { pattern: item.rules };
} else if (item.type === 'methods') { } else if (item.type === "methods") {
// 方法时 // 方法时
const methods: any = item.methods const methods: any = item.methods;
if (methods) { if (methods) {
obj = { validator: inject(methods, {}) } obj = { validator: inject(methods, {}) };
} }
} else if (item.type) { } else if (item.type) {
obj = { pattern: rulesReg[item.type as string] } obj = { pattern: rulesReg[item.type as string] };
} }
// 这里判断下防某些条件下重复push的可能或存重复校验类型 // 这里判断下防某些条件下重复push的可能或存重复校验类型
let message: any = { message: item.message } let message: any = { message: item.message };
if (!item.message) { if (!item.message) {
// 当使用validator校验时，如果存在message字段则不能使用 callback(new Error('x'));的提示 // 当使用validator校验时，如果存在message字段则不能使用 callback(new Error('x'));的提示
message = {} message = {};
} }
temp.push( temp.push(
Object.assign( Object.assign(
{ {
trigger: item.trigger || 'blur' trigger: item.trigger || "blur",
}, },
obj, obj,
message message
) )
) );
}) });
return temp return temp;
} };
</script> </script>
<template> <template>
<el-form-item <el-form-item
v-bind="data.item" v-bind="data.item"
:prop="tProp || data.name" :prop="tProp || data.name"
@ -201,6 +207,4 @@ const formatCustomRules = () => {
</template> </template>
</el-form-item> </el-form-item>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped></style>
</style>

Write Preview
Loading…
Cancel
Save