易浩轩
1 year ago
13 changed files with 1067 additions and 0 deletions
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
@ -0,0 +1,380 @@ |
|||
<!-- 维修计划管理-堤防 --> |
|||
<script> |
|||
import { putDFMaintenancePlan, deleteDFMaintenancePlan, postDFMaintenancePlan, postDFMaintenancePlanList, getDFMaintenancePlan } from '@/api/management' |
|||
export default { |
|||
name: 'InspectionItems', |
|||
data() { |
|||
return { |
|||
searchInput: '', |
|||
dialogVisible: false, |
|||
prohibitEditing: false, |
|||
dikeLevel: [ |
|||
{ |
|||
id: 1, |
|||
label: '全部', |
|||
value: 1 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
label: '一级', |
|||
value: 2 |
|||
}, |
|||
{ |
|||
id: 3, |
|||
label: '二级', |
|||
value: 3 |
|||
}, |
|||
{ |
|||
id: 4, |
|||
label: '三级', |
|||
value: 4 |
|||
}, |
|||
{ |
|||
id: 5, |
|||
label: '四级', |
|||
value: 5 |
|||
}, |
|||
{ |
|||
id: 6, |
|||
label: '五级及以下', |
|||
value: 6 |
|||
}, |
|||
], // 堤防级别列表 |
|||
embankmentList: [ |
|||
{ |
|||
label: '堤防1', |
|||
value: '1', |
|||
id: '1', |
|||
}, |
|||
{ |
|||
label: '堤防2', |
|||
value: '2', |
|||
id: '2', |
|||
}, |
|||
{ |
|||
label: '堤防3', |
|||
value: '3', |
|||
id: '3', |
|||
} |
|||
], // 堤防名称列表 |
|||
searchLevel: 1, // 筛选堤防级别 |
|||
tableData: [], // 检查列表 |
|||
pageData: { |
|||
pageNum: 1, // 当前页 |
|||
pageSize: 10, // 请求数量 |
|||
pageSizes: [10, 20, 50, 100], |
|||
total: 0 // 总数量 |
|||
}, |
|||
ruleForm: { |
|||
dikeCode: '', |
|||
name: '', |
|||
planTime: '', |
|||
nationalSupplement: 0, |
|||
selfSupplement: 0, |
|||
budget: 0, |
|||
location: '', |
|||
content: '', |
|||
}, |
|||
rules: { |
|||
dikeCode: [ |
|||
{ required: true, message: '请选择堤防名称', trigger: 'blur' } |
|||
], |
|||
name: [ |
|||
{ required: true, message: '请输入维养计划名称', trigger: 'blur' }, |
|||
{ max: 100, message: '名称最长为100个字符', trigger: 'blur' } |
|||
], |
|||
planTime: [ |
|||
{ required: true, message: '请选计划时间', trigger: 'change' } |
|||
], |
|||
nationalSupplement: [ |
|||
{ required: true, message: '请输入资金', trigger: 'change' } |
|||
], |
|||
selfSupplement: [ |
|||
{ required: true, message: '请输入资金', trigger: 'change' } |
|||
], |
|||
location: [ |
|||
{ required: true, message: '请输入具体地点', trigger: 'change' } |
|||
], |
|||
content: [ |
|||
{ required: true, message: '请输入维修养护内容', trigger: 'change' } |
|||
], |
|||
} |
|||
} |
|||
}, |
|||
watch: { |
|||
dialogVisible(newVal, oldVal) { |
|||
if (oldVal) { |
|||
this.prohibitEditing = false |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
// 删除对应维修计划 |
|||
deleteTableItem(row) { |
|||
deleteDFMaintenancePlan(row.id).then((res) => { |
|||
console.log('🚀res🚀', res) |
|||
this.getTableData() |
|||
this.$message.success('删除成功'); |
|||
}) |
|||
}, |
|||
// 查看或编辑计划详情 |
|||
viewOrEditPlanDetails(row, edit = false) { |
|||
if (!edit) { |
|||
this.prohibitEditing = true |
|||
} |
|||
getDFMaintenancePlan(row.id).then((res) => { |
|||
console.log('🚀res🚀', res) |
|||
this.ruleForm = res.data |
|||
this.ruleForm.budget = res.data.nationalSupplement + res.data.selfSupplement |
|||
this.dialogVisible = true |
|||
}) |
|||
}, |
|||
// 保存维修计划 |
|||
submitForm(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
if (this.ruleForm.id) { |
|||
putDFMaintenancePlan(this.ruleForm).then(() => { |
|||
this.getTableData() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: '保存成功', |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} else { |
|||
postDFMaintenancePlan(this.ruleForm).then(() => { |
|||
this.getTableData() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: '保存成功', |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} |
|||
} else { |
|||
console.log('校验不通过'); |
|||
return false; |
|||
} |
|||
}); |
|||
}, |
|||
// 重置校验 |
|||
resetForm(formName) { |
|||
this.$refs[formName].resetFields(); |
|||
this.dialogVisible = false |
|||
}, |
|||
|
|||
// 关闭dialog |
|||
closeDialog(ruleForm = 'ruleForm') { |
|||
console.log('触发关闭dialog', ruleForm); |
|||
this.$refs[ruleForm].resetFields(); |
|||
this.ruleForm = { |
|||
dikeCode: '', |
|||
name: '', |
|||
planTime: '', |
|||
nationalSupplement: 0, |
|||
selfSupplement: 0, |
|||
location: '', |
|||
budget: 0, |
|||
content: '', |
|||
} |
|||
}, |
|||
// 计算预算 |
|||
calculateBudget() { |
|||
this.ruleForm.budget = Number(this.ruleForm.selfSupplement) + Number(this.ruleForm.nationalSupplement) |
|||
}, |
|||
// 获取数据 |
|||
getTableData(value = '') { |
|||
postDFMaintenancePlanList({ |
|||
data: { |
|||
timeView: { |
|||
timeField: "create_time" |
|||
}, |
|||
}, |
|||
cv: { |
|||
name: "name", |
|||
type: "like", |
|||
value |
|||
}, |
|||
pageSize: this.pageData.pageSize, |
|||
pageNum: this.pageData.pageNum |
|||
}).then((res) => { |
|||
if (res) { |
|||
this.tableData = res.records |
|||
this.pageData.total = res.total |
|||
} |
|||
console.log('🚀表格数据🚀', res) |
|||
}) |
|||
} |
|||
}, |
|||
mounted() { |
|||
// 获取列表数据 |
|||
this.getTableData() |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div class="body"> |
|||
<div class="top-title"> |
|||
基础信息管理 |
|||
</div> |
|||
<div class="table-box"> |
|||
<div class="top-search"> |
|||
<span>维养计划名称：</span> |
|||
<el-input class="search-input" v-model="searchInput" placeholder="请输入维养计划名称" /> |
|||
<span>堤防级别：</span> |
|||
<el-select v-model="searchLevel" placeholder="请选择"> |
|||
<el-option v-for="item in dikeLevel" :label="item.label" :value="item.value" :key="item.id"></el-option> |
|||
</el-select> |
|||
<el-button class="search-btn" type="success" @click="getTableData(searchInput)">搜索</el-button> |
|||
</div> |
|||
<el-button class="search-btn" style=" margin-right: 16px;margin-bottom: 8px; float: right;" type="success" |
|||
@click="dialogVisible = true">添加</el-button> |
|||
<el-table class="table" height="640" :data="tableData" border> |
|||
<el-table-column type="index" align="center" label="序号" width="100" /> |
|||
<el-table-column prop="name" align="center" label="维养计划名称" /> |
|||
<el-table-column prop="" align="center" label="堤防级别" /> |
|||
<el-table-column prop="location" align="center" label="具体地点" /> |
|||
<el-table-column prop="content" align="center" label="维修养护内容" /> |
|||
<el-table-column prop="nationalSupplement" align="center" label="国补" /> |
|||
<el-table-column prop="selfSupplement" align="center" label="自筹" /> |
|||
<el-table-column prop="createTime" align="center" sortable label="创建时间"> |
|||
</el-table-column> |
|||
<el-table-column prop="updateTime" align="center" sortable label="更新时间"> |
|||
</el-table-column> |
|||
<el-table-column prop="address" align="center" label="操作"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="viewOrEditPlanDetails(scope.row)" type="text" size="small">查看</el-button> |
|||
<el-button @click="viewOrEditPlanDetails(scope.row, true)" type="text" size="small">编辑</el-button> |
|||
<el-button style=" margin-right: 9px;" type="text" size="small">记录</el-button> |
|||
<el-popconfirm confirm-button-text='确定' cancel-button-text='取消' icon="el-icon-info" icon-color="red" |
|||
title="确定删除吗？" @confirm="deleteTableItem(scope.row)"> |
|||
<el-button style="color: red;" type="text" size="small" slot="reference">删除</el-button> |
|||
</el-popconfirm> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<el-pagination background class="pagination" style="margin-top: 16px;margin-right: 16px;float: right;" |
|||
:current-page="pageData.pageNum" :page-sizes="pageData.pageSizes" layout="total, prev, pager, next, sizes, jumper" |
|||
:total="pageData.total" @size-change="getTableData()"> |
|||
</el-pagination> |
|||
</div> |
|||
<el-dialog title="新增/编辑维养计划" @close="closeDialog" :visible.sync="dialogVisible" width="38%"> |
|||
<div style="display: flex; margin-bottom: 16px;"> |
|||
<div style="width: 5px; height: 16px; background-color: #31a08e; margin-right: 8px;"></div><span |
|||
style="font-weight: 600;">基础信息</span> |
|||
</div> |
|||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> |
|||
<el-form-item label-width="120px" label="堤防名称" prop="dikeCode"> |
|||
<el-select v-model="ruleForm.dikeCode" placeholder="请选择" @change="ruleForm.name = ruleForm.dikeCode" |
|||
:disabled="prohibitEditing"> |
|||
<el-option v-for="item in embankmentList" :label="item.label" :value="item.value" :key="item.id"></el-option> |
|||
</el-select> |
|||
<el-button button class="search-btn" type="success" size="small">详情</el-button> |
|||
<el-button button class="search-btn" type="success" size="small">打开地图</el-button> |
|||
</el-form-item> |
|||
<div style="display: flex;"> |
|||
<el-form-item label-width="120px" label="维养计划名称" prop="name"> |
|||
<el-input style="width: 202px;" v-model="ruleForm.name" placeholder="请输入" :disabled="prohibitEditing" /> |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="计划时间" prop="planTime"> |
|||
<el-date-picker v-model="ruleForm.planTime" type="month" placeholder="选择月" :disabled="prohibitEditing" |
|||
value-format="yy-MM-dd"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</div> |
|||
<div style="display: flex;"> |
|||
<el-form-item label-width="120px" label="国补资金" prop="nationalSupplement"> |
|||
<el-input style="width: 79px;" v-model="ruleForm.nationalSupplement" type="number" @input="calculateBudget()" |
|||
placeholder="请输入" :disabled="prohibitEditing" /> 万元 |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="自筹资金" prop="selfSupplement"> |
|||
<el-input style="width: 79px;" v-model="ruleForm.selfSupplement" type="number" @input="calculateBudget()" |
|||
placeholder="请输入" :disabled="prohibitEditing" /> 万元 |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="项目预算"> |
|||
<el-input style="width: 79px;" v-model="ruleForm.budget" disabled /> |
|||
</el-form-item> |
|||
</div> |
|||
<el-form-item label-width="120px" label="具体地点" prop="location"> |
|||
<el-input style="width: 542px;" :autosize="{ minRows: 5 }" type="textarea" maxlength="500" show-word-limit |
|||
v-model="ruleForm.location" placeholder="请输入" :disabled="prohibitEditing" /> |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="维修养护内容" prop="content"> |
|||
<el-input style="width: 542px;" :autosize="{ minRows: 5 }" type="textarea" maxlength="500" show-word-limit |
|||
v-model="ruleForm.content" placeholder="请输入" :disabled="prohibitEditing" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button size="mini" @click="resetForm('ruleForm')">取 消</el-button> |
|||
<el-button v-if="!prohibitEditing" size="mini" type="primary" @click="submitForm('ruleForm')">保存</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"> |
|||
.body { |
|||
width: 100%; |
|||
min-height: calc(100vh - 56px); |
|||
margin-left: 24px; |
|||
|
|||
.top-title { |
|||
height: 40px; |
|||
background-color: white; |
|||
display: flex; |
|||
padding-left: 16px; |
|||
align-items: center; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.table-box { |
|||
width: 100%; |
|||
min-height: calc(100vh - 56px - 64px); |
|||
margin-top: 24px; |
|||
padding: 16px; |
|||
background-color: white; |
|||
|
|||
.top-search { |
|||
display: flex; |
|||
align-items: center; |
|||
margin-bottom: 8px; |
|||
|
|||
.search-input { |
|||
width: 300px; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
.table { |
|||
height: calc(680px - 34px); |
|||
} |
|||
} |
|||
|
|||
.search-btn { |
|||
margin-left: 10px; |
|||
background-color: #37b29e; |
|||
border: none; |
|||
|
|||
&:hover { |
|||
background-color: #5ac6b9; |
|||
} |
|||
|
|||
&:active { |
|||
background-color: #2b8070; |
|||
} |
|||
|
|||
; |
|||
} |
|||
} |
|||
|
|||
/deep/.el-input__count { |
|||
height: 15px; |
|||
line-height: 15px; |
|||
margin-right: 10px; |
|||
margin-bottom: -4px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,22 @@ |
|||
<!-- 维修计划管理-水库 --> |
|||
<script> |
|||
export default { |
|||
name: '', |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
水库 |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,22 @@ |
|||
<!-- 维修计划管理-水闸 --> |
|||
<script> |
|||
export default { |
|||
name: '', |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
水闸 |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,29 @@ |
|||
<!-- 维修计划管理 --> |
|||
<script> |
|||
import Dike from './Dike.vue' |
|||
import Reservoir from './Reservoir.vue' |
|||
import Sluice from './Sluice.vue' |
|||
export default { |
|||
name: 'InspectionItems', |
|||
components: { |
|||
Reservoir, // 水库 |
|||
Sluice, // 水闸 |
|||
Dike, // 堤防 |
|||
}, |
|||
computed: { |
|||
selectTab() { |
|||
return this.$store.state.topTab.selectTab |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<Reservoir v-if="selectTab == 0"></Reservoir> |
|||
<Sluice v-if="selectTab == 1"></Sluice> |
|||
<Dike v-if="selectTab == 2"></Dike> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,3 @@ |
|||
<template > |
|||
<router-view /> |
|||
</template> |
|||
@ -0,0 +1,511 @@ |
|||
<!-- 害堤动物防护计划管理-堤防 --> |
|||
<script> |
|||
import { putDFMaintenancePlan, deleteDFMaintenancePlan, postDFMaintenancePlan, postDFMaintenancePlanList, getDFMaintenancePlan, listUser } from '@/api/management' |
|||
export default { |
|||
name: 'InspectionItems', |
|||
data() { |
|||
return { |
|||
searchInput: '', |
|||
controlInput: '', |
|||
selectLevel: 1, |
|||
selectType: 3, |
|||
dialogVisible: false, |
|||
prohibitEditing: false, |
|||
personnelList: [], // 人员列表 |
|||
dikeLevel: [ |
|||
{ |
|||
id: 1, |
|||
label: '全部', |
|||
value: 1 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
label: '一级', |
|||
value: 2 |
|||
}, |
|||
{ |
|||
id: 3, |
|||
label: '二级', |
|||
value: 3 |
|||
}, |
|||
{ |
|||
id: 4, |
|||
label: '三级', |
|||
value: 4 |
|||
}, |
|||
{ |
|||
id: 5, |
|||
label: '四级', |
|||
value: 5 |
|||
}, |
|||
{ |
|||
id: 6, |
|||
label: '五级及以下', |
|||
value: 6 |
|||
}, |
|||
], // 堤防级别列表 |
|||
embankmentList: [ |
|||
{ |
|||
label: '堤防1', |
|||
value: '1', |
|||
id: '1', |
|||
}, |
|||
{ |
|||
label: '堤防2', |
|||
value: '2', |
|||
id: '2', |
|||
}, |
|||
{ |
|||
label: '堤防3', |
|||
value: '3', |
|||
id: '3', |
|||
} |
|||
], // 堤防名称列表 |
|||
controlType: [ |
|||
{ |
|||
id: 1, |
|||
label: '普查', |
|||
value: 0 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
label: '防治', |
|||
value: 1 |
|||
}, |
|||
{ |
|||
id: 3, |
|||
label: '治理', |
|||
value: 2 |
|||
} |
|||
], |
|||
tableData: [], // 检查列表 |
|||
workTable: [ |
|||
{ |
|||
id: 1, |
|||
content: '对堤坝进行巡查，对发现的红火蚁巢穴、鼠洞及时处理并对鼠洞进行回填。', |
|||
date: '11月1日-11月30日', |
|||
weekday: '1', |
|||
} |
|||
], // 工作内容表格 |
|||
pageData: { |
|||
pageNum: 1, // 当前页 |
|||
pageSize: 10, // 请求数量 |
|||
pageSizes: [10, 20, 50, 100], |
|||
total: 0 // 总数量 |
|||
}, |
|||
ruleForm: { |
|||
dikeCode: '', |
|||
name: '', |
|||
planTime: 0, |
|||
nationalSupplement: '', |
|||
workMonth: '1月', |
|||
reminderCycle: '', |
|||
selectDate: 1, |
|||
selectUser: [], |
|||
messageReminder: false, |
|||
week: 1, |
|||
date: 1, |
|||
reminderTime: '', |
|||
}, |
|||
rules: { |
|||
dikeCode: [ |
|||
{ required: true, message: '请选择堤防名称', trigger: 'blur' } |
|||
], |
|||
name: [ |
|||
{ required: true, message: '请输入维养计划名称', trigger: 'blur' }, |
|||
{ max: 100, message: '名称最长为100个字符', trigger: 'blur' } |
|||
], |
|||
planTime: [ |
|||
{ required: true, message: '请选择计划名称', trigger: 'change' } |
|||
], |
|||
nationalSupplement: [ |
|||
{ required: true, message: '请输入资金', trigger: 'change' } |
|||
], |
|||
workMonth: [ |
|||
{ required: true, message: '请输入资金', trigger: 'change' } |
|||
], |
|||
reminderCycle: [ |
|||
{ required: true, message: '请选择提醒日期', trigger: 'change' } |
|||
], |
|||
selectUser: [ |
|||
{ required: true, message: '请选择责任人', trigger: 'change' } |
|||
], |
|||
reminderTime: [ |
|||
{ required: true, message: '请选择提醒时间', trigger: 'change' } |
|||
], |
|||
} |
|||
} |
|||
}, |
|||
watch: { |
|||
dialogVisible(newVal, oldVal) { |
|||
if (oldVal) { |
|||
this.prohibitEditing = false |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
// 删除对应防治计划 |
|||
deleteTableItem(row) { |
|||
deleteDFMaintenancePlan(row.id).then((res) => { |
|||
this.getTableData() |
|||
this.$message.success('删除成功'); |
|||
}) |
|||
}, |
|||
// 删除对应工作内容 |
|||
deleteWorkTableItem(id) { |
|||
const index = this.workTable.findIndex((item) => item.id === id); |
|||
if (index !== -1) { |
|||
this.workTable.splice(index, 1); |
|||
} |
|||
}, |
|||
// 搜索用户 |
|||
searchUser(e) { |
|||
listUser({ |
|||
data: { |
|||
timeView: { |
|||
timeField: "create_time" |
|||
}, |
|||
}, |
|||
cv: { |
|||
name: "nickName", |
|||
type: "like", |
|||
value: e |
|||
}, |
|||
pageSize: 100, |
|||
pageNum: 1 |
|||
}).then((res) => { |
|||
this.personnelList = res.records |
|||
}) |
|||
}, |
|||
// 查看或编辑计划详情 |
|||
viewOrEditPlanDetails(row, edit = false) { |
|||
if (!edit) { |
|||
this.prohibitEditing = true |
|||
} |
|||
getDFMaintenancePlan(row.id).then((res) => { |
|||
console.log('🚀res🚀', res) |
|||
this.ruleForm = res.data |
|||
this.ruleForm.reminderCycle = res.data.nationalSupplement + res.data.workMonth |
|||
this.dialogVisible = true |
|||
}) |
|||
}, |
|||
// 保存维修计划 |
|||
submitForm(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
if (this.ruleForm.id) { |
|||
putDFMaintenancePlan(this.ruleForm).then(() => { |
|||
this.getTableData() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: '保存成功', |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} else { |
|||
postDFMaintenancePlan(this.ruleForm).then(() => { |
|||
this.getTableData() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: '保存成功', |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} |
|||
} else { |
|||
console.log('校验不通过'); |
|||
return false; |
|||
} |
|||
}); |
|||
}, |
|||
// 重置校验 |
|||
resetForm(formName) { |
|||
this.$refs[formName].resetFields(); |
|||
this.dialogVisible = false |
|||
}, |
|||
|
|||
// 关闭dialog |
|||
closeDialog(ruleForm = 'ruleForm') { |
|||
console.log('触发关闭dialog', ruleForm); |
|||
this.$refs[ruleForm].resetFields(); |
|||
this.ruleForm = { |
|||
dikeCode: '', |
|||
name: '', |
|||
planTime: '', |
|||
nationalSupplement: 0, |
|||
workMonth: 0, |
|||
location: '', |
|||
reminderCycle: 0, |
|||
content: '', |
|||
} |
|||
}, |
|||
// 添加工作项 |
|||
addWorkItem() { |
|||
this.workTable.push({ |
|||
id: this.workTable.length + 1, |
|||
content: '', |
|||
date: '', |
|||
weekday: '', |
|||
}) |
|||
}, |
|||
// 获取数据 |
|||
getTableData(value = '') { |
|||
postDFMaintenancePlanList({ |
|||
data: { |
|||
timeView: { |
|||
timeField: "create_time" |
|||
}, |
|||
}, |
|||
cv: { |
|||
name: "name", |
|||
type: "like", |
|||
value |
|||
}, |
|||
pageSize: this.pageData.pageSize, |
|||
pageNum: this.pageData.pageNum |
|||
}).then((res) => { |
|||
if (res) { |
|||
this.tableData = res.records |
|||
this.pageData.total = res.total |
|||
} |
|||
console.log('🚀表格数据🚀', res) |
|||
}) |
|||
}, |
|||
// 重置搜索 |
|||
resetSearch() { |
|||
this.searchInput = '' |
|||
this.selectStatus = '2' |
|||
this.getTableData() |
|||
} |
|||
}, |
|||
mounted() { |
|||
// 获取列表数据 |
|||
this.getTableData() |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div class="body"> |
|||
<div class="top-title"> |
|||
基础信息管理 |
|||
</div> |
|||
<div class="table-box"> |
|||
<div class="top-search"> |
|||
<span>防治计划名称：</span> |
|||
<el-input class="search-input" v-model="searchInput" placeholder="请输入" /> |
|||
<span>防治堤防：</span> |
|||
<el-input class="search-input" v-model="controlInput" placeholder="请输入" /> |
|||
<span>堤防级别：</span> |
|||
<el-select v-model="selectLevel" placeholder="请选择"> |
|||
<el-option v-for="item in dikeLevel" :label="item.label" :value="item.value" :key="item.id" /> |
|||
</el-select> |
|||
<span style="margin-left: 10px;">防治类型：</span> |
|||
<el-select v-model="selectType" placeholder="请选择"> |
|||
<el-option label="全部" :value="3" /> |
|||
<el-option v-for="item in controlType" :label="item.label" :value="item.value" :key="item.id" /> |
|||
</el-select> |
|||
<el-button class="search-btn" type="success" @click="getTableData(searchInput)">搜索</el-button> |
|||
<el-button @click="resetSearch()">重置</el-button> |
|||
</div> |
|||
<el-button class="search-btn" style=" margin-right: 16px;margin-bottom: 8px; float: right;" type="success" |
|||
@click="dialogVisible = true">添加</el-button> |
|||
<el-table class="table" height="640" :data="tableData" border> |
|||
<el-table-column type="index" align="center" label="序号" width="100" /> |
|||
<el-table-column prop="name" align="center" label="防治计划名称" /> |
|||
<el-table-column prop="" align="center" label="防治堤防" /> |
|||
<el-table-column prop="location" align="center" label="堤防级别" /> |
|||
<el-table-column prop="content" align="center" label="堤防类型" /> |
|||
<el-table-column prop="nationalSupplement" align="center" label="防治类型" /> |
|||
<el-table-column prop="createTime" align="center" sortable label="创建时间" /> |
|||
<el-table-column prop="updateTime" align="center" sortable label="更新时间" /> |
|||
<el-table-column prop="address" align="center" label="操作"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="viewOrEditPlanDetails(scope.row)" type="text" size="small">查看</el-button> |
|||
<el-button @click="viewOrEditPlanDetails(scope.row, true)" type="text" size="small">编辑</el-button> |
|||
<el-button style=" margin-right: 9px;" type="text" size="small">记录</el-button> |
|||
<el-popconfirm confirm-button-text='确定' cancel-button-text='取消' icon="el-icon-info" icon-color="red" |
|||
title="确定删除吗？" @confirm="deleteTableItem(scope.row)"> |
|||
<el-button style="color: red;" type="text" size="small" slot="reference">删除</el-button> |
|||
</el-popconfirm> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<el-pagination background class="pagination" style="margin-top: 16px;margin-right: 16px;float: right;" |
|||
:current-page="pageData.pageNum" :page-sizes="pageData.pageSizes" layout="total, prev, pager, next, sizes, jumper" |
|||
:total="pageData.total" @size-change="getTableData()"> |
|||
</el-pagination> |
|||
</div> |
|||
<el-dialog title="新增/编辑防治计划" @close="closeDialog" :visible.sync="dialogVisible" width="38%"> |
|||
<div style="display: flex; margin-bottom: 16px;"> |
|||
<div style="width: 5px; height: 16px; background-color: #31a08e; margin-right: 8px;"></div> |
|||
<span style="font-weight: 600;">基础信息</span> |
|||
</div> |
|||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> |
|||
<el-form-item label-width="120px" label="防治堤防" prop="dikeCode"> |
|||
<el-input style="width: 202px;" v-model="ruleForm.dikeCode" placeholder="请输入" :disabled="prohibitEditing" /> |
|||
<el-button button class="search-btn" type="success" size="small">详情</el-button> |
|||
<el-button button class="search-btn" type="success" size="small">打开地图</el-button> |
|||
</el-form-item> |
|||
<div style="display: flex;"> |
|||
<el-form-item label-width="120px" label="防治计划名称" prop="name"> |
|||
<el-input style="width: 202px;" v-model="ruleForm.name" placeholder="请输入" :disabled="prohibitEditing" /> |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="防治类型" prop="planTime"> |
|||
<el-select v-model="ruleForm.planTime" placeholder="请输入" :disabled="prohibitEditing"> |
|||
<el-option v-for="item in controlType" :key="item.id" :label="item.label" :value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</div> |
|||
<el-form-item label-width="120px" label="防治说明" prop="nationalSupplement"> |
|||
<el-input v-model="ruleForm.nationalSupplement" type="textarea" placeholder=" 请输入" |
|||
:disabled="prohibitEditing" /> |
|||
</el-form-item> |
|||
<div style="display: flex; margin-bottom: 16px;"> |
|||
<div style="width: 5px; height: 16px; background-color: #31a08e; margin-right: 8px;"></div> |
|||
<span style="font-weight: 600;">工作内容</span> |
|||
</div> |
|||
<el-form-item label-width="120px" label="工作月份" prop="workMonth"> |
|||
<el-select v-model="ruleForm.workMonth" placeholder="请输入" :disabled="prohibitEditing"> |
|||
<el-option v-for="(item, index) in 12 " :label="(index + 1) + '月'" :value="item" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-table style="margin-bottom: 22px;" max-height="330" :data="workTable" border> |
|||
<el-table-column type="index" align="center" label="序号" width="50" /> |
|||
<el-table-column prop="content" align="center" label="工作内容"> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="scope.row.content" placeholder="请输入工作内容" /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="date" align="center" label="施工日期"> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="scope.row.date" placeholder="请输入施工日期" /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="weekday" align="center" label="计划工日" width="80"> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="scope.row.weekday" placeholder="请输入计划工日" /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column align="center" label="操作" width="100"> |
|||
<template slot-scope="scope"> |
|||
<el-button style=" margin-right: 9px;" type="text" size="small" @click="addWorkItem">添加</el-button> |
|||
<el-popconfirm confirm-button-text='确定' cancel-button-text='取消' icon="el-icon-info" icon-color="red" |
|||
title="确定删除吗？" @confirm="deleteWorkTableItem(scope.row.id)"> |
|||
<el-button v-if="workTable.length > 1" style="color: red;" type="text" size="small" |
|||
slot="reference">删除</el-button> |
|||
</el-popconfirm> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<div style="display: flex;"> |
|||
<el-form-item label-width="120px" label="提醒周期" prop="reminderCycle"> |
|||
<el-input style="width: 80px;" v-model="ruleForm.reminderCycle" /> |
|||
/次 |
|||
<el-select style="width: 80px;" v-model="ruleForm.selectDate" placeholder="请选择日期"> |
|||
<el-option label="天" :value="0" /> |
|||
<el-option label="周" :value="1" /> |
|||
<el-option label="月" :value="2" /> |
|||
</el-select> /日期 |
|||
</el-form-item> |
|||
<el-form-item label-width="120px" label="责任人" prop="selectUser"> |
|||
<el-select v-model="ruleForm.selectUser" multiple filterable remote :remote-method="searchUser" value-key="id" |
|||
placeholder="请输入关键词搜索用户" prop="selectUser"> |
|||
<el-option v-for=" item in personnelList " :key="item.id" :label="item.nickName" :value="item"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</div> |
|||
<div style="display: flex;"> |
|||
<el-form-item label-width="120px" label="消息提醒" prop="messageReminder"> |
|||
<el-switch v-model="ruleForm.messageReminder" active-color="#31a08e" inactive-color="#dcdfe6"> |
|||
</el-switch> |
|||
</el-form-item> |
|||
<el-form-item v-if="ruleForm.messageReminder" label-width="120px" label="提醒时间" prop="reminderTime"> |
|||
<el-radio-group v-if="ruleForm.selectDate == 1" style="margin-bottom: 16px;" v-model="ruleForm.week"> |
|||
<el-radio :label="1">星期一</el-radio> |
|||
<el-radio :label="2">星期二</el-radio> |
|||
<el-radio :label="3">星期三</el-radio> |
|||
<el-radio :label="4">星期四</el-radio> |
|||
<el-radio :label="5">星期五</el-radio> |
|||
<el-radio :label="6">星期六</el-radio> |
|||
<el-radio :label="7">星期日</el-radio> |
|||
</el-radio-group> |
|||
<div v-if="ruleForm.selectDate == 2" style="margin-bottom: 16px;">每月<el-input style="width: 202px;" |
|||
v-model="ruleForm.date" />号 |
|||
</div> |
|||
<el-time-picker v-model="ruleForm.reminderTime" value-format="yyyy-MM-dd hh:mm:ss" placeholder="选择时间" /> |
|||
</el-form-item> |
|||
</div> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button size="mini" @click="resetForm('ruleForm')">取 消</el-button> |
|||
<el-button v-if="!prohibitEditing" size="mini" type="primary" @click="submitForm('ruleForm')">保存</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"> |
|||
.body { |
|||
width: 100%; |
|||
min-height: calc(100vh - 56px); |
|||
margin-left: 24px; |
|||
|
|||
.top-title { |
|||
height: 40px; |
|||
background-color: white; |
|||
display: flex; |
|||
padding-left: 16px; |
|||
align-items: center; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.table-box { |
|||
width: 100%; |
|||
min-height: calc(100vh - 56px - 64px); |
|||
margin-top: 24px; |
|||
padding: 16px; |
|||
background-color: white; |
|||
|
|||
.top-search { |
|||
margin-bottom: 8px; |
|||
|
|||
.search-input { |
|||
width: 202px; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
.table { |
|||
height: calc(680px - 34px); |
|||
} |
|||
} |
|||
|
|||
.search-btn { |
|||
margin-left: 10px; |
|||
background-color: #37b29e; |
|||
border: none; |
|||
|
|||
&:hover { |
|||
background-color: #5ac6b9; |
|||
} |
|||
|
|||
&:active { |
|||
background-color: #2b8070; |
|||
} |
|||
|
|||
; |
|||
} |
|||
} |
|||
|
|||
/deep/.el-input__count { |
|||
height: 15px; |
|||
line-height: 15px; |
|||
margin-right: 10px; |
|||
margin-bottom: -4px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,22 @@ |
|||
<!-- 维修计划管理-水库 --> |
|||
<script> |
|||
export default { |
|||
name: '', |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
水库 |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,22 @@ |
|||
<!-- 维修计划管理-水闸 --> |
|||
<script> |
|||
export default { |
|||
name: '', |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
水闸 |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,29 @@ |
|||
<!-- 维修计划管理 --> |
|||
<script> |
|||
import Dike from './Dike.vue' |
|||
import Reservoir from './Reservoir.vue' |
|||
import Sluice from './Sluice.vue' |
|||
export default { |
|||
name: 'InspectionItems', |
|||
components: { |
|||
Reservoir, // 水库 |
|||
Sluice, // 水闸 |
|||
Dike, // 堤防 |
|||
}, |
|||
computed: { |
|||
selectTab() { |
|||
return this.$store.state.topTab.selectTab |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<Reservoir v-if="selectTab == 0"></Reservoir> |
|||
<Sluice v-if="selectTab == 1"></Sluice> |
|||
<Dike v-if="selectTab == 2"></Dike> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped lang="less"></style> |
|||
Loading…
Reference in new issue