herenshan112
20 hours ago
4 changed files with 254 additions and 6 deletions
@ -0,0 +1,248 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2023-09-26 09:12:55 |
|||
@ 备注: 编辑自定义表单数据 |
|||
--> |
|||
<script lang='ts' setup> |
|||
import { ref, reactive, onMounted, computed, nextTick } from 'vue' |
|||
import { useRouter } from 'vue-router' |
|||
import { |
|||
string2json, |
|||
stringToObj |
|||
} from '@/utils/DesignForm/form' |
|||
|
|||
import { haveCustomerFormVersion } from '@/api/taskapi/management' |
|||
import { judgeSubmitCancel } from '@/api/DesignForm/requestapi' |
|||
|
|||
import '@/assets/scss/element-var.scss' |
|||
import '@/assets/scss/index.scss' |
|||
import '@/assets/iconfont/iconfont.css' |
|||
import 'element-plus/dist/index.css' |
|||
|
|||
const props = defineProps({ |
|||
iseditopen:{ |
|||
type:Boolean, |
|||
default:true |
|||
}, |
|||
versionid:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
versiontitle:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
masterskey:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
infoid:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
drawerwith:{ |
|||
type:Number, |
|||
default:0 |
|||
} |
|||
}) |
|||
const submitButton = { |
|||
type: "div", |
|||
control:{}, |
|||
config:{ |
|||
textAlign: "center", |
|||
span: "" |
|||
}, |
|||
list: [ |
|||
{ |
|||
type: "button", |
|||
control:{ |
|||
label: "保存", |
|||
type: "primary", |
|||
key: "submit" |
|||
}, |
|||
config:{ |
|||
textAlign: "center" |
|||
} |
|||
} |
|||
] |
|||
} |
|||
const cancelButton = { |
|||
type: "div", |
|||
control:{}, |
|||
config:{ |
|||
textAlign: "center", |
|||
span: "" |
|||
}, |
|||
list: [ |
|||
{ |
|||
type: "button", |
|||
control:{ |
|||
label: "返回", |
|||
type: "danger", |
|||
key: "cancel" |
|||
}, |
|||
config:{ |
|||
textAlign: "center" |
|||
} |
|||
} |
|||
] |
|||
} |
|||
const submitAndCancelButton = { |
|||
type: "div", |
|||
control:{}, |
|||
config:{ |
|||
span: 24, |
|||
textAlign: "center" |
|||
}, |
|||
list: [ |
|||
{ |
|||
type: "button", |
|||
control:{ |
|||
label: "保存", |
|||
type: "primary", |
|||
key: "submit" |
|||
}, |
|||
config:{ |
|||
span: 0 |
|||
} |
|||
}, |
|||
{ |
|||
type: "button", |
|||
control:{ |
|||
label: "返回", |
|||
type: "danger", |
|||
key: "cancel" |
|||
}, |
|||
config:{ |
|||
span: 0 |
|||
} |
|||
} |
|||
] |
|||
}; |
|||
const loadingData = ref(false) |
|||
const formEl = ref() |
|||
const state = reactive<any>({ |
|||
type: 1, // 1新增；2修改；3查看（表单模式） ；4查看； 5设计 |
|||
formData: { |
|||
list: [], |
|||
form: {}, |
|||
config: {} |
|||
}, |
|||
dict: {}, |
|||
formId: props.versionid, |
|||
id: props.masterskey, |
|||
loading: true |
|||
}) |
|||
const formType = computed(() => { |
|||
// 带有参数id为编辑状态 |
|||
if (props.infoid) { |
|||
return 2 |
|||
} else { |
|||
return 1 |
|||
} |
|||
}) |
|||
const emits = defineEmits(["update:iseditopen","searchquery"]); |
|||
const isShow = computed({ |
|||
get: () => props.iseditopen, |
|||
set: (val) => { |
|||
emits("update:iseditopen", val); |
|||
}, |
|||
}); |
|||
//获取表单数据 |
|||
const getTaskFormData = () =>{ |
|||
loadingData.value = true; |
|||
haveCustomerFormVersion({id:props.versionid}) |
|||
.then(({ data }) =>{ |
|||
// console.log("表单数据",data) |
|||
state.id=props.versionid |
|||
state.formData = stringToObj(data.mastesform) |
|||
state.dict = string2json(data.dict) |
|||
|
|||
judgeSubmitCancel({"name":data.mastesformjson}) |
|||
.then((data:any) =>{ |
|||
if(data.code == 0){ |
|||
if (data.data == 3 || data.data == 4){ |
|||
state.formData.list.push(submitButton) |
|||
} |
|||
} |
|||
}) |
|||
}) |
|||
.finally(()=>{ |
|||
formEl.value.getData({ formId: props.versionid, id: props.masterskey}) |
|||
loadingData.value = false; |
|||
}) |
|||
} |
|||
|
|||
const drawerWith = ref<number>(0); |
|||
onMounted(()=>{ |
|||
drawerWith.value = window.innerWidth - 220 |
|||
|
|||
}); |
|||
window.addEventListener("resize", function(){ |
|||
drawerWith.value = window.innerWidth -220 |
|||
}) |
|||
const beforeSubmit = (params: any) => { |
|||
params.formId = props.masterskey |
|||
params.id = props.versionid |
|||
// emits("update:isopen", false); |
|||
// console.log(params,"===========================>") |
|||
return params |
|||
} |
|||
const afterSubmit = (type: string) => { |
|||
if (type === 'success') { |
|||
// router.go(-1) |
|||
// console.log("表单提交成功") |
|||
emits("searchquery"); |
|||
closeAppSubmit(); |
|||
|
|||
} |
|||
} |
|||
const closeAppSubmit = () => { |
|||
emits("update:iseditopen", false); |
|||
initData(); |
|||
} |
|||
const initData = () => { |
|||
state.formData = { |
|||
list: [], |
|||
form: {}, |
|||
config: {} |
|||
}; |
|||
state.dict = {}; |
|||
state.formId = 0; |
|||
state.id = 0; |
|||
state.loading = true; |
|||
} |
|||
watch(()=>props.iseditopen,()=>{ |
|||
if(props.iseditopen){ |
|||
getTaskFormData(); |
|||
}else{ |
|||
initData() |
|||
} |
|||
}) |
|||
const changeKeyVal = (key:any,val:any,type:any,attribute:any) => { |
|||
|
|||
} |
|||
</script> |
|||
<template> |
|||
<el-drawer v-model="isShow" v-loading="loadingData" :title="versiontitle" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="props.drawerwith" class="drawerClass" > |
|||
<div class="drawerBody"> |
|||
<ak-form |
|||
ref="formEl" |
|||
:form-data="state.formData" |
|||
:type="formType" |
|||
:dict="state.dict" |
|||
request-url="getFormContent" |
|||
add-url="saveFormContent" |
|||
edit-url="editFormContent" |
|||
:before-submit="beforeSubmit" |
|||
:after-submit="afterSubmit" |
|||
:close-app-submit="closeAppSubmit" |
|||
:change-key-val="changeKeyVal" |
|||
/> |
|||
</div> |
|||
|
|||
</el-drawer> |
|||
</template> |
|||
<style lang='scss' scoped> |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue