11 changed files with 452 additions and 52 deletions
@ -0,0 +1,169 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2024-03-21 09:51:02 |
|||
@ 备注: 自定义表单分组内容列表 |
|||
--> |
|||
<script lang='ts' setup> |
|||
import { customerFormCont } from "@/api/DesignForm/type"; |
|||
import { getCustomerFormList } from '@/api/DesignForm/requestapi' |
|||
import {Delete,Edit,View,MoreFilled} from '@element-plus/icons-vue' |
|||
|
|||
import LowCodeFormPage from "@/views/sysworkflow/lowcodepage/lowCodeFormPage.vue" |
|||
import TaskCustomerForm from '@/views/taskplatform/taskmanagement/taskcustomerformnew.vue' |
|||
|
|||
|
|||
const props = defineProps({ |
|||
groupId:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
drawerWith:{ |
|||
type:Number, |
|||
default:true |
|||
}, |
|||
formKey:{ |
|||
type:String, |
|||
default:"" |
|||
} |
|||
}); |
|||
|
|||
const emits = defineEmits(["update:formKey"]); |
|||
|
|||
//表单ID |
|||
const formKeyStr = computed({ |
|||
get() { |
|||
return props.formKey |
|||
}, |
|||
set(val: formStruct) { |
|||
emits('update:formKey', val) |
|||
} |
|||
}); |
|||
const formId = ref<string>("") |
|||
const versionTitle = ref<string>("") //表单名称 |
|||
const versionId = ref<string>("") //表单版本号 |
|||
const addFormIsShow = ref(false) |
|||
const openTaskDrawer = ref(false) //新增任务 |
|||
const squareUrl = ref<string>('https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png') |
|||
const pageApp = ref<number>(1) //页码 |
|||
const pageAppSize = ref<number>(12) //每页显示几个 |
|||
const pageAppTotal = ref<number>(0) //总记录数 |
|||
const contList = ref<customerFormCont[]>() |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2024-03-21 10:54:23 |
|||
@ 功能: 获取表单列表 |
|||
*/ |
|||
const getFormAppList = () => { |
|||
let sendInfo = { |
|||
page:pageApp.value, |
|||
pagesize:pageAppSize.value, |
|||
groupId:props.groupId |
|||
} |
|||
getCustomerFormList(sendInfo) |
|||
.then(({ data }) => { |
|||
// console.log("搜索表单-->",data); |
|||
pageAppTotal.value = data.total |
|||
contList.value = data.list |
|||
}) |
|||
.finally(() => {}) |
|||
} |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2024-03-21 13:39:51 |
|||
@ 功能: 创建表单任务 |
|||
*/ |
|||
const startUsing = (id:string,title:string) => { |
|||
versionId.value = id |
|||
versionTitle.value = title |
|||
openTaskDrawer.value = true |
|||
} |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2024-03-21 10:57:11 |
|||
@ 功能: 编辑表单 |
|||
*/ |
|||
const editFormApp = (id:string) => { |
|||
formId.value = id.toString() |
|||
addFormIsShow.value= true |
|||
console.log("编辑表单",id,"-",formId.value,"-",addFormIsShow.value) |
|||
} |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2024-03-09 09:06:44 |
|||
@ 功能: 刷新页面 |
|||
*/ |
|||
const refreshPage = (pageType:string) =>{ |
|||
addFormIsShow.value = false; |
|||
getFormAppList() |
|||
} |
|||
onMounted(()=>{ |
|||
getFormAppList() |
|||
}) |
|||
</script> |
|||
<template> |
|||
<div> |
|||
<el-row :gutter="10" > |
|||
<el-col v-for="item in contList" :key="item.id" :xs="8" :sm="12" :md="8" :lg="8" :xl="8" style=" margin-top: 10px;"> |
|||
<el-card class="cardpattern" body-style="padding:5px;"> |
|||
<img |
|||
v-if="item.icon==''" |
|||
:src="squareUrl" |
|||
title="示例图片" |
|||
class="picture" |
|||
@click.top="startUsing(item.id,item.name)" |
|||
/> |
|||
<img |
|||
v-else |
|||
:src="item.icon" |
|||
title="示例图片" |
|||
class="picture" |
|||
@click.top="startUsing(item.id,item.name)" |
|||
/> |
|||
<div class="cardhead"> |
|||
<el-text class="w-150px mb-2" truncated :title="item.name" @click.top="startUsing(item.id,item.name)">{{item.name}}</el-text> |
|||
</div> |
|||
<el-row> |
|||
<el-col :span="8" class="but_centent"> |
|||
<el-button size="small" circle class="button" :icon="View"></el-button> |
|||
</el-col> |
|||
<el-col :span="8" class="but_centent"> |
|||
<el-button size="small" circle class="button" :icon="Edit" @click="editFormApp(item.idStr)"></el-button> |
|||
</el-col> |
|||
<el-col :span="8" class="but_centent"> |
|||
<el-button size="small" circle class="button" :icon="Delete" @click="() => deleteCard(index)"></el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</el-card> |
|||
</el-col> |
|||
</el-row> |
|||
<div class="formGroupPage"> |
|||
<el-pagination layout="prev, pager, next" v-model:current-page="pageApp" :page-size="pageAppSize" :total="pageAppTotal" /> |
|||
</div> |
|||
<TaskCustomerForm v-model:isopen="openTaskDrawer" :versionid="versionId" :versiontitle="versionTitle" :drawerwith="props.drawerWith" @searchquery="getFormAppList" /> |
|||
<LowCodeFormPage v-if="addFormIsShow" :drawer-with="props.drawerWith" v-model:form-key="formId" @refreshPage="refreshPage" /> |
|||
</div> |
|||
</template> |
|||
<style lang='scss' scoped> |
|||
.cardhead{ |
|||
padding: 5px 0; |
|||
} |
|||
.formGroupPage{ |
|||
width:100%; |
|||
text-align: center; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
/* 图片 */ |
|||
.picture { |
|||
height: 100%; |
|||
min-height: 50px; |
|||
max-height: 100px; |
|||
display: block; |
|||
width: 100%; |
|||
min-width: 50px; |
|||
} |
|||
.but_centent{ |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue