12 changed files with 475 additions and 43 deletions
@ -0,0 +1,123 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2023-09-01 16:16:54 |
|||
@ 备注: |
|||
--> |
|||
<script lang='ts' setup> |
|||
import '@/assets/scss/element-var.scss' |
|||
import '@/assets/scss/index.scss' |
|||
import '@/assets/iconfont/iconfont.css' |
|||
import 'element-plus/dist/index.css' |
|||
import { |
|||
constGetControlByName, |
|||
constSetFormOptions, |
|||
constFormBtnEvent, |
|||
constControlChange, |
|||
constFormProps, |
|||
appendOrRemoveStyle |
|||
} from '@/api/DesignForm/utils' |
|||
const formData = { |
|||
list: [ |
|||
{ |
|||
type: "radio", |
|||
control: |
|||
{ |
|||
modelValue: "" |
|||
}, |
|||
options: [], |
|||
config: |
|||
{ |
|||
optionsType: 0 |
|||
}, |
|||
name: "radio1693383929154", |
|||
item: |
|||
{ |
|||
label: "单选框组" |
|||
} |
|||
}, |
|||
{ |
|||
type: "select", |
|||
control: |
|||
{ |
|||
modelValue: "", |
|||
appendToBody: true |
|||
}, |
|||
options: [], |
|||
config: |
|||
{ |
|||
optionsType: 0 |
|||
}, |
|||
name: "select1693383931223", |
|||
item: |
|||
{ |
|||
label: "下拉选择框" |
|||
} |
|||
}, |
|||
{ |
|||
type: "inputNumber", |
|||
control: |
|||
{ |
|||
modelValue: 0 |
|||
}, |
|||
config: |
|||
{}, |
|||
name: "inputNumber1693383932808", |
|||
item: |
|||
{ |
|||
label: "计数器" |
|||
} |
|||
}, |
|||
{ |
|||
type: "button", |
|||
control: |
|||
{ |
|||
label: "保存", |
|||
type: "success", |
|||
key: "submit" |
|||
}, |
|||
config: |
|||
{ |
|||
span: 6, |
|||
textAlign: "center" |
|||
} |
|||
}, |
|||
{ |
|||
type: "button", |
|||
control: |
|||
{ |
|||
label: "取消", |
|||
type: "danger", |
|||
key: "reset" |
|||
}, |
|||
config: |
|||
{ |
|||
span: 6, |
|||
textAlign: "center" |
|||
} |
|||
}], |
|||
form: |
|||
{ |
|||
size: "default", |
|||
name: "customer_form_157524328231997440", |
|||
formName: "未命名表单_157524328231997440" |
|||
}, |
|||
config: |
|||
{} |
|||
} |
|||
const formProps = computed(() => { |
|||
return { |
|||
type: 3 |
|||
} |
|||
}) |
|||
provide(constFormProps, formProps) |
|||
</script> |
|||
<template> |
|||
<el-card shadow="never"> |
|||
<ak-form :formData="formData"></ak-form> |
|||
</el-card> |
|||
|
|||
|
|||
</template> |
|||
<style lang='scss' scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,147 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2023-09-01 10:37:02 |
|||
@ 备注: setupCustomerFormCont |
|||
--> |
|||
<script lang='ts' setup> |
|||
import { Hide, View } from '@element-plus/icons-vue' |
|||
import { setupCustomerFormCont } from "@/api/DesignForm/type"; |
|||
import { getOneProductionForm,saveSetupCont } from '@/api/DesignForm/requestapi' |
|||
import { getOrgTreeList } from '@/api/hr/org/index' |
|||
const orgOptionsList = ref<any>(); //行政组织树 |
|||
const props = defineProps({ |
|||
show:{ |
|||
type:Boolean, |
|||
default:true |
|||
}, |
|||
editid:{ |
|||
type:String, |
|||
default:"" |
|||
}, |
|||
}) |
|||
const emits = defineEmits(["update:show","handlequery"]); |
|||
const isShow = computed({ |
|||
get: () => props.show, |
|||
set: (val) => { |
|||
emits("update:show", val); |
|||
}, |
|||
}); |
|||
const dataInfo = reactive<setupCustomerFormCont>({ |
|||
id:0, |
|||
name:"", |
|||
permit:[], |
|||
states:1, |
|||
status:true |
|||
}) |
|||
//级联选择器配置 |
|||
const caseProps = { |
|||
value: "id", |
|||
label: "name", |
|||
children: "child", |
|||
multiple: true, |
|||
} |
|||
//关闭弹窗 |
|||
function closeDialog(){ |
|||
emits("update:show", false); |
|||
initData(); |
|||
} |
|||
//保存数据 |
|||
function setupSave(){ |
|||
// console.log("保存数据---->",dataInfo) |
|||
dataInfo.permit = JSON.stringify(dataInfo.permit) |
|||
saveSetupCont(dataInfo) |
|||
.then((res:any) => { |
|||
// console.log("保存数据---->",res) |
|||
|
|||
if(res.code == 0){ |
|||
ElMessage.success(res.msg || '加载异常') |
|||
}else{ |
|||
ElMessage.error(res.msg || '加载异常') |
|||
} |
|||
}) |
|||
.finally(() => { |
|||
closeDialog() |
|||
}) |
|||
} |
|||
//初始化数据 |
|||
function initData(){ |
|||
dataInfo.id = 0, |
|||
dataInfo.name = "", |
|||
dataInfo.permit = [], |
|||
dataInfo.states = 1, |
|||
dataInfo.status = true |
|||
orgOptionsList.value?.splice(orgOptionsList.value.length); |
|||
} |
|||
//监听变化 |
|||
watch(()=>props.show,()=>{ |
|||
if(props.show){ |
|||
getOneProductionForm({id:props.editid}) |
|||
.then((res:any) => { |
|||
dataInfo.id = res.data.id |
|||
dataInfo.name = res.data.name |
|||
dataInfo.permit = res.data.permit_list |
|||
dataInfo.states = res.data.states |
|||
if(res.data.states == 1){ |
|||
dataInfo.status = true |
|||
}else{ |
|||
dataInfo.status = false |
|||
} |
|||
console.log(dataInfo) |
|||
}) |
|||
.finally(()=>{}) |
|||
getOrgTreeList({}) |
|||
.then(({ data })=>{ |
|||
orgOptionsList.value = data |
|||
}) |
|||
}else{ |
|||
initData() |
|||
} |
|||
}) |
|||
watch(()=>dataInfo.status,()=>{ |
|||
if(dataInfo.status){ |
|||
dataInfo.states = 1 |
|||
}else{ |
|||
dataInfo.states = 2 |
|||
} |
|||
}) |
|||
</script> |
|||
<template> |
|||
<el-dialog v-model="isShow" title="Tips" width="30%" draggable> |
|||
<el-form :model="dataInfo" label-width="80px"> |
|||
<el-form-item label="表单名称"> |
|||
<el-input v-model="dataInfo.name" /> |
|||
</el-form-item> |
|||
<el-form-item label="可见范围"> |
|||
<el-cascader |
|||
v-model="dataInfo.permit" |
|||
collapse-tags |
|||
collapse-tags-tooltip |
|||
clearable |
|||
:options="orgOptionsList" |
|||
:props="caseProps" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="状态"> |
|||
<el-switch |
|||
v-model="dataInfo.status" |
|||
:active-action-icon="View" |
|||
:inactive-action-icon="Hide" |
|||
active-text="启用" |
|||
inactive-text="禁用" |
|||
style=" --el-switch-off-color: #ff4949" |
|||
inline-prompt |
|||
size="large" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="closeDialog">取消</el-button> |
|||
<el-button type="primary" @click="setupSave">设置</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
<style lang='scss' scoped> |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue