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

手机端页面

lwx_v11^2
hreenshan112 1 year ago
parent
eea07cd7aa
commit
e51fb73178
4 changed files with 5705 additions and 5168 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. 4996
      src/components/DesignForm/formControlPropertiNew.vue
  2. 243
      src/views/hr/userBox.vue
  3. 202
      src/views/sysworkflow/lowcodepage/newLowCode/appLayout/appContainer.vue
  4. 470
      src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue

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

File diff suppressed because it is too large

243
src/views/hr/userBox.vue
View File

@ -3,45 +3,45 @@
@ 时间: 2024-05-23 13:50:03 @ 时间: 2024-05-23 13:50:03
@ 备注: 行政组织及角色选择器 @ 备注: 行政组织及角色选择器
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { Search,ArrowRight } from '@element-plus/icons-vue' //搜索图标 import { Search, ArrowRight } from "@element-plus/icons-vue"; //搜索图标
import { userOrgRole,crumb } from '@/api/hr/search/types' import { userOrgRole, crumb } from "@/api/hr/search/types";
const circleUrl = ref('https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png') const circleUrl = ref(
"https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
);
//引入页面 //引入页面
import OrgPage from '@/views/hr/orgUserRole/org.vue' import OrgPage from "@/views/hr/orgUserRole/org.vue";
import OrgRolePage from '@/views/hr/orgUserRole/orgrole.vue' import OrgRolePage from "@/views/hr/orgUserRole/orgrole.vue";
import RolePageIng from '@/views/hr/orgUserRole/rolePage.vue' import RolePageIng from "@/views/hr/orgUserRole/rolePage.vue";
const props = defineProps({ const props = defineProps({
isOpen:{ isOpen: {
type:Boolean, type: Boolean,
default:false default: false,
}, },
types:{ types: {
type:Number, type: Number,
default:1 default: 1,
},
orgTrue: {
type: Number,
default: 1,
},
pickList: {
type: Object,
default() {
return {};
}, },
orgTrue:{
type:Number,
default:1
}, },
pickList:{
type:Object,
default(){
return {}
}
}
}); });
const taotleLog = ref(0) const taotleLog = ref(0);
const pickListAry = ref<userOrgRole[]>([]) //已选择数据 const pickListAry = ref<userOrgRole[]>([]); //已选择数据
const emits = defineEmits(["update:isOpen","update:types","pickInfo"]); const emits = defineEmits(["update:isOpen", "update:types", "pickInfo"]);
const searchQuery = ref<any>("") const searchQuery = ref<any>("");
const orgUs = ref(null) const orgUs = ref(null);
const orgUsRole = ref(null) const orgUsRole = ref(null);
const rolePage = ref(null) const rolePage = ref(null);
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-23 13:56:28 @ 时间: 2024-05-23 13:56:28
@ -50,12 +50,12 @@ const rolePage = ref(null)
const isShow = computed({ const isShow = computed({
get() { get() {
// console.log("对话框状态",props.isOpen); // console.log("对话框状态",props.isOpen);
return props.isOpen return props.isOpen;
}, },
set(val: boolean) { set(val: boolean) {
// console.log("对话框状态",props.isOpen); // console.log("对话框状态",props.isOpen);
emits('update:isOpen', val) emits("update:isOpen", val);
} },
}); });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ -65,21 +65,21 @@ const isShow = computed({
const userTypes = computed({ const userTypes = computed({
get() { get() {
// console.log("对话框状态",props.isOpen); // console.log("对话框状态",props.isOpen);
return props.types return props.types;
}, },
set(val: boolean) { set(val: boolean) {
// console.log("对话框状态",props.isOpen); // console.log("对话框状态",props.isOpen);
emits('update:types', val) emits("update:types", val);
} },
}) });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-23 14:15:10 @ 时间: 2024-05-23 14:15:10
@ 功能: 关闭弹出对话框 @ 功能: 关闭弹出对话框
*/ */
const handleClose = () => { const handleClose = () => {
emits('update:isOpen', false) emits("update:isOpen", false);
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-24 08:21:58 @ 时间: 2024-05-24 08:21:58
@ -87,36 +87,35 @@ const handleClose = () => {
*/ */
const searchData = () => { const searchData = () => {
// console.log("userTypes----->",userTypes); // console.log("userTypes----->",userTypes);
if(userTypes.value == 1){ if (userTypes.value == 1) {
orgUs.value.searchOrgUs(searchQuery.value) orgUs.value.searchOrgUs(searchQuery.value);
}else if(userTypes.value == 2){ } else if (userTypes.value == 2) {
orgUsRole.value.searchOrgRolePeople(searchQuery.value) orgUsRole.value.searchOrgRolePeople(searchQuery.value);
}else{ } else {
rolePage.value.searchOrgRolePeople(searchQuery.value) rolePage.value.searchOrgRolePeople(searchQuery.value);
} }
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-24 15:29:20 @ 时间: 2024-05-24 15:29:20
@ 功能: 更新数据 @ 功能: 更新数据
*/ */
const updataPickLog = (val:userOrgRole[]) => { const updataPickLog = (val: userOrgRole[]) => {
pickListAry.value = val;
pickListAry.value = val taotleLog.value = val.length;
taotleLog.value = val.length };
}
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-24 15:36:07 @ 时间: 2024-05-24 15:36:07
@ 功能: 删除选中项目 @ 功能: 删除选中项目
*/ */
const delPickCont = (val:userOrgRole) => { const delPickCont = (val: userOrgRole) => {
pickListAry.value.forEach((item:userOrgRole,index:number)=>{ pickListAry.value.forEach((item: userOrgRole, index: number) => {
if(item.id == val.id){ if (item.id == val.id) {
pickListAry.value.splice(index,1) pickListAry.value.splice(index, 1);
} }
}) });
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-24 15:52:58 @ 时间: 2024-05-24 15:52:58
@ -124,34 +123,42 @@ const delPickCont = (val:userOrgRole) => {
*/ */
const clearVal = () => { const clearVal = () => {
pickListAry.value = []; pickListAry.value = [];
taotleLog.value = 0 taotleLog.value = 0;
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-24 15:59:11 @ 时间: 2024-05-24 15:59:11
@ 功能: 提交数据 @ 功能: 提交数据
*/ */
const submitSend = () => { const submitSend = () => {
emits('pickInfo', pickListAry,props.types) emits("pickInfo", pickListAry, props.types);
};
} watch(
watch(()=>props.isOpen,(val:boolean)=>{ () => props.isOpen,
if(!val){ (val: boolean) => {
clearVal() if (!val) {
}else{ clearVal();
if(props.pickList.length > 0){ } else {
pickListAry.value = props.pickList if (props.pickList.length > 0) {
taotleLog.value = props.pickList.length pickListAry.value = props.pickList;
taotleLog.value = props.pickList.length;
} }
} }
// console.log("对话框状态",val); // console.log("对话框状态",val);
}) }
onMounted(()=>{ );
taotleLog.value = props.pickList.length onMounted(() => {
}) taotleLog.value = props.pickList.length;
});
</script> </script>
<template> <template>
<el-dialog v-model="isShow" title="选择成员" width="700" draggable :before-close="handleClose"> <el-dialog
v-model="isShow"
title="选择成员"
width="700"
draggable
:before-close="handleClose"
>
<el-row class="allBianLink"> <el-row class="allBianLink">
<el-col :span="12"> <el-col :span="12">
<el-input <el-input
@ -161,9 +168,27 @@ onMounted(()=>{
class="inputDeep" class="inputDeep"
@input="searchData" @input="searchData"
/> />
<OrgPage ref="orgUs" v-if="userTypes==1" :org-true="orgTrue" :pick-list="pickListAry" @updataPickLog="updataPickLog" /> <OrgPage
<OrgRolePage ref="orgUsRole" v-if="userTypes==2" :org-true="orgTrue" :pick-list="pickListAry" @updataPickLog="updataPickLog" /> ref="orgUs"
<RolePageIng ref="rolePage" v-if="userTypes==3" :org-true="orgTrue" :pick-list="pickListAry" @updataPickLog="updataPickLog" /> v-if="userTypes == 1"
:org-true="orgTrue"
:pick-list="pickListAry"
@updataPickLog="updataPickLog"
/>
<OrgRolePage
ref="orgUsRole"
v-if="userTypes == 2"
:org-true="orgTrue"
:pick-list="pickListAry"
@updataPickLog="updataPickLog"
/>
<RolePageIng
ref="rolePage"
v-if="userTypes == 3"
:org-true="orgTrue"
:pick-list="pickListAry"
@updataPickLog="updataPickLog"
/>
</el-col> </el-col>
<el-col :span="12" class="leftLink"> <el-col :span="12" class="leftLink">
@ -177,17 +202,21 @@ onMounted(()=>{
<ul> <ul>
<li v-for="item in pickListAry" :key="item.id"> <li v-for="item in pickListAry" :key="item.id">
<el-space wrap> <el-space wrap>
<svg-icon v-if="item.types==2" icon-class="fenZhu" :size="20" /> <svg-icon v-if="item.types == 2" icon-class="fenZhu" :size="20" />
<svg-icon v-if="item.types==3" icon-class="tasp" :size="20" /> <svg-icon v-if="item.types == 3" icon-class="tasp" :size="20" />
<el-avatar v-if="item.types==1" shape="square" :size="20" :src="circleUrl" /> <el-avatar
v-if="item.types == 1"
shape="square"
:size="20"
:src="circleUrl"
/>
<el-text>{{ item.title }}</el-text> <el-text>{{ item.title }}</el-text>
</el-space> </el-space>
<div > <div>
<svg-icon icon-class="cwkx" @click="delPickCont(item)" /> <svg-icon icon-class="cwkx" @click="delPickCont(item)" />
</div> </div>
</li> </li>
</ul> </ul>
</el-scrollbar> </el-scrollbar>
</el-col> </el-col>
</el-row> </el-row>
@ -201,28 +230,28 @@ onMounted(()=>{
</template> </template>
</el-dialog> </el-dialog>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.allBianLink{ .allBianLink {
border: 1px solid #E6E8EB; border: 1px solid #e6e8eb;
.leftLink{ .leftLink {
border-left: 1px solid #E6E8EB; border-left: 1px solid #e6e8eb;
} }
.pickTitle{ .pickTitle {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 10px 10px; padding: 10px 10px;
border-bottom: 1px solid #E6E8EB; border-bottom: 1px solid #e6e8eb;
} }
} }
.mianbaoxue{ .mianbaoxue {
display: flex; display: flex;
white-space: nowrap; white-space: nowrap;
padding: 10px 5px; padding: 10px 5px;
overflow: auto; overflow: auto;
cursor: pointer; cursor: pointer;
} }
.contentBox{ .contentBox {
height: 400px; height: 400px;
padding: 0 5px; padding: 0 5px;
li { li {
@ -237,26 +266,26 @@ onMounted(()=>{
} }
} }
li:hover { li:hover {
background-color: #EBEEF5; background-color: #ebeef5;
color: #409EFF; color: #409eff;
.el-text{ .el-text {
color: #409EFF; color: #409eff;
} }
} }
li.active{ li.active {
background-color: #EBEDF0; background-color: #ebedf0;
color: #409EFF; color: #409eff;
.el-text{ .el-text {
color: #409EFF; color: #409eff;
} }
} }
} }
.contentLiLeft{ .contentLiLeft {
border-left: 1px dashed #909399; border-left: 1px dashed #909399;
padding-left: 10px; padding-left: 10px;
} }
.pickBox{ .pickBox {
height: 420px; height: 420px;
padding: 10px 0px 0px 0px; padding: 10px 0px 0px 0px;
li { li {
@ -271,10 +300,10 @@ onMounted(()=>{
} }
} }
li:hover { li:hover {
background-color: #F56C6C; background-color: #f56c6c;
color: #FFFFFF; color: #ffffff;
.el-text{ .el-text {
color: #FFFFFF; color: #ffffff;
} }
} }
} }

202
src/views/sysworkflow/lowcodepage/newLowCode/appLayout/appContainer.vue
View File

@ -3,125 +3,134 @@
@ 时间: 2024-07-22 11:28:18 @ 时间: 2024-07-22 11:28:18
@ 备注: 自定义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 { useUserStore } from "@/store/modules/user"; import { useUserStore } from "@/store/modules/user";
import { gainAppEditPsge } from '@/api/DesignForm/requestapi' import { gainAppEditPsge } from "@/api/DesignForm/requestapi";
import RegularPage from "@/views/sysworkflow/lowcodepage/runApp/regularPage.vue" import RegularPage from "@/views/sysworkflow/lowcodepage/runApp/regularPage.vue";
import RunAppForm from "@/views/sysworkflow/lowcodepage/runApp/runAppForm.vue" import RunAppForm from "@/views/sysworkflow/lowcodepage/runApp/runAppForm.vue";
const props = defineProps({ const props = defineProps({
drawerWith:{ drawerWith: {
type:Number, type: Number,
default:0 default: 0,
}, },
runIsOpen:{ runIsOpen: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
pickAppInfo:{ pickAppInfo: {
type:Object, type: Object,
default(){ default() {
return {} return {};
} },
},
searchQuery: {
type: Object,
default() {
return {};
},
}, },
searchQuery:{
type:Object,
default(){
return {}
}
}
}); });
const emits = defineEmits(["update:runIsOpen","refreshPage"]); const emits = defineEmits(["update:runIsOpen", "refreshPage"]);
const userStore = useUserStore(); const userStore = useUserStore();
const menusTree = ref<appMenuTreeInfo[]>([]) //菜单树 const menusTree = ref<appMenuTreeInfo[]>([]); //菜单树
const pickAppMenu = ref("") //选中的菜单 const pickAppMenu = ref(""); //选中的菜单
const switchPAge = ref(1) //页面类型 1：执行页面，2：表单页面 const switchPAge = ref(1); //页面类型 1：执行页面，2：表单页面
const pickAppMenuSel = ref("") //下拉框选中的值 const pickAppMenuSel = ref(""); //下拉框选中的值
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-22 11:40:06 @ 时间: 2024-07-22 11:40:06
@ 功能: 应用进出配置 @ 功能: 应用进出配置
*/ */
const appCont = reactive<appSetInfo>({ const appCont = reactive<appSetInfo>({
appKey:"1", appKey: "1",
appName:"未知应用", appName: "未知应用",
appSvg:"", appSvg: "",
state:1, state: 1,
uuid:"1", uuid: "1",
describe:"" describe: "",
}) });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-04-23 15:23:31 @ 时间: 2024-04-23 15:23:31
@ 功能: 获取app信息 @ 功能: 获取app信息
*/ */
const gainAppContent = () =>{ const gainAppContent = () => {
let sendInfo = { let sendInfo = {
id:props.pickAppInfo.signCodeStr id: props.pickAppInfo.signCodeStr,
} };
// console.log("获取app信息---》",props.pickAppInfo) // console.log("获取app信息---》",props.pickAppInfo)
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;
let isIn = true; let isIn = true;
data.data.menuTree.forEach((item)=>{ data.data.menuTree.forEach((item) => {
if(item.isLock == 1 && item.isMain == 1){ if (item.isLock == 1 && item.isMain == 1) {
pickAppMenu.value = item; pickAppMenu.value = item;
isIn = false; isIn = false;
switchPAge.value = 1 switchPAge.value = 1;
} }
}) });
if(isIn){ if (isIn) {
pickAppMenu.value = data.data.menuTree[0]; pickAppMenu.value = data.data.menuTree[0];
if (pickAppMenu.value.type == 2){ if (pickAppMenu.value.type == 2) {
switchPAge.value = 2 switchPAge.value = 2;
} }
} }
}) });
} };
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-30 15:17:29 @ 时间: 2024-05-30 15:17:29
@ 功能: 退出应用 @ 功能: 退出应用
*/ */
const closeRunApp = () => { const closeRunApp = () => {
emits("update:runIsOpen",false) emits("update:runIsOpen", false);
emits("refreshPage",props.searchQuery) emits("refreshPage", props.searchQuery);
} };
watch(()=>props.runIsOpen,(val:boolean)=>{ watch(
if(val){ () => props.runIsOpen,
gainAppContent() (val: boolean) => {
if (val) {
gainAppContent();
}
} }
}) );
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-05-17 16:45:40 @ 时间: 2024-05-17 16:45:40
@ 功能: 打开app表单 @ 功能: 打开app表单
*/ */
const openAppPage = (val:any) =>{ const openAppPage = (val: any) => {
// console.log("打开app表单------>",val) // console.log("打开app表单------>",val)
if(val.type!=1){ if (val.type != 1) {
if(val.isLock==1){ if (val.isLock == 1) {
switchPAge.value = 1 switchPAge.value = 1;
}else{ } else {
switchPAge.value = 2 switchPAge.value = 2;
} }
pickAppMenu.value = val pickAppMenu.value = val;
} }
} };
</script> </script>
<template> <template>
<el-drawer v-model="props.runIsOpen" :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.runIsOpen"
:with-header="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
:destroy-on-close="true"
:size="props.drawerWith"
>
<el-container class="common-layout"> <el-container class="common-layout">
<el-header class="headerBox"> <el-header class="headerBox">
<div> <div>
@ -137,11 +146,17 @@ const openAppPage = (val:any) =>{
<el-dropdown-item> <el-dropdown-item>
<table class="userTabel"> <table class="userTabel">
<tr> <tr>
<td rowspan="2"><el-avatar shape="square" :size="55" :src="userStore.avatar" /></td> <td rowspan="2">
<el-avatar shape="square" :size="55" :src="userStore.avatar" />
</td>
<td>{{ userStore.nickname }}({{ userStore.userInfoCont.number }})</td> <td>{{ userStore.nickname }}({{ userStore.userInfoCont.number }})</td>
</tr> </tr>
<tr> <tr>
<td>{{ userStore.userInfoCont.companyname }}/{{ userStore.userInfoCont.departmentname }}</td> <td>
{{ userStore.userInfoCont.companyname }}/{{
userStore.userInfoCont.departmentname
}}
</td>
</tr> </tr>
</table> </table>
</el-dropdown-item> </el-dropdown-item>
@ -179,7 +194,7 @@ const openAppPage = (val:any) =>{
<el-space wrap> <el-space wrap>
<svg-icon prefix="icon" :icon-class="data.svg" /> <svg-icon prefix="icon" :icon-class="data.svg" />
<el-tooltip :content="node.label" placement="top" effect="dark"> <el-tooltip :content="node.label" placement="top" effect="dark">
<el-text class="w-120px mb-2" truncated >{{node.label}}</el-text> <el-text class="w-120px mb-2" truncated>{{ node.label }}</el-text>
</el-tooltip> </el-tooltip>
</el-space> </el-space>
</div> </div>
@ -187,66 +202,73 @@ const openAppPage = (val:any) =>{
</el-tree> </el-tree>
</el-aside> </el-aside>
<el-main class="mainBox"> <el-main class="mainBox">
<RegularPage v-if="switchPAge==1" :pick-app-menu="pickAppMenu" :drawer-with="props.drawerWith" /> <RegularPage
<RunAppForm v-else :pick-app-menu="pickAppMenu" :drawer-with="props.drawerWith" /> v-if="switchPAge == 1"
:pick-app-menu="pickAppMenu"
:drawer-with="props.drawerWith"
/>
<RunAppForm
v-else
:pick-app-menu="pickAppMenu"
:drawer-with="props.drawerWith"
/>
</el-main> </el-main>
</el-container> </el-container>
</el-container> </el-container>
</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;
padding-right:10px; padding-right: 10px;
} }
.headerBox{ .headerBox {
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__nav-wrap::after) { :deep(.el-tabs__nav-wrap::after) {
position: static !important; position: static !important;
} }
:deep(.el-tabs__header){ :deep(.el-tabs__header) {
margin:0 0 1px 0; margin: 0 0 1px 0;
} }
:deep .el-card__body{ :deep .el-card__body {
padding: 0px 0; padding: 0px 0;
} }
} }
.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%;
padding-right: 5px; padding-right: 5px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.svgBox{ .svgBox {
display: none; display: none;
} }
} }
.appMenuTitle:hover .svgBox{ .appMenuTitle:hover .svgBox {
display: block; display: block;
} }
} }
.el-main { .el-main {
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);
} }
} }

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

@ -3,23 +3,40 @@
@ 时间: 2024-05-31 09:22:06 @ 时间: 2024-05-31 09:22:06
@ 备注: 执行表格 @ 备注: 执行表格
--> -->
<script lang='ts' setup> <script lang="ts" setup>
import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form' import {
import { judgeSubmitCancel,gainAppPageInfo,getFieldRecord } from '@/api/DesignForm/requestapi' json2string,
import { Edit,Picture as IconPicture } from '@element-plus/icons-vue' objToStringify,
import { appPageDataInit,appWorkFlow } from "@/api/date/type" string2json,
import { notAsA_BasisForJudgment,asAnApprovalActionControl,fixedValueControl,timeControl,timeEquation,submitButton, afreshSubmitButton } from '@/utils/workflow/const' stringToObj,
} from "@/utils/DesignForm/form";
import {
judgeSubmitCancel,
gainAppPageInfo,
getFieldRecord,
} from "@/api/DesignForm/requestapi";
import { Edit, Picture as IconPicture } from "@element-plus/icons-vue";
import { appPageDataInit, appWorkFlow } from "@/api/date/type";
import {
notAsA_BasisForJudgment,
asAnApprovalActionControl,
fixedValueControl,
timeControl,
timeEquation,
submitButton,
afreshSubmitButton,
} from "@/utils/workflow/const";
const props = defineProps({ const props = defineProps({
pickAppMenu:{ pickAppMenu: {
type:Object, type: Object,
default(){ default() {
return {} return {};
} },
} },
}); });
const activePage = ref(0) //默认选择的页面 const activePage = ref(0); //默认选择的页面
const appInitData = ref<appPageDataInit>("") const appInitData = ref<appPageDataInit>("");
//app表单 //app表单
const stateForm = reactive<any>({ const stateForm = reactive<any>({
type: 1, // 1新增；2修改；3查看（表单模式） ；4查看； 5设计 type: 1, // 1新增；2修改；3查看（表单模式） ；4查看； 5设计
@ -27,138 +44,133 @@ const stateForm = reactive<any>({
list: [], list: [],
form: {}, form: {},
config: {}, config: {},
powerstr:{} powerstr: {},
}, },
dict: {}, dict: {},
formId: "1", formId: "1",
id: 0, id: 0,
formId: 0, formId: 0,
versionId: 0, versionId: 0,
loading: true loading: true,
}) });
//表单列表 //表单列表
const stateList = reactive({ const stateList = reactive({
tableData: { tableData: {
// tableProps: {}, //表格所有参数 // tableProps: {}, //表格所有参数
columns: [], columns: [],
config: {}, config: {},
controlBtn:[], controlBtn: [],
operateBtn:[] operateBtn: [],
}, },
searchData: [], searchData: [],
loading: false, loading: false,
attrObj: {}, attrObj: {},
config: { config: {
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,
view:{ view: {
list:{ list: {
status:true, status: true,
isClick:false, isClick: false,
form:{ form: {
sortWord:"", sortWord: "",
sortClass:1, sortClass: 1,
title:[] title: [],
}
}, },
date:{
status:false,
isClick:false,
form:{
startTime:"",
endTime:"",
dayType:1,
title:[]
}
}
,
time:{
status:false,
isClick:false,
form:{
sortWord:"",
sort:1,
title:[]
}
}
,
gantt:{
status:false,
isClick:false,
form:{
startTime:"",
endTime:"",
dayType:2,
sortWord:"",
sort:1,
title:[]
}
}
,
map:{
status:false,
isClick:false,
form:{
mapWord:"",
sortWord:"",
sort:1,
title:[]
}
}, },
card:{ date: {
status:false, status: false,
isClick:false, isClick: false,
form:{ form: {
sort:1, startTime: "",
sortWord:"", endTime: "",
imgWork:"", dayType: 1,
imgWidth:50, title: [],
imgHeight:50, },
imgBorderRadius:5, },
imgPadding:2, time: {
titleWork:"", status: false,
describe:"", isClick: false,
ranks:3, form: {
title:[] sortWord: "",
} sort: 1,
} title: [],
} },
},
}) gantt: {
const appFormTitle = ref("") status: false,
const versionTitle = ref<string>("") //表单名称 isClick: false,
const versionId = ref<string>("") //表单版本号 form: {
const appFlowInfo = ref<appWorkFlow>("") //流程 startTime: "",
const isFlow = ref(2) endTime: "",
const mastesformjson = ref("") // dayType: 2,
sortWord: "",
sort: 1,
title: [],
},
},
map: {
status: false,
isClick: false,
form: {
mapWord: "",
sortWord: "",
sort: 1,
title: [],
},
},
card: {
status: false,
isClick: false,
form: {
sort: 1,
sortWord: "",
imgWork: "",
imgWidth: 50,
imgHeight: 50,
imgBorderRadius: 5,
imgPadding: 2,
titleWork: "",
describe: "",
ranks: 3,
title: [],
},
},
},
});
const appFormTitle = ref("");
const versionTitle = ref<string>(""); //表单名称
const versionId = ref<string>(""); //表单版本号
const appFlowInfo = ref<appWorkFlow>(""); //流程
const isFlow = ref(2);
const mastesformjson = ref(""); //
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-06-03 09:54:30 @ 时间: 2024-06-03 09:54:30
@ 功能: 加载页面 @ 功能: 加载页面
*/ */
onMounted(() => { onMounted(() => {
initLoadData() initLoadData();
}); });
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ -167,74 +179,82 @@ onMounted(() => {
*/ */
const initLoadData = () => { const initLoadData = () => {
// console.log("initLoadData",props.pickAppMenu.type,props.pickAppMenu.type != 1) // console.log("initLoadData",props.pickAppMenu.type,props.pickAppMenu.type != 1)
if(props.pickAppMenu.type != 1){ if (props.pickAppMenu.type != 1) {
appFormTitle.value = props.pickAppMenu.label appFormTitle.value = props.pickAppMenu.label;
gainAppPageInfo({id:props.pickAppMenu.id}) gainAppPageInfo({ id: props.pickAppMenu.id }).then((data) => {
.then((data)=>{
// console.log("获取初始化表单数据bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb",data) // console.log("获取初始化表单数据bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb",data)
appInitData.value = data.data appInitData.value = data.data;
// console.log("获取初始化表单数据---!",appInitData.value) // console.log("获取初始化表单数据---!",appInitData.value)
mastesformjson.value = data.data.appForm.mastesformjson mastesformjson.value = data.data.appForm.mastesformjson;
isFlow.value = data.data.appForm.flowIsOpen isFlow.value = data.data.appForm.flowIsOpen;
if (data.data.page && data.data.pageList && data.data.appFlow){ if (data.data.page && data.data.pageList && data.data.appFlow) {
activePage.value = 1 activePage.value = 1;
}else if (data.data.page && !data.data.pageList && data.data.appFlow){ } else if (data.data.page && !data.data.pageList && data.data.appFlow) {
activePage.value = 2 activePage.value = 2;
}else if (!data.data.page && !data.data.pageList && data.data.appFlow){ } else if (!data.data.page && !data.data.pageList && data.data.appFlow) {
activePage.value = 3 activePage.value = 3;
}else if (!data.data.page && data.data.pageList && data.data.appFlow){ } else if (!data.data.page && data.data.pageList && data.data.appFlow) {
activePage.value = 1 activePage.value = 1;
}else if (data.data.page && !data.data.pageList && !data.data.appFlow){ } else if (data.data.page && !data.data.pageList && !data.data.appFlow) {
activePage.value = 2 activePage.value = 2;
}else{ } else {
activePage.value = 1 activePage.value = 1;
} }
versionId.value = data.data.appForm.id.toString() versionId.value = data.data.appForm.id.toString();
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++) {
for(let u = 0;u<holeControlAndConfigStateData.list.length;u++){ for (let u = 0; u < holeControlAndConfigStateData.list.length; u++) {
if(stateData.tableData.columns[i].id==holeControlAndConfigStateData.list[u].name){ if (
stateData.tableData.columns[i].control = holeControlAndConfigStateData.list[u].control stateData.tableData.columns[i].id ==
stateData.tableData.columns[i].config = holeControlAndConfigStateData.list[u].config holeControlAndConfigStateData.list[u].name
) {
stateData.tableData.columns[i].control =
holeControlAndConfigStateData.list[u].control;
stateData.tableData.columns[i].config =
holeControlAndConfigStateData.list[u].config;
} }
} }
if (
if(stateData.tableData.columns[i].config!=undefined && stateData.tableData.columns[i].control!=undefined){ 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("runAppForm-----214",paramx) //console.log("runAppForm-----214",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].options = data stateData.searchData[j].id == stateData.tableData.columns[i].id
) {
stateData.searchData[j].options = data;
} }
} }
} }
}) });
} }
if(stateData.searchData && stateData.searchData.length>0){ if (stateData.searchData && 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) {
// console.log(stateData.tableData.columns[i]) // console.log(stateData.tableData.columns[i])
stateData.searchData[j].control = stateData.tableData.columns[i].control stateData.searchData[j].control =
stateData.searchData[j].config = stateData.tableData.columns[i].config stateData.tableData.columns[i].control;
stateData.searchData[j].config =
stateData.tableData.columns[i].config;
// console.log(stateData.searchData[j]) // console.log(stateData.searchData[j])
} }
} }
@ -242,72 +262,74 @@ const initLoadData = () => {
} }
} }
} }
stateList.tableData = stateData.tableData stateList.tableData = stateData.tableData;
stateList.searchData = stateData.searchData stateList.searchData = stateData.searchData;
if(stateList.searchData == null){ if (stateList.searchData == null) {
stateList.searchData = new Array() stateList.searchData = new Array();
} }
stateList.loading = stateData.loading stateList.loading = stateData.loading;
stateList.attrObj = stateData.attrObj stateList.attrObj = stateData.attrObj;
stateList.config = stateData.config stateList.config = stateData.config;
stateList.tagList = stateData.tagList stateList.tagList = stateData.tagList;
stateList.formList = stateData.formList stateList.formList = stateData.formList;
stateList.name = stateData.name stateList.name = stateData.name;
stateList.treeData = stateData.treeData stateList.treeData = stateData.treeData;
stateList.previewVisible = stateData.previewVisible stateList.previewVisible = stateData.previewVisible;
stateList.formFieldList = stateData.formFieldList stateList.formFieldList = stateData.formFieldList;
stateList.formApi = stateData.formApi stateList.formApi = stateData.formApi;
stateList.dict = stateData.dict stateList.dict = stateData.dict;
stateList.refreshTable = stateData.refreshTable stateList.refreshTable = stateData.refreshTable;
if(stateData.view){ if (stateData.view) {
stateList.view = stateData.view stateList.view = stateData.view;
} }
} }
if(data.data.page){ if (data.data.page) {
// console.log("data.data.mastesform", data.data) // console.log("data.data.mastesform", data.data)
stateForm.id=data.data.appForm.version.toString() stateForm.id = data.data.appForm.version.toString();
stateForm.formId =data.data.appForm.cfid.toString() stateForm.formId = data.data.appForm.cfid.toString();
stateForm.versionId =data.data.appForm.id.toString() stateForm.versionId = data.data.appForm.id.toString();
stateForm.formData = stringToObj(data.data.appForm.mastesform) stateForm.formData = stringToObj(data.data.appForm.mastesform);
stateForm.dict = string2json(data.data.appForm.dict) stateForm.dict = string2json(data.data.appForm.dict);
stateForm.formData.powerstr = string2json(data.data.appForm.powerstr) stateForm.formData.powerstr = string2json(data.data.appForm.powerstr);
// console.log("data.data.mastesform", stateForm.formData) // console.log("data.data.mastesform", stateForm.formData)
judgeSubmitCancel({"name":data.data.appForm.mastesformjson}) judgeSubmitCancel({ name: data.data.appForm.mastesformjson }).then(
.then((datajud:any) =>{ (datajud: any) => {
if(datajud.code == 0){ if (datajud.code == 0) {
if (datajud.data == 3 || datajud.data == 4){ if (datajud.data == 3 || datajud.data == 4) {
stateForm.formData.list.push(submitButton) stateForm.formData.list.push(submitButton);
} }
} }
})
} }
if(data.data.appFlow){ );
appFlowInfo.value = data.data.workFlow
} }
}) if (data.data.appFlow) {
appFlowInfo.value = data.data.workFlow;
} }
});
} }
};
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-06-03 09:26:17 @ 时间: 2024-06-03 09:26:17
@ 功能: 监听菜单数据变化 @ 功能: 监听菜单数据变化
*/ */
watch(() => props.pickAppMenu,(val:any) => { watch(
initLoadData() () => props.pickAppMenu,
},{ (val: any) => {
deep: true initLoadData();
}) },
{
function optionsValue3Get3(data: any,fieldName: string){ deep: true,
}
);
for(let i = 0; i < stateForm.formData.list.length; i++){ function optionsValue3Get3(data: any, fieldName: string) {
if(stateForm.formData.list[i].name==fieldName){ for (let i = 0; i < stateForm.formData.list.length; i++) {
stateForm.formData.list[i].options = [] if (stateForm.formData.list[i].name == fieldName) {
for(let j = 0;j<data.length;j++){ stateForm.formData.list[i].options = [];
stateForm.formData.list[i].options.push(data[j]) for (let j = 0; j < data.length; j++) {
stateForm.formData.list[i].options.push(data[j]);
} }
} }
} }
@ -316,13 +338,13 @@ function optionsValue3Get3(data: any,fieldName: string){
<template> <template>
<el-row> <el-row>
<el-col :span="24" class="pageBox pageHeader"> <el-col :span="24" class="pageBox pageHeader">
<el-text class="wordFont">{{ appFormTitle}}</el-text> <el-text class="wordFont">{{ appFormTitle }}</el-text>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<el-scrollbar class="scroBox"> <el-scrollbar class="scroBox">
<el-card class="tispMsg" shadow="always"> <el-card class="tispMsg" shadow="always">
<AppPageList
<AppPageList v-if="appInitData.pageList" v-if="appInitData.pageList"
:data="stateList.tableData" :data="stateList.tableData"
:search-data="stateList.searchData" :search-data="stateList.searchData"
:config="stateList.config" :config="stateList.config"
@ -363,33 +385,31 @@ function optionsValue3Get3(data: any,fieldName: string){
add-url="addData" add-url="addData"
@optionsValue3Get3="optionsValue3Get3" @optionsValue3Get3="optionsValue3Get3"
/> />
</el-card> </el-card>
</el-scrollbar> </el-scrollbar>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
<style lang='scss' scoped> <style lang="scss" scoped>
.pageBox{ .pageBox {
padding: 0 15px; padding: 0 15px;
.wordFont{ .wordFont {
font-size: 20px; font-size: 20px;
} }
} }
.pageHeader{ .pageHeader {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
background-color: #FFFFFF; background-color: #ffffff;
padding:15px 15px 5px 15px; padding: 15px 15px 5px 15px;
margin-bottom: 15px; margin-bottom: 15px;
} }
.scroBox{ .scroBox {
padding:0 15px; padding: 0 15px;
height: calc(100vh - 110px); height: calc(100vh - 110px);
.tispMsg{ .tispMsg {
margin:0 auto 15px auto; margin: 0 auto 15px auto;
} }
} }
</style> </style>

Write Preview
Loading…
Cancel
Save