parent
bcb21b93cd
commit
0d11e6a80d
@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<vxe-modal class-name="csty-bi-lei-qi-form" v-model="refShow" width="800" height="360" show-zoom show-footer
|
||||
:mask-closable=true>
|
||||
<template #title>
|
||||
<span style="color:#ffffff">{{ modalTitle }}</span>
|
||||
</template>
|
||||
<template #default>
|
||||
<a-card :bordered="false">
|
||||
<vxe-form title-colon ref="refFormA" title-align="right" title-width="150" :data="formDataA"
|
||||
:rules="formRulesA" @submit="fnSubmitA">
|
||||
<vxe-form-gather span="24">
|
||||
<vxe-form-item span="24">
|
||||
<template #default="params">
|
||||
<div
|
||||
style="font-size: larger;border-bottom: solid 1px #606266;padding: 0px 0px 5px 0px;">
|
||||
用户信息
|
||||
</div>
|
||||
</template>
|
||||
</vxe-form-item>
|
||||
</vxe-form-gather>
|
||||
<vxe-form-gather span="24">
|
||||
<vxe-form-item title="用户名" field="UserName" span="20">
|
||||
<template #default="params">
|
||||
<vxe-input v-model="params.data.UserName" placeholder="请输入用户名" clearable :disabled="formTypeA == add"
|
||||
@change="fnChangeA(params)"></vxe-input>
|
||||
</template>
|
||||
</vxe-form-item>
|
||||
<vxe-form-item title="新密码" field="Password" span="24">
|
||||
<template #default="params">
|
||||
<vxe-input v-model="params.data.Password" placeholder="请输入新密码" clearable
|
||||
@change="fnChangeA(params)"></vxe-input>
|
||||
</template>
|
||||
</vxe-form-item>
|
||||
</vxe-form-gather>
|
||||
</vxe-form>
|
||||
</a-card>
|
||||
</template>
|
||||
<template #footer>
|
||||
<vxe-button type="submit" status="primary" content="保存" @click="fnSubmitA"></vxe-button>
|
||||
<vxe-button type="reset" content="取消" @click="fnEventCancel"></vxe-button>
|
||||
</template>
|
||||
</vxe-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="BiLeiQiForm">
|
||||
import { ref, onMounted, computed } from 'vue'
|
||||
import { map as _map } from 'lodash'
|
||||
import { VXETable } from 'vxe-table'
|
||||
import * as comApi from '@/api/gw/com'
|
||||
|
||||
// 定义事件[success]
|
||||
const emit = defineEmits(['success'])
|
||||
// 是否显示
|
||||
const refShow = ref(false)
|
||||
// 弹窗标题
|
||||
const modalTitle = ref('未知表单')
|
||||
// 表单
|
||||
const refFormA = ref()
|
||||
// 表单类型[add - 新增|update - 修改|del - 删除]
|
||||
const formTypeA: any = ref('')
|
||||
// 表单A - 初始数据
|
||||
const formDataAInit: any = {
|
||||
Id: 0,
|
||||
UserName: "",
|
||||
Password: ""
|
||||
}
|
||||
const fnChangeA = (params: any) => {
|
||||
const $form = refFormA.value
|
||||
if ($form) {
|
||||
$form.updateStatus(params)
|
||||
}
|
||||
}
|
||||
// 表单数据
|
||||
const formDataA: any = ref(formDataAInit)
|
||||
// 表单规则
|
||||
const formRulesA: any = ref({
|
||||
Password: [
|
||||
{ required: true, message: '密码不能为空' }
|
||||
]
|
||||
})
|
||||
|
||||
// 挂载
|
||||
onMounted(() => {
|
||||
})
|
||||
// 打开弹窗
|
||||
const open = async (type: string, row?: any) => {
|
||||
formTypeA.value = type
|
||||
await fnResetA()
|
||||
switch (type) {
|
||||
case 'add':
|
||||
refShow.value = true
|
||||
modalTitle.value = '添加用户'
|
||||
break;
|
||||
case 'edit':
|
||||
refShow.value = true
|
||||
modalTitle.value = '修改密码'
|
||||
const paramsA = {
|
||||
"filter": {
|
||||
"field": "ID",
|
||||
"operator": "Eq",
|
||||
"value": row.ID
|
||||
}
|
||||
}
|
||||
const rowInfoA = await comApi.getUser(paramsA)
|
||||
console.log(rowInfoA)
|
||||
formDataA.value = rowInfoA.Data
|
||||
break;
|
||||
}
|
||||
}
|
||||
// 提交
|
||||
const fnSubmitA = async () => {
|
||||
switch (formTypeA.value) {
|
||||
case 'add':
|
||||
const paramsA = {
|
||||
data: formDataA.value
|
||||
}
|
||||
await comApi.saveUser(paramsA)
|
||||
VXETable.modal.message({ content: '新增成功', status: 'success' })
|
||||
break;
|
||||
case 'edit':
|
||||
let setVal: any = _map(formDataA.value, (o1, k1) => {
|
||||
return { field: k1, value: o1 }
|
||||
})
|
||||
const paramsB = {
|
||||
filter: {
|
||||
field: 'ID',
|
||||
value: formDataA.value.ID
|
||||
},
|
||||
set: setVal
|
||||
}
|
||||
await comApi.editUser(paramsB)
|
||||
VXETable.modal.message({ content: '修改成功', status: 'success' })
|
||||
break;
|
||||
}
|
||||
refShow.value = false
|
||||
emit('success')
|
||||
}
|
||||
|
||||
// 提供open方法打开弹窗
|
||||
defineExpose({ open })
|
||||
// 重置
|
||||
const fnResetA = () => {
|
||||
formDataA.value = formDataAInit
|
||||
}
|
||||
// 关闭窗体
|
||||
const fnEventCancel = () => {
|
||||
refShow.value = false
|
||||
}
|
||||
</script>
|
||||
<style scoped></style>
|
Loading…
Reference in new issue