dialog 标题

This commit is contained in:
吕金泽 2022-01-28 12:13:17 +08:00
parent 5d793cde19
commit 8b7a73d452
8 changed files with 94 additions and 136 deletions

View File

@ -1,16 +1,15 @@
<template> <template>
<el-dialog v-el-drag-dialog :fullscreen="fullscreen" :width="width" :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" :append-to-body="true" @opened="opened"> <el-dialog v-el-drag-dialog :fullscreen="fullscreen" :width="width" :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" :append-to-body="true" @opened="opened">
<template v-if="content"> <slot name="content" />
{{ content }}
</template>
<slot v-else name="content" />
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<slot name="btns">
<el-button @click="dialogVisible = false"> <el-button @click="dialogVisible = false">
关闭 关闭
</el-button> </el-button>
<el-button type="primary" @click="confirmClick"> <el-button type="primary" @click="confirmClick">
确认 确认
</el-button> </el-button>
</slot>
</div> </div>
</el-dialog> </el-dialog>
</template> </template>
@ -23,11 +22,6 @@ export default {
type: String, type: String,
default: '' default: ''
}, },
content: {
type: String,
default: '',
require: false
},
width: { width: {
type: String, type: String,
default: '50%' default: '50%'

View File

@ -19,7 +19,8 @@
<pd-table ref="table" v-bind="tableOptions" /> <pd-table ref="table" v-bind="tableOptions" />
<el-dialog v-el-drag-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :modal="false" :close-on-click-modal="false" width="700px"> <pd-dialog ref="formDialog" :title="dialogTitle" width="700px" @confirm-click="save">
<template #content>
<el-form ref="dataForm" :inline="true" :rules="rules" :model="temp" label-position="right" label-width="100px" style="margin-left: 20px"> <el-form ref="dataForm" :inline="true" :rules="rules" :model="temp" label-position="right" label-width="100px" style="margin-left: 20px">
<el-form-item label="标签名" prop="label"> <el-form-item label="标签名" prop="label">
<el-input v-model="temp.label" /> <el-input v-model="temp.label" />
@ -34,15 +35,8 @@
<el-input v-model="temp.remarks" /> <el-input v-model="temp.remarks" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> </template>
<el-button @click="dialogFormVisible = false"> </pd-dialog>
关闭
</el-button>
<el-button type="primary" @click="save()">
确认
</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
@ -115,12 +109,7 @@ export default {
} }
] ]
}, },
textMap: { dialogTitle: '',
update: '修改',
create: '添加'
},
dialogFormVisible: false,
dialogStatus: '',
rules: { rules: {
value: [{ required: true, message: '请输入值', trigger: 'change' }], value: [{ required: true, message: '请输入值', trigger: 'change' }],
label: [{ required: true, message: '请输入标签名', trigger: 'change' }], label: [{ required: true, message: '请输入标签名', trigger: 'change' }],
@ -162,8 +151,8 @@ export default {
handleCreate() { handleCreate() {
this.temp = this.getTemp() this.temp = this.getTemp()
this.getSort() this.getSort()
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.dialogFormVisible = true this.$refs.formDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
}) })
@ -172,10 +161,10 @@ export default {
this.$refs['dataForm'].validate((valid) => { this.$refs['dataForm'].validate((valid) => {
if (valid) { if (valid) {
this.$post('dict/items/save', this.temp).then(() => { this.$post('dict/items/save', this.temp).then(() => {
this.dialogFormVisible = false this.$refs.formDialog.hide()
this.$notify({ this.$notify({
title: '成功', title: '成功',
message: (this.dialogStatus === 'create' ? '创建' : '修改') + '成功', message: this.dialogTitle + '成功',
type: 'success', type: 'success',
duration: 2000 duration: 2000
}) })
@ -187,8 +176,8 @@ export default {
}, },
handleUpdate(row) { handleUpdate(row) {
this.$common.objAssign(this.temp, row) this.$common.objAssign(this.temp, row)
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.dialogFormVisible = true this.$refs.formDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
}) })

View File

@ -19,7 +19,8 @@
<pd-table ref="table" v-bind="tableOptions" /> <pd-table ref="table" v-bind="tableOptions" />
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :close-on-click-modal="false" width="700px"> <pd-dialog ref="dictDialog" :title="dialogTitle" width="700px" @confirm-click="save()">
<template #content>
<el-form ref="dataForm" :inline="true" :rules="rules" :model="temp" label-position="right" label-width="100px" style="margin-left: 20px"> <el-form ref="dataForm" :inline="true" :rules="rules" :model="temp" label-position="right" label-width="100px" style="margin-left: 20px">
<el-form-item label="字典类型" prop="dictType"> <el-form-item label="字典类型" prop="dictType">
<pd-select v-model="temp.dictType" type="dict_type" width="185px" /> <pd-select v-model="temp.dictType" type="dict_type" width="185px" />
@ -37,19 +38,14 @@
<el-input v-model="temp.remarks" /> <el-input v-model="temp.remarks" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> </template>
<el-button @click="dialogFormVisible = false"> </pd-dialog>
关闭
</el-button>
<el-button type="primary" @click="save()">
确认
</el-button>
</div>
</el-dialog>
<el-dialog v-el-drag-dialog title="字典项" :visible.sync="dictItemsVisible" :close-on-click-modal="false" width="1400px"> <pd-dialog ref="dictItemsDialog" title="字典项" width="1400px">
<template #content>
<dict-items :dict-id.sync="dictId" /> <dict-items :dict-id.sync="dictId" />
</el-dialog> </template>
</pd-dialog>
</div> </div>
</template> </template>
@ -130,7 +126,7 @@ export default {
title: '字典项', title: '字典项',
type: 'primary', type: 'primary',
click: (row) => { click: (row) => {
this.dictItemsVisible = true this.$refs.dictItemsDialog.show()
this.dictId = row.id this.dictId = row.id
} }
} }
@ -140,21 +136,13 @@ export default {
}, },
dictId: '', dictId: '',
temp: this.getTemp(), temp: this.getTemp(),
dialogFormVisible: false, dialogTitle: '',
dictItemsVisible: false,
dialogStatus: '',
textMap: {
update: '修改',
create: '添加'
},
pvData: [],
rules: { rules: {
dictType: [{ required: true, message: '请输入标签', trigger: 'change' }], dictType: [{ required: true, message: '请输入标签', trigger: 'change' }],
type: [{ required: true, message: '请输入类型', trigger: 'change' }], type: [{ required: true, message: '请输入类型', trigger: 'change' }],
sort: [{ required: true, message: '请输入排序', trigger: 'change' }], sort: [{ required: true, message: '请输入排序', trigger: 'change' }],
descRibe: [{ required: true, message: '请输入描述', trigger: 'change' }] descRibe: [{ required: true, message: '请输入描述', trigger: 'change' }]
}, }
downloadLoading: false
} }
}, },
methods: { methods: {
@ -179,8 +167,8 @@ export default {
handleCreate() { handleCreate() {
this.temp = this.getTemp() this.temp = this.getTemp()
this.getSort() this.getSort()
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.dialogFormVisible = true this.$refs.dictDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
}) })
@ -190,10 +178,10 @@ export default {
if (valid) { if (valid) {
this.$post('dict/save', this.temp).then((response) => { this.$post('dict/save', this.temp).then((response) => {
this.temp.id = response.data this.temp.id = response.data
this.dialogFormVisible = false this.$refs.dictDialog.hide()
this.$notify({ this.$notify({
title: '成功', title: '成功',
message: (this.dialogStatus === 'create' ? '创建' : '修改') + '成功', message: this.dialogTitle + '成功',
type: 'success', type: 'success',
duration: 2000 duration: 2000
}) })
@ -205,8 +193,8 @@ export default {
}, },
handleUpdate(row) { handleUpdate(row) {
this.$common.objAssign(this.temp, row) this.$common.objAssign(this.temp, row)
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.dialogFormVisible = true this.$refs.dictDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
}) })

View File

@ -24,7 +24,7 @@
<pd-table ref="table" v-bind="tableOptions" v-if="menuData && menuData.length > 0 && refreshTable" /> <pd-table ref="table" v-bind="tableOptions" v-if="menuData && menuData.length > 0 && refreshTable" />
<pd-dialog ref="menuFormDialog" width="1050px" :title="textMap[dialogStatus]" @confirm-click="$refs.menuForm.save()"> <pd-dialog ref="menuFormDialog" width="1050px" :title="dialogTitle" @confirm-click="$refs.menuForm.save()">
<template #content> <template #content>
<menu-form ref="menuForm" :menu-tree="menuTree" @reload-table="reloadTable" /> <menu-form ref="menuForm" :menu-tree="menuTree" @reload-table="reloadTable" />
</template> </template>
@ -185,11 +185,7 @@ export default {
} }
] ]
}, },
dialogStatus: '', dialogTitle: '',
textMap: {
update: '修改',
create: '添加'
},
searchTimeout: '' searchTimeout: ''
} }
}, },
@ -223,7 +219,7 @@ export default {
},500) },500)
}, },
addSubMenu(id) { addSubMenu(id) {
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.$refs.menuFormDialog.show() this.$refs.menuFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.menuForm.addSubMenu(id) this.$refs.menuForm.addSubMenu(id)
@ -237,7 +233,7 @@ export default {
}) })
}, },
handleUpdate(row) { handleUpdate(row) {
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.$refs.menuFormDialog.show() this.$refs.menuFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.menuForm.getInfo(row); this.$refs.menuForm.getInfo(row);

View File

@ -30,7 +30,7 @@
<pd-table ref="table" v-bind="tableOptions" v-if="officeData && officeData.length > 0 && refreshTable" /> <pd-table ref="table" v-bind="tableOptions" v-if="officeData && officeData.length > 0 && refreshTable" />
<pd-dialog ref="officeFormDialog" width="1050px" :title="textMap[dialogStatus]" @confirm-click="save()"> <pd-dialog ref="officeFormDialog" width="1050px" :title="dialogTitle" @confirm-click="save()">
<template #content> <template #content>
<el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="80px" style="width: 900px; margin-left:50px;"> <el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="80px" style="width: 900px; margin-left:50px;">
<el-row :gutter="24"> <el-row :gutter="24">
@ -184,18 +184,13 @@ export default {
} }
] ]
}, },
dialogFormVisible: false, dialogTitle: '',
dialogStatus: '',
textMap: {
update: '修改',
create: '添加'
},
temp: this.getTemp(), temp: this.getTemp(),
listConfigDialogVisible: false,
formConfigDialogVisible: false,
rules: { rules: {
type: [{ required: true, message: '请选择机构类型', trigger: 'change' }],
pid: [{ required: true, message: '请选择上级机构', trigger: 'change' }], pid: [{ required: true, message: '请选择上级机构', trigger: 'change' }],
name: [{ required: true, message: '请输入机构名称', trigger: 'change' }] name: [{ required: true, message: '请输入机构名称', trigger: 'change' }],
code: [{ required: true, message: '请输入机构编码', trigger: 'change' }]
}, },
searchTimeout: '' searchTimeout: ''
} }
@ -254,7 +249,7 @@ export default {
this.temp.pid = id this.temp.pid = id
this.temp.id = this.$common.uuid() this.temp.id = this.$common.uuid()
this.getSort() this.getSort()
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.$refs.officeFormDialog.show() this.$refs.officeFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
@ -286,7 +281,7 @@ export default {
this.$refs.officeFormDialog.hide() this.$refs.officeFormDialog.hide()
this.$notify({ this.$notify({
title: '成功', title: '成功',
message: (this.dialogStatus === 'create' ? '创建' : '修改') + '成功', message: dialogTitle + '成功',
type: 'success', type: 'success',
duration: 2000 duration: 2000
}) })
@ -305,7 +300,7 @@ export default {
this.temp[t] = row[t] this.temp[t] = row[t]
} }
this.temp.name = this.temp.name.replaceAll(/<font.*?>(.*?)<\/font>/g,'$1') this.temp.name = this.temp.name.replaceAll(/<font.*?>(.*?)<\/font>/g,'$1')
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.$refs.officeFormDialog.show() this.$refs.officeFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()

View File

@ -22,7 +22,7 @@
<pd-table ref="table" v-bind="tableOptions" /> <pd-table ref="table" v-bind="tableOptions" />
<pd-dialog ref="roleFormDialog" @confirm-click="save()"> <pd-dialog ref="roleFormDialog" :title="dialogTitle" width="1000px" @confirm-click="save()">
<template #content> <template #content>
<el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="120px" style="width: 900px;"> <el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="120px" style="width: 900px;">
<el-row :gutter="24"> <el-row :gutter="24">
@ -66,7 +66,7 @@
</template> </template>
</pd-dialog> </pd-dialog>
<pd-dialog ref="assignPermissionsDialog" width="40%" @confirm-click="$refs.assignPermissions.save()"> <pd-dialog ref="assignPermissionsDialog" title="分配权限" width="750" @confirm-click="$refs.assignPermissions.save()">
<template #content> <template #content>
<role-assign-permissions ref="assignPermissions" :key="Math.random()" :id="temp.id" @close="() => { $refs.assignPermissionsDialog.hide(); temp.id = '' }" /> <role-assign-permissions ref="assignPermissions" :key="Math.random()" :id="temp.id" @close="() => { $refs.assignPermissionsDialog.hide(); temp.id = '' }" />
</template> </template>
@ -163,12 +163,8 @@ export default {
} }
] ]
}, },
dialogTitle: '',
temp: this.getTemp(), temp: this.getTemp(),
dialogStatus: '',
textMap: {
update: '修改',
create: '添加'
},
rules: { rules: {
name: [{ required: true, message: '请输入角色名称', trigger: 'change' }], name: [{ required: true, message: '请输入角色名称', trigger: 'change' }],
code: [{ required: true, message: '请输入角色编码', trigger: 'change' }] code: [{ required: true, message: '请输入角色编码', trigger: 'change' }]
@ -203,7 +199,7 @@ export default {
}, },
handleCreate() { handleCreate() {
this.resetTemp() this.resetTemp()
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.$refs.roleFormDialog.show() this.$refs.roleFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()
@ -217,7 +213,7 @@ export default {
this.$refs.roleFormDialog.hide() this.$refs.roleFormDialog.hide()
this.$notify({ this.$notify({
title: '成功', title: '成功',
message: (this.dialogStatus === 'create' ? '创建' : '修改') + '成功', message: this.dialogTitle + '成功',
type: 'success', type: 'success',
duration: 2000 duration: 2000
}) })
@ -235,7 +231,7 @@ export default {
this.$get('office/by/role',{ roleId: row.id }).then(res => { this.$get('office/by/role',{ roleId: row.id }).then(res => {
this.temp.offices = res.data.join(',') this.temp.offices = res.data.join(',')
}) })
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.$refs.roleFormDialog.show() this.$refs.roleFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['dataForm'].clearValidate() this.$refs['dataForm'].clearValidate()

View File

@ -53,7 +53,7 @@ export default {
name: 'UserForm', name: 'UserForm',
components: { Treeselect }, components: { Treeselect },
props: { props: {
dialogStatus: { dialogTitle: {
type: String, type: String,
default: '' default: ''
} }
@ -105,7 +105,7 @@ export default {
this.dialogVisible = false this.dialogVisible = false
this.$notify({ this.$notify({
title: '成功', title: '成功',
message: (this.dialogStatus === 'create' ? '创建' : '修改') + '成功', message: this.dialogTitle + '成功',
type: 'success', type: 'success',
duration: 2000 duration: 2000
}) })

View File

@ -45,9 +45,9 @@
<pd-table ref="table" v-bind="tableOptions" @selection-change="selectionChange" /> <pd-table ref="table" v-bind="tableOptions" @selection-change="selectionChange" />
<pd-dialog ref="userFormDialog" @confirm-click="$refs.userForm.save()" width="40%"> <pd-dialog ref="userFormDialog" :title="dialogTitle" @confirm-click="$refs.userForm.save()" width="770px">
<template #content> <template #content>
<user-form ref="userForm" :dialog-status="dialogStatus" @reload-table="reloadTable" /> <user-form ref="userForm" :dialog-status="dialogTitle" @reload-table="reloadTable" />
</template> </template>
</pd-dialog> </pd-dialog>
</div> </div>
@ -141,7 +141,7 @@ export default {
} }
] ]
}, },
dialogStatus: '', dialogTitle: '',
downloadLoading: false, downloadLoading: false,
ids: [] ids: []
} }
@ -163,12 +163,12 @@ export default {
this.$refs.table.reloadList() this.$refs.table.reloadList()
}, },
handleCreate() { handleCreate() {
this.dialogStatus = 'create' this.dialogTitle = '添加'
this.$refs.userFormDialog.show() this.$refs.userFormDialog.show()
this.$nextTick(() => { this.$refs.userForm.resetTemp() }) this.$nextTick(() => { this.$refs.userForm.resetTemp() })
}, },
handleUpdate(row) { handleUpdate(row) {
this.dialogStatus = 'update' this.dialogTitle = '修改'
this.$refs.userFormDialog.show() this.$refs.userFormDialog.show()
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.userForm.getInfo(row) this.$refs.userForm.getInfo(row)