编辑弹窗点击门窗消失问题处理

This commit is contained in:
Jason 2022-09-15 14:17:58 +08:00
parent b23ce97102
commit 867845a2dd
14 changed files with 161 additions and 179 deletions

View File

@ -26,7 +26,7 @@
</el-select> </el-select>
<el-input <el-input
v-else v-else
v-model="inputValue" v-model.trim="inputValue"
:type="type" :type="type"
size="small" size="small"
:placeholder="placeholder" :placeholder="placeholder"

View File

@ -78,7 +78,7 @@ export default defineComponent({
clickModalClose: { clickModalClose: {
// //
type: Boolean, type: Boolean,
default: true default: false
}, },
center: { center: {
// //

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -45,7 +45,7 @@
}, },
{ {
label: '女', label: '女',
value: 0 value: 2
} }
]" ]"
@confirm="handleEdit($event, 'sex')" @confirm="handleEdit($event, 'sex')"
@ -79,6 +79,7 @@
import type { FormInstance } from 'element-plus' import type { FormInstance } from 'element-plus'
import { getUserDetail, userEdit } from '@/api/consumer' import { getUserDetail, userEdit } from '@/api/consumer'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import { isEmpty } from '@/utils/util'
const route = useRoute() const route = useRoute()
const formData = reactive({ const formData = reactive({
@ -108,7 +109,7 @@ const getDetails = async () => {
} }
const handleEdit = async (value: string, field: string) => { const handleEdit = async (value: string, field: string) => {
if (!value) return if (isEmpty(value)) return
await userEdit({ await userEdit({
id: route.query.id, id: route.query.id,
field, field,

View File

@ -5,7 +5,6 @@
title="设置存储" title="设置存储"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >
@ -37,7 +36,7 @@
</el-form-item> </el-form-item>
<el-form-item label="排序" prop="sort"> <el-form-item label="排序" prop="sort">
<div> <div>
<el-input-number v-model="formData.sort" :min="0"/> <el-input-number v-model="formData.sort" :min="0" />
<div class="form-tips">默认为0 数值越大越排前</div> <div class="form-tips">默认为0 数值越大越排前</div>
</div> </div>
</el-form-item> </el-form-item>
@ -71,17 +70,17 @@ const formData = reactive({
isStop: 0 isStop: 0
}) })
const checkMobile = (rule: any, value: any, callback: any) => { const checkMobile = (rule: any, value: any, callback: any) => {
if (!value) { if (!value) {
return callback(new Error('手机号不能为空')); return callback(new Error('手机号不能为空'))
} else {
const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
console.log(reg.test(value));
if (reg.test(value)) {
callback();
} else { } else {
return callback(new Error('请输入正确的手机号')); const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
console.log(reg.test(value))
if (reg.test(value)) {
callback()
} else {
return callback(new Error('请输入正确的手机号'))
}
} }
}
} }
const formRules = { const formRules = {
pid: [ pid: [
@ -98,24 +97,24 @@ const formRules = {
trigger: ['blur'] trigger: ['blur']
} }
], ],
duty: [ duty: [
{ {
required: true, required: true,
message: '请输入负责人姓名', message: '请输入负责人姓名',
trigger: ['blur'] trigger: ['blur']
} }
], ],
mobile: [ mobile: [
{ {
required: true, required: true,
message: '请输入联系电话', message: '请输入联系电话',
trigger: ['blur'] trigger: ['blur']
}, },
{ {
validator: checkMobile, validator: checkMobile,
trigger: ['blur'] trigger: ['blur']
} }
] ]
} }
const { optionsData } = useDictOptions<{ const { optionsData } = useDictOptions<{

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >
@ -18,7 +17,7 @@
</el-form-item> </el-form-item>
<el-form-item label="排序" prop="sort"> <el-form-item label="排序" prop="sort">
<div> <div>
<el-input-number v-model="formData.sort" :min="0"/> <el-input-number v-model="formData.sort" :min="0" />
<div class="form-tips">默认为0 数值越大越排前</div> <div class="form-tips">默认为0 数值越大越排前</div>
</div> </div>
</el-form-item> </el-form-item>

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,116 +5,110 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >
<el-scrollbar class="h-[400px] sm:h-[500px]"> <el-form ref="formRef" :model="formData" label-width="80px" :rules="formRules">
<el-form ref="formRef" :model="formData" label-width="80px" :rules="formRules"> <el-form-item label="菜单类型" prop="menuType" required>
<el-form-item label="菜单类型" prop="menuType" required> <el-radio-group v-model="formData.menuType">
<el-radio-group v-model="formData.menuType"> <el-radio :label="MenuEnum.CATALOGUE">目录</el-radio>
<el-radio :label="MenuEnum.CATALOGUE">目录</el-radio> <el-radio :label="MenuEnum.MENU">菜单</el-radio>
<el-radio :label="MenuEnum.MENU">菜单</el-radio> <el-radio :label="MenuEnum.BUTTON">按钮</el-radio>
<el-radio :label="MenuEnum.BUTTON">按钮</el-radio> </el-radio-group>
</el-radio-group> </el-form-item>
</el-form-item> <el-form-item label="父级菜单" prop="pid">
<el-form-item label="父级菜单" prop="pid"> <el-tree-select
<el-tree-select class="flex-1"
class="flex-1" v-model="formData.pid"
v-model="formData.pid" :data="menuOptions"
:data="menuOptions" clearable
clearable node-key="id"
node-key="id" :props="{
:props="{ label: 'menuName'
label: 'menuName' }"
}" :default-expand-all="true"
:default-expand-all="true" placeholder="请选择父级菜单"
placeholder="请选择父级菜单" check-strictly
check-strictly />
/> </el-form-item>
</el-form-item> <el-form-item label="菜单名称" prop="menuName">
<el-form-item label="菜单名称" prop="menuName"> <el-input v-model="formData.menuName" placeholder="请输入菜单名称" />
<el-input v-model="formData.menuName" placeholder="请输入菜单名称" /> </el-form-item>
</el-form-item> <el-form-item
<el-form-item v-if="formData.menuType != MenuEnum.BUTTON"
v-if="formData.menuType != MenuEnum.BUTTON" label="菜单图标"
label="菜单图标" prop="menuIcon"
prop="menuIcon" >
> <icon-picker class="flex-1" v-model="formData.menuIcon" />
<icon-picker class="flex-1" v-model="formData.menuIcon" /> </el-form-item>
</el-form-item>
<el-form-item <el-form-item
v-if="formData.menuType != MenuEnum.BUTTON" v-if="formData.menuType != MenuEnum.BUTTON"
label="路由路径" label="路由路径"
prop="paths" prop="paths"
> >
<div class="flex-1">
<el-input v-model="formData.paths" placeholder="请输入路由路径" />
<div class="form-tips">
访问的路由地址`admin`如外网地址需内链访问则以`http(s)://`开头
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.menuType == MenuEnum.MENU"
label="组件路径"
prop="component"
>
<div class="flex-1">
<el-autocomplete
class="w-full"
v-model="formData.component"
:fetch-suggestions="querySearch"
clearable
placeholder="请输入组件路径"
/>
<!-- <el-input v-model="formData.component" placeholder="请输入组件路径" /> -->
<div class="form-tips">
访问的组件路径`permission/admin/index`默认在`views`目录下
</div>
</div>
</el-form-item>
<el-form-item label="选中菜单" prop="p" v-if="formData.menuType == MenuEnum.MENU">
<div class="flex-1">
<el-input v-model="formData.selected" placeholder="请输入路由路径" />
<div class="form-tips">
访问详情页面编辑页面时菜单高亮显示`/consumer/lists`
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.menuType != MenuEnum.CATALOGUE"
label="权限字符"
prop="perms"
>
<div class="flex-1">
<el-input v-model="formData.perms" placeholder="请输入权限字符" />
<div class="form-tips">
将作为server端API验权使用`system:admin:list`请谨慎修改
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.menuType == MenuEnum.MENU"
label="路由参数"
prop="params"
>
<div>
<div class="flex-1"> <div class="flex-1">
<el-input v-model="formData.paths" placeholder="请输入路由路径" /> <el-input v-model="formData.params" placeholder="请输入路由参数" />
<div class="form-tips">
访问的路由地址`admin`如外网地址需内链访问则以`http(s)://`开头
</div>
</div> </div>
</el-form-item> <div class="form-tips">
<el-form-item 访问路由的默认传递参数`{"id": 1, "name":
v-if="formData.menuType == MenuEnum.MENU" "admin"}``id=1&name=admin`
label="组件路径"
prop="component"
>
<div class="flex-1">
<el-autocomplete
class="w-full"
v-model="formData.component"
:fetch-suggestions="querySearch"
clearable
placeholder="请输入组件路径"
/>
<!-- <el-input v-model="formData.component" placeholder="请输入组件路径" /> -->
<div class="form-tips">
访问的组件路径`permission/admin/index`默认在`views`目录下
</div>
</div> </div>
</el-form-item> </div>
<el-form-item </el-form-item>
label="选中菜单" <!-- <el-form-item
prop="p"
v-if="formData.menuType == MenuEnum.MENU"
>
<div class="flex-1">
<el-input v-model="formData.selected" placeholder="请输入路由路径" />
<div class="form-tips">
访问详情页面编辑页面时菜单高亮显示`/consumer/lists`
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.menuType != MenuEnum.CATALOGUE"
label="权限字符"
prop="perms"
>
<div class="flex-1">
<el-input v-model="formData.perms" placeholder="请输入权限字符" />
<div class="form-tips">
将作为server端API验权使用`system:admin:list`请谨慎修改
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.menuType == MenuEnum.MENU"
label="路由参数"
prop="params"
>
<div>
<div class="flex-1">
<el-input v-model="formData.params" placeholder="请输入路由参数" />
</div>
<div class="form-tips">
访问路由的默认传递参数`{"id": 1, "name":
"admin"}``id=1&name=admin`
</div>
</div>
</el-form-item>
<!-- <el-form-item
v-if="formData.menuType == MenuEnum.MENU" v-if="formData.menuType == MenuEnum.MENU"
label="是否缓存" label="是否缓存"
prop="isCache" prop="isCache"
@ -128,46 +122,43 @@
<div class="form-tips">选择缓存则会被`keep-alive`缓存</div> <div class="form-tips">选择缓存则会被`keep-alive`缓存</div>
</div> </div>
</el-form-item> --> </el-form-item> -->
<el-form-item <el-form-item
v-if="formData.menuType != MenuEnum.BUTTON" v-if="formData.menuType != MenuEnum.BUTTON"
label="是否显示" label="是否显示"
prop="isShow" prop="isShow"
required required
> >
<div> <div>
<el-radio-group v-model="formData.isShow"> <el-radio-group v-model="formData.isShow">
<el-radio :label="1">显示</el-radio> <el-radio :label="1">显示</el-radio>
<el-radio :label="0">隐藏</el-radio> <el-radio :label="0">隐藏</el-radio>
</el-radio-group> </el-radio-group>
<div class="form-tips"> <div class="form-tips">
选择隐藏则路由将不会出现在侧边栏但仍然可以访问 选择隐藏则路由将不会出现在侧边栏但仍然可以访问
</div>
</div> </div>
</el-form-item> </div>
<el-form-item </el-form-item>
v-if="formData.menuType != MenuEnum.BUTTON" <el-form-item
label="菜单状态" v-if="formData.menuType != MenuEnum.BUTTON"
prop="isDisable" label="菜单状态"
required prop="isDisable"
> required
<div> >
<el-radio-group v-model="formData.isDisable"> <div>
<el-radio :label="0">正常</el-radio> <el-radio-group v-model="formData.isDisable">
<el-radio :label="1">停用</el-radio> <el-radio :label="0">正常</el-radio>
</el-radio-group> <el-radio :label="1">停用</el-radio>
<div class="form-tips"> </el-radio-group>
选择停用则路由将不会出现在侧边栏也不能被访问 <div class="form-tips">选择停用则路由将不会出现在侧边栏也不能被访问</div>
</div> </div>
</div> </el-form-item>
</el-form-item> <el-form-item label="菜单排序" prop="menuSort">
<el-form-item label="菜单排序" prop="menuSort"> <div>
<div> <el-input-number v-model="formData.menuSort" />
<el-input-number v-model="formData.menuSort" /> <div class="form-tips">数值越大越排前</div>
<div class="form-tips">数值越大越排前</div> </div>
</div> </el-form-item>
</el-form-item> </el-form>
</el-form>
</el-scrollbar>
</popup> </popup>
</div> </div>
</template> </template>

View File

@ -5,7 +5,6 @@
title="权限设置" title="权限设置"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,7 +5,6 @@
:title="popupTitle" :title="popupTitle"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >

View File

@ -5,7 +5,6 @@
title="设置存储" title="设置存储"
:async="true" :async="true"
width="550px" width="550px"
:clickModalClose="true"
@confirm="handleSubmit" @confirm="handleSubmit"
@close="handleClose" @close="handleClose"
> >