Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Q
qsh-wc
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
honghuiliu
qsh-wc
Commits
40da75e2
Commit
40da75e2
authored
Sep 02, 2022
by
sven
Browse files
Options
Browse Files
Download
Plain Diff
Merge remote-tracking branch 'origin/master'
parents
7d35fd73
afb107af
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
565 additions
and
553 deletions
+565
-553
qshPartol.vue
web/src/view/qshPartol/qshPartol.vue
+271
-265
qshToilet.vue
web/src/view/qshToilet/qshToilet.vue
+287
-279
routerHolder.vue
web/src/view/routerHolder.vue
+7
-9
No files found.
web/src/view/qshPartol/qshPartol.vue
View file @
40da75e2
<
template
>
<div>
<div
class=
"gva-search-box"
>
<el-form
:inline=
"true"
:model=
"searchInfo"
class=
"demo-form-inline"
>
<el-form-item
label=
"工单标题"
>
<el-input
v-model=
"searchInfo.title"
placeholder=
"搜索条件"
/>
</el-form-item>
<el-form-item
label=
"巡检类型"
prop=
"type"
>
<el-select
v-model=
"searchInfo.type"
clearable
placeholder=
"请选择"
@
clear=
"()=>
{searchInfo.type=undefined}">
<el-option
v-for=
"(item,key) in partol_typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
size=
"small"
type=
"primary"
icon=
"search"
@
click=
"onSubmit"
>
查询
</el-button>
<el-button
size=
"small"
icon=
"refresh"
@
click=
"onReset"
>
重置
</el-button>
</el-form-item>
</el-form>
</div>
<div
class=
"gva-table-box"
>
<div
class=
"gva-btn-list"
>
<el-button
size=
"small"
type=
"primary"
icon=
"plus"
@
click=
"openDialog"
>
新增
</el-button>
<el-popover
v-model:visible=
"deleteVisible"
placement=
"top"
width=
"160"
>
<p>
确定要删除吗?
</p>
<div
style=
"text-align: right; margin-top: 8px;"
>
<el-button
size=
"small"
type=
"primary"
link
@
click=
"deleteVisible = false"
>
取消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"onDelete"
>
确定
</el-button>
<div>
<div
class=
"gva-search-box"
>
<el-form
:inline=
"true"
:model=
"searchInfo"
class=
"demo-form-inline"
>
<el-form-item
label=
"工单标题"
>
<el-input
v-model=
"searchInfo.title"
placeholder=
"搜索条件"
/>
</el-form-item>
<el-form-item
label=
"巡检类型"
prop=
"type"
>
<el-select
v-model=
"searchInfo.type"
clearable
placeholder=
"请选择"
@
clear=
"()=>
{searchInfo.type=undefined}">
<el-option
v-for=
"(item,key) in partol_typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
size=
"small"
type=
"primary"
icon=
"search"
@
click=
"onSubmit"
>
查询
</el-button>
<el-button
size=
"small"
icon=
"refresh"
@
click=
"onReset"
>
重置
</el-button>
</el-form-item>
</el-form>
</div>
<div
class=
"gva-table-box"
>
<div
class=
"gva-btn-list"
>
<el-button
size=
"small"
type=
"primary"
icon=
"plus"
@
click=
"openDialog"
>
新增
</el-button>
<el-popover
v-model:visible=
"deleteVisible"
placement=
"top"
width=
"160"
>
<p>
确定要删除吗?
</p>
<div
style=
"text-align: right; margin-top: 8px;"
>
<el-button
size=
"small"
type=
"primary"
link
@
click=
"deleteVisible = false"
>
取消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"onDelete"
>
确定
</el-button>
</div>
<template
#
reference
>
<el-button
icon=
"delete"
size=
"small"
style=
"margin-left: 10px;"
:disabled=
"!multipleSelection.length"
@
click=
"deleteVisible = true"
>
删除
</el-button>
</
template
>
</el-popover>
</div>
<el-table
ref=
"multipleTable"
style=
"flex:1"
height=
"100%"
tooltip-effect=
"dark"
:data=
"tableData"
row-key=
"ID"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
/>
<el-table-column
align=
"left"
label=
"工单标题"
prop=
"title"
min-width=
"180"
/>
<el-table-column
align=
"left"
label=
"巡检类型"
prop=
"type"
min-width=
"120"
>
<
template
#
default=
"scope"
>
{{
filterDict
(
scope
.
row
.
type
,
partol_typeOptions
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"异常描述"
prop=
"description"
min-width=
"180"
/>
<el-table-column
align=
"left"
label=
"巡视人"
prop=
"partolName"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"巡检公厕"
prop=
"toiletId"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"创建时间"
min-width=
"180"
>
<
template
#
default=
"scope"
>
{{
formatDate
(
scope
.
row
.
CreatedAt
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
fixed=
"right"
label=
"操作"
min-width=
"120"
>
<
template
#
default=
"scope"
>
<el-button
type=
"primary"
link
icon=
"edit"
size=
"small"
class=
"table-button"
@
click=
"updateQshPartolFunc(scope.row)"
>
变更
</el-button>
<el-button
type=
"primary"
link
icon=
"delete"
size=
"small"
@
click=
"deleteRow(scope.row)"
>
删除
</el-button>
</
template
>
</el-table-column>
</el-table>
<div
class=
"gva-pagination"
>
<el-pagination
layout=
"total, sizes, prev, pager, next, jumper"
:current-page=
"page"
:page-size=
"pageSize"
:page-sizes=
"[10, 30, 50, 100]"
:total=
"total"
@
current-change=
"handleCurrentChange"
@
size-change=
"handleSizeChange"
/>
</div>
<template
#
reference
>
<el-button
icon=
"delete"
size=
"small"
style=
"margin-left: 10px;"
:disabled=
"!multipleSelection.length"
@
click=
"deleteVisible = true"
>
删除
</el-button>
</
template
>
</el-popover>
</div>
<el-table
ref=
"multipleTable"
style=
"flex:1"
height=
"100%"
tooltip-effect=
"dark"
:data=
"tableData"
row-key=
"ID"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
/>
<el-table-column
align=
"left"
label=
"日期"
width=
"180"
>
<
template
#
default=
"scope"
>
{{
formatDate
(
scope
.
row
.
CreatedAt
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"巡检内容"
prop=
"content"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"异常描述"
prop=
"description"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"巡检图片多个逗号分隔"
prop=
"image"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"巡视人"
prop=
"partolName"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"工单标题"
prop=
"title"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"巡检公厕"
prop=
"toiletId"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"巡检类型"
prop=
"type"
width=
"120"
>
<
template
#
default=
"scope"
>
{{
filterDict
(
scope
.
row
.
type
,
partol_typeOptions
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"按钮组"
>
<
template
#
default=
"scope"
>
<el-button
type=
"primary"
link
icon=
"edit"
size=
"small"
class=
"table-button"
@
click=
"updateQshPartolFunc(scope.row)"
>
变更
</el-button>
<el-button
type=
"primary"
link
icon=
"delete"
size=
"small"
@
click=
"deleteRow(scope.row)"
>
删除
</el-button>
<el-dialog
v-model=
"dialogFormVisible"
:before-close=
"closeDialog"
title=
"弹窗操作"
>
<el-form
:model=
"formData"
label-position=
"right"
label-width=
"80px"
>
<el-form-item
label=
"巡检内容:"
>
<el-input
v-model=
"formData.content"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"异常描述:"
>
<el-input
v-model=
"formData.description"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检图片多个逗号分隔:"
>
<el-input
v-model=
"formData.image"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡视人:"
>
<el-input
v-model=
"formData.partolName"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"工单标题:"
>
<el-input
v-model=
"formData.title"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检公厕:"
>
<el-input
v-model
.
number=
"formData.toiletId"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检类型:"
>
<el-select
v-model=
"formData.type"
placeholder=
"请选择"
style=
"width:100%"
clearable
>
<el-option
v-for=
"(item,key) in partol_typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
</el-form>
<
template
#
footer
>
<div
class=
"dialog-footer"
>
<el-button
size=
"small"
@
click=
"closeDialog"
>
取 消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"enterDialog"
>
确 定
</el-button>
</div>
</
template
>
</el-table-column>
</el-table>
<div
class=
"gva-pagination"
>
<el-pagination
layout=
"total, sizes, prev, pager, next, jumper"
:current-page=
"page"
:page-size=
"pageSize"
:page-sizes=
"[10, 30, 50, 100]"
:total=
"total"
@
current-change=
"handleCurrentChange"
@
size-change=
"handleSizeChange"
/>
</div>
</el-dialog>
</div>
<el-dialog
v-model=
"dialogFormVisible"
:before-close=
"closeDialog"
title=
"弹窗操作"
>
<el-form
:model=
"formData"
label-position=
"right"
label-width=
"80px"
>
<el-form-item
label=
"巡检内容:"
>
<el-input
v-model=
"formData.content"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"异常描述:"
>
<el-input
v-model=
"formData.description"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检图片多个逗号分隔:"
>
<el-input
v-model=
"formData.image"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡视人:"
>
<el-input
v-model=
"formData.partolName"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"工单标题:"
>
<el-input
v-model=
"formData.title"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检公厕:"
>
<el-input
v-model
.
number=
"formData.toiletId"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"巡检类型:"
>
<el-select
v-model=
"formData.type"
placeholder=
"请选择"
style=
"width:100%"
clearable
>
<el-option
v-for=
"(item,key) in partol_typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
</el-form>
<
template
#
footer
>
<div
class=
"dialog-footer"
>
<el-button
size=
"small"
@
click=
"closeDialog"
>
取 消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"enterDialog"
>
确 定
</el-button>
</div>
</
template
>
</el-dialog>
</div>
</template>
<
script
>
export
default
{
name
:
'QshPartol'
}
export
default
{
name
:
'QshPartol'
}
</
script
>
<
script
setup
>
import
{
createQshPartol
,
deleteQshPartol
,
deleteQshPartolByIds
,
updateQshPartol
,
findQshPartol
,
getQshPartolList
}
from
'@/api/qshPartol'
import
{
createQshPartol
,
deleteQshPartol
,
deleteQshPartolByIds
,
updateQshPartol
,
findQshPartol
,
getQshPartolList
}
from
'@/api/qshPartol'
// 全量引入格式化工具 请按需保留
import
{
getDictFunc
,
formatDate
,
formatBoolean
,
filterDict
}
from
'@/utils/format'
import
{
ElMessage
,
ElMessageBox
}
from
'element-plus'
import
{
ref
}
from
'vue'
// 全量引入格式化工具 请按需保留
import
{
getDictFunc
,
formatDate
,
formatBoolean
,
filterDict
}
from
'@/utils/format'
import
{
ElMessage
,
ElMessageBox
}
from
'element-plus'
import
{
ref
}
from
'vue'
// 自动化生成的字典(可能为空)以及字段
const
partol_typeOptions
=
ref
([])
const
formData
=
ref
({
// 自动化生成的字典(可能为空)以及字段
const
partol_typeOptions
=
ref
([])
const
formData
=
ref
({
content
:
''
,
description
:
''
,
image
:
''
,
...
...
@@ -140,187 +146,187 @@ const formData = ref({
title
:
''
,
toiletId
:
0
,
type
:
undefined
,
})
})
// =========== 表格控制部分 ===========
const
page
=
ref
(
1
)
const
total
=
ref
(
0
)
const
pageSize
=
ref
(
10
)
const
tableData
=
ref
([])
const
searchInfo
=
ref
({})
// =========== 表格控制部分 ===========
const
page
=
ref
(
1
)
const
total
=
ref
(
0
)
const
pageSize
=
ref
(
10
)
const
tableData
=
ref
([])
const
searchInfo
=
ref
({})
// 重置
const
onReset
=
()
=>
{
searchInfo
.
value
=
{}
}
// 重置
const
onReset
=
()
=>
{
searchInfo
.
value
=
{}
}
// 搜索
const
onSubmit
=
()
=>
{
page
.
value
=
1
pageSize
.
value
=
10
getTableData
()
}
// 搜索
const
onSubmit
=
()
=>
{
page
.
value
=
1
pageSize
.
value
=
10
getTableData
()
}
// 分页
const
handleSizeChange
=
(
val
)
=>
{
pageSize
.
value
=
val
getTableData
()
}
// 分页
const
handleSizeChange
=
(
val
)
=>
{
pageSize
.
value
=
val
getTableData
()
}
// 修改页面容量
const
handleCurrentChange
=
(
val
)
=>
{
page
.
value
=
val
getTableData
()
}
// 修改页面容量
const
handleCurrentChange
=
(
val
)
=>
{
page
.
value
=
val
getTableData
()
}
// 查询
const
getTableData
=
async
()
=>
{
const
table
=
await
getQshPartolList
({
page
:
page
.
value
,
pageSize
:
pageSize
.
value
,
...
searchInfo
.
value
})
if
(
table
.
code
===
0
)
{
tableData
.
value
=
table
.
data
.
list
total
.
value
=
table
.
data
.
total
page
.
value
=
table
.
data
.
page
pageSize
.
value
=
table
.
data
.
pageSize
}
}
// 查询
const
getTableData
=
async
()
=>
{
const
table
=
await
getQshPartolList
({
page
:
page
.
value
,
pageSize
:
pageSize
.
value
,
...
searchInfo
.
value
})
if
(
table
.
code
===
0
)
{
tableData
.
value
=
table
.
data
.
list
total
.
value
=
table
.
data
.
total
page
.
value
=
table
.
data
.
page
pageSize
.
value
=
table
.
data
.
pageSize
}
}
getTableData
()
getTableData
()
// ============== 表格控制部分结束 ===============
// ============== 表格控制部分结束 ===============
// 获取需要的字典 可能为空 按需保留
const
setOptions
=
async
()
=>
{
partol_typeOptions
.
value
=
await
getDictFunc
(
'partol_type'
)
}
// 获取需要的字典 可能为空 按需保留
const
setOptions
=
async
()
=>
{
partol_typeOptions
.
value
=
await
getDictFunc
(
'partol_type'
)
}
// 获取需要的字典 可能为空 按需保留
setOptions
()
// 获取需要的字典 可能为空 按需保留
setOptions
()
// 多选数据
const
multipleSelection
=
ref
([])
// 多选
const
handleSelectionChange
=
(
val
)
=>
{
multipleSelection
.
value
=
val
}
// 多选数据
const
multipleSelection
=
ref
([])
// 多选
const
handleSelectionChange
=
(
val
)
=>
{
multipleSelection
.
value
=
val
}
// 删除行
const
deleteRow
=
(
row
)
=>
{
ElMessageBox
.
confirm
(
'确定要删除吗?'
,
'提示'
,
{
confirmButtonText
:
'确定'
,
cancelButtonText
:
'取消'
,
type
:
'warning'
}).
then
(()
=>
{
// 删除行
const
deleteRow
=
(
row
)
=>
{
ElMessageBox
.
confirm
(
'确定要删除吗?'
,
'提示'
,
{
confirmButtonText
:
'确定'
,
cancelButtonText
:
'取消'
,
type
:
'warning'
}).
then
(()
=>
{
deleteQshPartolFunc
(
row
)
})
}
// 批量删除控制标记
const
deleteVisible
=
ref
(
false
)
// 批量删除控制标记
const
deleteVisible
=
ref
(
false
)
// 多选删除
const
onDelete
=
async
()
=>
{
const
ids
=
[]
if
(
multipleSelection
.
value
.
length
===
0
)
{
ElMessage
({
type
:
'warning'
,
message
:
'请选择要删除的数据'
})
return
}
multipleSelection
.
value
&&
// 多选删除
const
onDelete
=
async
()
=>
{
const
ids
=
[]
if
(
multipleSelection
.
value
.
length
===
0
)
{
ElMessage
({
type
:
'warning'
,
message
:
'请选择要删除的数据'
})
return
}
multipleSelection
.
value
&&
multipleSelection
.
value
.
map
(
item
=>
{
ids
.
push
(
item
.
ID
)
})
const
res
=
await
deleteQshPartolByIds
({
ids
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
ids
.
push
(
item
.
ID
)
})
if
(
tableData
.
value
.
length
===
ids
.
length
&&
page
.
value
>
1
)
{
page
.
value
--
const
res
=
await
deleteQshPartolByIds
({
ids
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
})
if
(
tableData
.
value
.
length
===
ids
.
length
&&
page
.
value
>
1
)
{
page
.
value
--
}
deleteVisible
.
value
=
false
getTableData
()
}
deleteVisible
.
value
=
false
getTableData
()
}
}
// 行为控制标记(弹窗内部需要增还是改)
const
type
=
ref
(
''
)
// 行为控制标记(弹窗内部需要增还是改)
const
type
=
ref
(
''
)
// 更新行
const
updateQshPartolFunc
=
async
(
row
)
=>
{
const
res
=
await
findQshPartol
({
ID
:
row
.
ID
})
type
.
value
=
'update'
if
(
res
.
code
===
0
)
{
formData
.
value
=
res
.
data
.
reqshPartol
dialogFormVisible
.
value
=
true
// 更新行
const
updateQshPartolFunc
=
async
(
row
)
=>
{
const
res
=
await
findQshPartol
({
ID
:
row
.
ID
})
type
.
value
=
'update'
if
(
res
.
code
===
0
)
{
formData
.
value
=
res
.
data
.
reqshPartol
dialogFormVisible
.
value
=
true
}
}
}
// 删除行
const
deleteQshPartolFunc
=
async
(
row
)
=>
{
const
res
=
await
deleteQshPartol
({
ID
:
row
.
ID
})
if
(
res
.
code
===
0
)
{
ElMessage
({
// 删除行
const
deleteQshPartolFunc
=
async
(
row
)
=>
{
const
res
=
await
deleteQshPartol
({
ID
:
row
.
ID
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
})
if
(
tableData
.
value
.
length
===
1
&&
page
.
value
>
1
)
{
page
.
value
--
page
.
value
--
}
getTableData
()
}
getTableData
()
}
}
// 弹窗控制标记
const
dialogFormVisible
=
ref
(
false
)
// 弹窗控制标记
const
dialogFormVisible
=
ref
(
false
)
// 打开弹窗
const
openDialog
=
()
=>
{
type
.
value
=
'create'
dialogFormVisible
.
value
=
true
}
// 打开弹窗
const
openDialog
=
()
=>
{
type
.
value
=
'create'
dialogFormVisible
.
value
=
true
}
// 关闭弹窗
const
closeDialog
=
()
=>
{
dialogFormVisible
.
value
=
false
formData
.
value
=
{
content
:
''
,
description
:
''
,
image
:
''
,
partolName
:
''
,
title
:
''
,
toiletId
:
0
,
type
:
undefined
,
// 关闭弹窗
const
closeDialog
=
()
=>
{
dialogFormVisible
.
value
=
false
formData
.
value
=
{
content
:
''
,
description
:
''
,
image
:
''
,
partolName
:
''
,
title
:
''
,
toiletId
:
0
,
type
:
undefined
,
}
}
// 弹窗确定
const
enterDialog
=
async
()
=>
{
let
res
switch
(
type
.
value
)
{
case
'create'
:
res
=
await
createQshPartol
(
formData
.
value
)
break
case
'update'
:
res
=
await
updateQshPartol
(
formData
.
value
)
break
default
:
res
=
await
createQshPartol
(
formData
.
value
)
break
}
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'创建/更改成功'
})
closeDialog
()
getTableData
()
}
}
}
// 弹窗确定
const
enterDialog
=
async
()
=>
{
let
res
switch
(
type
.
value
)
{
case
'create'
:
res
=
await
createQshPartol
(
formData
.
value
)
break
case
'update'
:
res
=
await
updateQshPartol
(
formData
.
value
)
break
default
:
res
=
await
createQshPartol
(
formData
.
value
)
break
}
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'创建/更改成功'
})
closeDialog
()
getTableData
()
}
}
</
script
>
<
style
>
...
...
web/src/view/qshToilet/qshToilet.vue
View file @
40da75e2
<
template
>
<div>
<div
class=
"gva-search-box"
>
<el-form
:inline=
"true"
:model=
"searchInfo"
class=
"demo-form-inline"
>
<el-form-item
label=
"点位名称"
>
<el-input
v-model=
"searchInfo.name"
placeholder=
"搜索条件"
/>
</el-form-item>
<el-form-item
label=
"公厕类型"
prop=
"type"
>
<el-select
v-model=
"searchInfo.type"
clearable
placeholder=
"请选择"
@
clear=
"()=>
{searchInfo.type=undefined}">
<el-option
v-for=
"(item,key) in typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
size=
"small"
type=
"primary"
icon=
"search"
@
click=
"onSubmit"
>
查询
</el-button>
<el-button
size=
"small"
icon=
"refresh"
@
click=
"onReset"
>
重置
</el-button>
</el-form-item>
</el-form>
</div>
<div
class=
"gva-table-box"
>
<div
class=
"gva-btn-list"
>
<el-button
size=
"small"
type=
"primary"
icon=
"plus"
@
click=
"openDialog"
>
新增
</el-button>
<el-popover
v-model:visible=
"deleteVisible"
placement=
"top"
width=
"160"
>
<p>
确定要删除吗?
</p>
<div
style=
"text-align: right; margin-top: 8px;"
>
<el-button
size=
"small"
type=
"primary"
link
@
click=
"deleteVisible = false"
>
取消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"onDelete"
>
确定
</el-button>
<div>
<div
class=
"gva-search-box"
>
<el-form
:inline=
"true"
:model=
"searchInfo"
class=
"demo-form-inline"
>
<el-form-item
label=
"点位名称"
>
<el-input
v-model=
"searchInfo.name"
placeholder=
"搜索条件"
/>
</el-form-item>
<el-form-item
label=
"公厕类型"
prop=
"type"
>
<el-select
v-model=
"searchInfo.type"
clearable
placeholder=
"请选择"
@
clear=
"()=>
{searchInfo.type=undefined}">
<el-option
v-for=
"(item,key) in typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
size=
"small"
type=
"primary"
icon=
"search"
@
click=
"onSubmit"
>
查询
</el-button>
<el-button
size=
"small"
icon=
"refresh"
@
click=
"onReset"
>
重置
</el-button>
</el-form-item>
</el-form>
</div>
<div
class=
"gva-table-box"
>
<div
class=
"gva-btn-list"
>
<el-button
size=
"small"
type=
"primary"
icon=
"plus"
@
click=
"openDialog"
>
新增
</el-button>
<el-popover
v-model:visible=
"deleteVisible"
placement=
"top"
width=
"160"
>
<p>
确定要删除吗?
</p>
<div
style=
"text-align: right; margin-top: 8px;"
>
<el-button
size=
"small"
type=
"primary"
link
@
click=
"deleteVisible = false"
>
取消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"onDelete"
>
确定
</el-button>
</div>
<template
#
reference
>
<el-button
icon=
"delete"
size=
"small"
style=
"margin-left: 10px;"
:disabled=
"!multipleSelection.length"
@
click=
"deleteVisible = true"
>
删除
</el-button>
</
template
>
</el-popover>
</div>
<el-table
ref=
"multipleTable"
style=
"flex:1"
height=
"100%"
tooltip-effect=
"dark"
:data=
"tableData"
row-key=
"ID"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
/>
<el-table-column
align=
"left"
label=
"点位名称"
prop=
"name"
min-width=
"180"
/>
<el-table-column
align=
"left"
label=
"公厕地址"
prop=
"address"
min-width=
"180"
/>
<el-table-column
align=
"left"
label=
"公厕类型"
prop=
"type"
min-width=
"120"
>
<
template
#
default=
"scope"
>
{{
filterDict
(
scope
.
row
.
type
,
typeOptions
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"纬度"
prop=
"lat"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"经度"
prop=
"lng"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"管理人员"
prop=
"manager"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"管理员联系电话"
prop=
"managerPhone"
min-width=
"140"
/>
<el-table-column
align=
"left"
label=
"监控信息"
prop=
"monitor"
min-width=
"120"
/>
<el-table-column
align=
"left"
label=
"创建时间"
min-width=
"180"
>
<
template
#
default=
"scope"
>
{{
formatDate
(
scope
.
row
.
CreatedAt
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
fixed=
"right"
label=
"操作"
min-width=
"120"
>
<
template
#
default=
"scope"
>
<el-button
type=
"primary"
link
icon=
"edit"
size=
"small"
class=
"table-button"
@
click=
"updateQshToiletFunc(scope.row)"
>
变更
</el-button>
<el-button
type=
"primary"
link
icon=
"delete"
size=
"small"
@
click=
"deleteRow(scope.row)"
>
删除
</el-button>
</
template
>
</el-table-column>
</el-table>
<div
class=
"gva-pagination"
>
<el-pagination
layout=
"total, sizes, prev, pager, next, jumper"
:current-page=
"page"
:page-size=
"pageSize"
:page-sizes=
"[10, 30, 50, 100]"
:total=
"total"
@
current-change=
"handleCurrentChange"
@
size-change=
"handleSizeChange"
/>
</div>
<template
#
reference
>
<el-button
icon=
"delete"
size=
"small"
style=
"margin-left: 10px;"
:disabled=
"!multipleSelection.length"
@
click=
"deleteVisible = true"
>
删除
</el-button>
</
template
>
</el-popover>
</div>
<el-table
ref=
"multipleTable"
style=
"width: 100%"
tooltip-effect=
"dark"
:data=
"tableData"
row-key=
"ID"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
/>
<el-table-column
align=
"left"
label=
"日期"
width=
"180"
>
<
template
#
default=
"scope"
>
{{
formatDate
(
scope
.
row
.
CreatedAt
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"公厕地址"
prop=
"address"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"点位图片"
prop=
"image"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"纬度"
prop=
"lat"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"经度"
prop=
"lng"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"管理人员"
prop=
"manager"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"管理员联系电话"
prop=
"managerPhone"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"监控信息"
prop=
"monitor"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"点位名称"
prop=
"name"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"展示图片"
prop=
"showImage"
width=
"120"
/>
<el-table-column
align=
"left"
label=
"公厕类型"
prop=
"type"
width=
"120"
>
<
template
#
default=
"scope"
>
{{
filterDict
(
scope
.
row
.
type
,
typeOptions
)
}}
</
template
>
</el-table-column>
<el-table-column
align=
"left"
label=
"按钮组"
>
<
template
#
default=
"scope"
>
<el-button
type=
"primary"
link
icon=
"edit"
size=
"small"
class=
"table-button"
@
click=
"updateQshToiletFunc(scope.row)"
>
变更
</el-button>
<el-button
type=
"primary"
link
icon=
"delete"
size=
"small"
@
click=
"deleteRow(scope.row)"
>
删除
</el-button>
<el-dialog
v-model=
"dialogFormVisible"
:before-close=
"closeDialog"
title=
"弹窗操作"
>
<el-form
:model=
"formData"
label-position=
"right"
label-width=
"80px"
>
<el-form-item
label=
"公厕地址:"
>
<el-input
v-model=
"formData.address"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"点位图片:"
>
<el-input
v-model=
"formData.image"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"纬度:"
>
<el-input
v-model=
"formData.lat"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"经度:"
>
<el-input
v-model=
"formData.lng"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"管理人员:"
>
<el-input
v-model=
"formData.manager"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"管理员联系电话:"
>
<el-input
v-model=
"formData.managerPhone"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"监控信息:"
>
<el-input
v-model=
"formData.monitor"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"点位名称:"
>
<el-input
v-model=
"formData.name"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"展示图片:"
>
<el-input
v-model=
"formData.showImage"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"公厕类型:"
>
<el-select
v-model=
"formData.type"
placeholder=
"请选择"
style=
"width:100%"
clearable
>
<el-option
v-for=
"(item,key) in typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
</el-form>
<
template
#
footer
>
<div
class=
"dialog-footer"
>
<el-button
size=
"small"
@
click=
"closeDialog"
>
取 消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"enterDialog"
>
确 定
</el-button>
</div>
</
template
>
</el-table-column>
</el-table>
<div
class=
"gva-pagination"
>
<el-pagination
layout=
"total, sizes, prev, pager, next, jumper"
:current-page=
"page"
:page-size=
"pageSize"
:page-sizes=
"[10, 30, 50, 100]"
:total=
"total"
@
current-change=
"handleCurrentChange"
@
size-change=
"handleSizeChange"
/>
</div>
</el-dialog>
</div>
<el-dialog
v-model=
"dialogFormVisible"
:before-close=
"closeDialog"
title=
"弹窗操作"
>
<el-form
:model=
"formData"
label-position=
"right"
label-width=
"80px"
>
<el-form-item
label=
"公厕地址:"
>
<el-input
v-model=
"formData.address"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"点位图片:"
>
<el-input
v-model=
"formData.image"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"纬度:"
>
<el-input
v-model=
"formData.lat"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"经度:"
>
<el-input
v-model=
"formData.lng"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"管理人员:"
>
<el-input
v-model=
"formData.manager"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"管理员联系电话:"
>
<el-input
v-model=
"formData.managerPhone"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"监控信息:"
>
<el-input
v-model=
"formData.monitor"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"点位名称:"
>
<el-input
v-model=
"formData.name"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"展示图片:"
>
<el-input
v-model=
"formData.showImage"
clearable
placeholder=
"请输入"
/>
</el-form-item>
<el-form-item
label=
"公厕类型:"
>
<el-select
v-model=
"formData.type"
placeholder=
"请选择"
style=
"width:100%"
clearable
>
<el-option
v-for=
"(item,key) in typeOptions"
:key=
"key"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
</el-form>
<
template
#
footer
>
<div
class=
"dialog-footer"
>
<el-button
size=
"small"
@
click=
"closeDialog"
>
取 消
</el-button>
<el-button
size=
"small"
type=
"primary"
@
click=
"enterDialog"
>
确 定
</el-button>
</div>
</
template
>
</el-dialog>
</div>
</template>
<
script
>
export
default
{
name
:
'QshToilet'
}
export
default
{
name
:
'QshToilet'
}
</
script
>
<
script
setup
>
import
{
createQshToilet
,
deleteQshToilet
,
deleteQshToiletByIds
,
updateQshToilet
,
findQshToilet
,
getQshToiletList
}
from
'@/api/qshToilet'
import
{
createQshToilet
,
deleteQshToilet
,
deleteQshToiletByIds
,
updateQshToilet
,
findQshToilet
,
getQshToiletList
}
from
'@/api/qshToilet'
// 全量引入格式化工具 请按需保留
import
{
getDictFunc
,
formatDate
,
formatBoolean
,
filterDict
}
from
'@/utils/format'
import
{
ElMessage
,
ElMessageBox
}
from
'element-plus'
import
{
ref
}
from
'vue'
// 全量引入格式化工具 请按需保留
import
{
getDictFunc
,
formatDate
,
formatBoolean
,
filterDict
}
from
'@/utils/format'
import
{
ElMessage
,
ElMessageBox
}
from
'element-plus'
import
{
ref
}
from
'vue'
// 自动化生成的字典(可能为空)以及字段
const
typeOptions
=
ref
([])
const
formData
=
ref
({
// 自动化生成的字典(可能为空)以及字段
const
typeOptions
=
ref
([])
const
formData
=
ref
({
address
:
''
,
image
:
''
,
lat
:
''
,
...
...
@@ -154,190 +162,190 @@ const formData = ref({
name
:
''
,
showImage
:
''
,
type
:
undefined
,
})
})
// =========== 表格控制部分 ===========
const
page
=
ref
(
1
)
const
total
=
ref
(
0
)
const
pageSize
=
ref
(
10
)
const
tableData
=
ref
([])
const
searchInfo
=
ref
({})
// =========== 表格控制部分 ===========
const
page
=
ref
(
1
)
const
total
=
ref
(
0
)
const
pageSize
=
ref
(
10
)
const
tableData
=
ref
([])
const
searchInfo
=
ref
({})
// 重置
const
onReset
=
()
=>
{
searchInfo
.
value
=
{}
}
// 重置
const
onReset
=
()
=>
{
searchInfo
.
value
=
{}
}
// 搜索
const
onSubmit
=
()
=>
{
page
.
value
=
1
pageSize
.
value
=
10
getTableData
()
}
// 搜索
const
onSubmit
=
()
=>
{
page
.
value
=
1
pageSize
.
value
=
10
getTableData
()
}
// 分页
const
handleSizeChange
=
(
val
)
=>
{
pageSize
.
value
=
val
getTableData
()
}
// 分页
const
handleSizeChange
=
(
val
)
=>
{
pageSize
.
value
=
val
getTableData
()
}
// 修改页面容量
const
handleCurrentChange
=
(
val
)
=>
{
page
.
value
=
val
getTableData
()
}
// 修改页面容量
const
handleCurrentChange
=
(
val
)
=>
{
page
.
value
=
val
getTableData
()
}
// 查询
const
getTableData
=
async
()
=>
{
const
table
=
await
getQshToiletList
({
page
:
page
.
value
,
pageSize
:
pageSize
.
value
,
...
searchInfo
.
value
})
if
(
table
.
code
===
0
)
{
tableData
.
value
=
table
.
data
.
list
total
.
value
=
table
.
data
.
total
page
.
value
=
table
.
data
.
page
pageSize
.
value
=
table
.
data
.
pageSize
}
}
// 查询
const
getTableData
=
async
()
=>
{
const
table
=
await
getQshToiletList
({
page
:
page
.
value
,
pageSize
:
pageSize
.
value
,
...
searchInfo
.
value
})
if
(
table
.
code
===
0
)
{
tableData
.
value
=
table
.
data
.
list
total
.
value
=
table
.
data
.
total
page
.
value
=
table
.
data
.
page
pageSize
.
value
=
table
.
data
.
pageSize
}
}
getTableData
()
getTableData
()
// ============== 表格控制部分结束 ===============
// ============== 表格控制部分结束 ===============
// 获取需要的字典 可能为空 按需保留
const
setOptions
=
async
()
=>
{
typeOptions
.
value
=
await
getDictFunc
(
'type'
)
}
// 获取需要的字典 可能为空 按需保留
const
setOptions
=
async
()
=>
{
typeOptions
.
value
=
await
getDictFunc
(
'type'
)
}
// 获取需要的字典 可能为空 按需保留
setOptions
()
// 获取需要的字典 可能为空 按需保留
setOptions
()
// 多选数据
const
multipleSelection
=
ref
([])
// 多选
const
handleSelectionChange
=
(
val
)
=>
{
multipleSelection
.
value
=
val
}
// 多选数据
const
multipleSelection
=
ref
([])
// 多选
const
handleSelectionChange
=
(
val
)
=>
{
multipleSelection
.
value
=
val
}
// 删除行
const
deleteRow
=
(
row
)
=>
{
ElMessageBox
.
confirm
(
'确定要删除吗?'
,
'提示'
,
{
confirmButtonText
:
'确定'
,
cancelButtonText
:
'取消'
,
type
:
'warning'
}).
then
(()
=>
{
// 删除行
const
deleteRow
=
(
row
)
=>
{
ElMessageBox
.
confirm
(
'确定要删除吗?'
,
'提示'
,
{
confirmButtonText
:
'确定'
,
cancelButtonText
:
'取消'
,
type
:
'warning'
}).
then
(()
=>
{
deleteQshToiletFunc
(
row
)
})
}
// 批量删除控制标记
const
deleteVisible
=
ref
(
false
)
// 批量删除控制标记
const
deleteVisible
=
ref
(
false
)
// 多选删除
const
onDelete
=
async
()
=>
{
const
ids
=
[]
if
(
multipleSelection
.
value
.
length
===
0
)
{
ElMessage
({
type
:
'warning'
,
message
:
'请选择要删除的数据'
})
return
}
multipleSelection
.
value
&&
// 多选删除
const
onDelete
=
async
()
=>
{
const
ids
=
[]
if
(
multipleSelection
.
value
.
length
===
0
)
{
ElMessage
({
type
:
'warning'
,
message
:
'请选择要删除的数据'
})
return
}
multipleSelection
.
value
&&
multipleSelection
.
value
.
map
(
item
=>
{
ids
.
push
(
item
.
ID
)
})
const
res
=
await
deleteQshToiletByIds
({
ids
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
ids
.
push
(
item
.
ID
)
})
if
(
tableData
.
value
.
length
===
ids
.
length
&&
page
.
value
>
1
)
{
page
.
value
--
const
res
=
await
deleteQshToiletByIds
({
ids
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
})
if
(
tableData
.
value
.
length
===
ids
.
length
&&
page
.
value
>
1
)
{
page
.
value
--
}
deleteVisible
.
value
=
false
getTableData
()
}
deleteVisible
.
value
=
false
getTableData
()
}
}
// 行为控制标记(弹窗内部需要增还是改)
const
type
=
ref
(
''
)
// 行为控制标记(弹窗内部需要增还是改)
const
type
=
ref
(
''
)
// 更新行
const
updateQshToiletFunc
=
async
(
row
)
=>
{
const
res
=
await
findQshToilet
({
ID
:
row
.
ID
})
type
.
value
=
'update'
if
(
res
.
code
===
0
)
{
formData
.
value
=
res
.
data
.
reqshToilet
dialogFormVisible
.
value
=
true
// 更新行
const
updateQshToiletFunc
=
async
(
row
)
=>
{
const
res
=
await
findQshToilet
({
ID
:
row
.
ID
})
type
.
value
=
'update'
if
(
res
.
code
===
0
)
{
formData
.
value
=
res
.
data
.
reqshToilet
dialogFormVisible
.
value
=
true
}
}
}
// 删除行
const
deleteQshToiletFunc
=
async
(
row
)
=>
{
const
res
=
await
deleteQshToilet
({
ID
:
row
.
ID
})
if
(
res
.
code
===
0
)
{
ElMessage
({
// 删除行
const
deleteQshToiletFunc
=
async
(
row
)
=>
{
const
res
=
await
deleteQshToilet
({
ID
:
row
.
ID
})
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'删除成功'
})
if
(
tableData
.
value
.
length
===
1
&&
page
.
value
>
1
)
{
page
.
value
--
page
.
value
--
}
getTableData
()
}
getTableData
()
}
}
// 弹窗控制标记
const
dialogFormVisible
=
ref
(
false
)
// 弹窗控制标记
const
dialogFormVisible
=
ref
(
false
)
// 打开弹窗
const
openDialog
=
()
=>
{
type
.
value
=
'create'
dialogFormVisible
.
value
=
true
}
// 打开弹窗
const
openDialog
=
()
=>
{
type
.
value
=
'create'
dialogFormVisible
.
value
=
true
}
// 关闭弹窗
const
closeDialog
=
()
=>
{
dialogFormVisible
.
value
=
false
formData
.
value
=
{
address
:
''
,
image
:
''
,
lat
:
''
,
lng
:
''
,
manager
:
''
,
managerPhone
:
''
,
monitor
:
''
,
name
:
''
,
showImage
:
''
,
type
:
undefined
,
// 关闭弹窗
const
closeDialog
=
()
=>
{
dialogFormVisible
.
value
=
false
formData
.
value
=
{
address
:
''
,
image
:
''
,
lat
:
''
,
lng
:
''
,
manager
:
''
,
managerPhone
:
''
,
monitor
:
''
,
name
:
''
,
showImage
:
''
,
type
:
undefined
,
}
}
// 弹窗确定
const
enterDialog
=
async
()
=>
{
let
res
switch
(
type
.
value
)
{
case
'create'
:
res
=
await
createQshToilet
(
formData
.
value
)
break
case
'update'
:
res
=
await
updateQshToilet
(
formData
.
value
)
break
default
:
res
=
await
createQshToilet
(
formData
.
value
)
break
}
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'创建/更改成功'
})
closeDialog
()
getTableData
()
}
}
}
// 弹窗确定
const
enterDialog
=
async
()
=>
{
let
res
switch
(
type
.
value
)
{
case
'create'
:
res
=
await
createQshToilet
(
formData
.
value
)
break
case
'update'
:
res
=
await
updateQshToilet
(
formData
.
value
)
break
default
:
res
=
await
createQshToilet
(
formData
.
value
)
break
}
if
(
res
.
code
===
0
)
{
ElMessage
({
type
:
'success'
,
message
:
'创建/更改成功'
})
closeDialog
()
getTableData
()
}
}
</
script
>
<
style
>
...
...
web/src/view/routerHolder.vue
View file @
40da75e2
<!-- 此路由可作为父类路由通用路由页面使用 如需自定义父类路由页面 请参考 @/view/superAdmin/index.vue -->
<
template
>
<div>
<router-view
v-slot=
"
{ Component }">
<transition
mode=
"out-in"
name=
"el-fade-in-linear"
>
<keep-alive
:include=
"routerStore.keepAliveRouters"
>
<component
:is=
"Component"
/>
</keep-alive>
</transition>
</router-view>
</div>
<router-view
v-slot=
"
{ Component }">
<transition
mode=
"out-in"
name=
"el-fade-in-linear"
>
<keep-alive
:include=
"routerStore.keepAliveRouters"
>
<component
:is=
"Component"
/>
</keep-alive>
</transition>
</router-view>
</
template
>
<
script
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment