巡查上报设置

This commit is contained in:
liuye
2023-11-03 15:59:19 +08:00
parent 86171587a0
commit 91701965e9

View File

@@ -1,124 +1,140 @@
<template>
<ai-list class="AppPatrolReportSet">
<ai-detail class="AppPatrolReportSet">
<ai-title slot="title" title="巡查上报设置" isShowBottomBorder>
<el-button size="small" type="primary" icon="iconfont iconAdd" slot="rightBtn" @click="add">添加节点</el-button>
</ai-title>
<template slot="content">
<div class="item">
<div class="btn">
<el-button type="text">编辑</el-button>
<el-button type="text">删除</el-button>
</div>
<div class="index">01</div>
<div class="info">
<div class="label">节点类型</div>
<div class="value">混合节点</div>
</div>
<div class="info">
<div class="label">上级节点网络</div>
<div class="value">混合节点</div>
</div>
<div class="flex">
<div class="list" v-if="list.length">
<div class="item" v-for="(item, index) in list" :key="index">
<div class="btn">
<el-button type="text" @click="edit(index)">编辑</el-button>
<el-button type="text" @click="del(index)">删除</el-button>
</div>
<div class="index">{{index < 9 ? `0${index+1}` : `${index+1}`}}</div>
<div class="info">
<div class="label">生效功能</div>
<div class="value">
<span>添加</span>
<span>办理</span>
<span>转交</span>
</div>
<div class="label">节点类型</div>
<div class="value">{{item.nodeType == 0 ? '首节点' : $dict.getLabel('prfcNodeType', item.nodeType)}}</div>
</div>
<div class="info">
<div class="label">生效身份</div>
<div class="value">
<span>网格员</span>
<span>网格长</span>
<div class="label">上级节点网络</div>
<div class="value">{{item.girdName}}</div>
</div>
<div class="flex">
<div class="info">
<div class="label">生效功能</div>
<div class="value">
<span v-if="item.functionAdd == 1">添加</span>
<span v-if="item.functionHandle == 1">办理</span>
<span v-if="item.functionTransmit == 1">转交</span>
</div>
</div>
<div class="info">
<div class="label">生效身份</div>
<div class="value">
<span v-if="item.roleAdmin == 1">网格员</span>
<span v-if="item.roleMember == 1">网格长</span>
</div>
</div>
</div>
</div>
<div class="info">
<div class="label">同级节点网络</div>
<div class="value">李凤村子网络当前选中网格层级生效</div>
</div>
<div class="flex">
<div class="info">
<div class="label">生效功能</div>
<div class="value">
<span>添加</span>
<span>办理</span>
<span>转交</span>
<div v-if="item.nodeType == 3">
<div class="info">
<div class="label">同级节点网络</div>
<div class="value">{{item.girdName2}}</div>
</div>
</div>
<div class="info">
<div class="label">生效身份</div>
<div class="value">
<span>网格员</span>
<span>网格长</span>
<div class="flex">
<div class="info">
<div class="label">生效功能</div>
<div class="value">
<span v-if="item.functionAdd == 1">添加</span>
<span v-if="item.functionHandle == 1">办理</span>
<span v-if="item.functionTransmit == 1">转交</span>
</div>
</div>
<div class="info">
<div class="label">生效身份</div>
<div class="value">
<span v-if="item.roleAdmin == 1">网格员</span>
<span v-if="item.roleMember == 1">网格长</span>
</div>
</div>
<!-- <div class="info">
<div class="label">条件约束</div>
<div class="value">名称约束</div>
</div> -->
</div>
</div>
<div class="info">
<div class="label">条件约束</div>
<div class="value">名称约束</div>
</div>
</div>
</div>
<ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="$refs.form.resetFields()" @onConfirm="onConfirm">
<ai-empty v-else>暂无数据</ai-empty>
<ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="$refs.form.resetFields()" @onConfirm="onConfirm" width="60%">
<el-form ref="form" :rules="rules" size="small" :model="form" label-width="110px">
<el-form-item label="节点类型" prop="name">
<ai-select
v-model="form.eventStatus"
<el-form-item label="节点类型" prop="nodeType" v-if="form.nodeType === '0'">
<ai-select disabled
v-model="form.nodeType"
clearable
placeholder="请选择..."
:selectList="dict.getDict('clapEventStatus')">
:selectList="nodeTypeDictList">
</ai-select>
</el-form-item>
<el-form-item label="选择节点网格" prop="idNumber">
<ai-select
v-model="form.eventStatus"
<el-form-item label="节点类型" prop="nodeType" v-else>
<ai-select :disabled="getGirdList.length == 1"
v-model="form.nodeType"
clearable
placeholder="请选择..."
:selectList="dict.getDict('clapEventStatus')">
:selectList="dict.getDict('prfcNodeType')" @change="changeNodeType">
</ai-select>
<el-checkbox v-model="checked">当前选中网格层级生效</el-checkbox>
</el-form-item>
<el-form-item label="生效功能" prop="status">
<el-checkbox-group v-model="checkList">
<el-checkbox label="0">添加</el-checkbox>
<el-checkbox label="1">办理</el-checkbox>
<el-checkbox label="2">转交</el-checkbox>
</el-checkbox-group>
<el-form-item label="选择节点网格" prop="girdId" >
<ai-picker v-if="form.nodeType === '0'"
:ops="{label: 'girdName'}"
dialogTitle="选择节点网格"
action="/app/appgirdinfo/girdList"
:instance="instance"
@pick="onGirdChange"
v-model="form.girdIdList">
<div class="userSelcet">
<span style="color: #606266;" v-if="form.girdIdList.length">{{ form.girdName }}</span>
<span v-else>选择节点网格</span>
<i class="el-icon-arrow-down"></i>
</div>
</ai-picker>
<el-input placeholder="节点网格" v-model="form.girdName" disabled v-else></el-input>
<el-checkbox v-model="sameLevelUsed" disabled>当前选中网格层级生效</el-checkbox>
</el-form-item>
<el-form-item label="生效身份" prop="status">
<el-checkbox-group v-model="checkList">
<el-checkbox label="0">网格员</el-checkbox>
<el-checkbox label="1">网格长</el-checkbox>
</el-checkbox-group>
<el-form-item label="生效功能">
<el-checkbox v-model="form.functionAdd" true-label="1" false-label="0">添加</el-checkbox>
<el-checkbox v-model="form.functionHandle" true-label="1" false-label="0">办理</el-checkbox>
<el-checkbox v-model="form.functionTransmit" true-label="1" false-label="0">转交</el-checkbox>
</el-form-item>
<el-form-item label="同级节点网格" prop="idNumber">
<ai-select
v-model="form.eventStatus"
clearable
placeholder="请选择..."
:selectList="dict.getDict('clapEventStatus')">
</ai-select>
<el-checkbox v-model="checked">当前选中网格层级生效</el-checkbox>
</el-form-item>
<el-form-item label="生效功能" prop="status">
<el-checkbox-group v-model="checkList">
<el-checkbox label="0">添加</el-checkbox>
<el-checkbox label="1">办理</el-checkbox>
<el-checkbox label="2">转交</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="生效身份" prop="status">
<el-checkbox-group v-model="checkList">
<el-checkbox label="0">网格员</el-checkbox>
<el-checkbox label="1">网格长</el-checkbox>
</el-checkbox-group>
<el-form-item label="生效身份">
<el-checkbox v-model="form.roleAdmin" true-label="1" false-label="0">网格员</el-checkbox>
<el-checkbox v-model="form.roleMember" true-label="1" false-label="0">网格长</el-checkbox>
</el-form-item>
<div v-if="form.nodeType == 3">
<el-form-item label="同级节点网格" prop="girdId2">
<el-input placeholder="节点网格" v-model="form.girdName2" disabled></el-input>
<el-checkbox v-model="sameLevelUsed" disabled>当前选中网格层级生效</el-checkbox>
</el-form-item>
<el-form-item label="生效功能">
<el-checkbox v-model="form.functionAdd2" true-label="1" false-label="0">添加</el-checkbox>
<el-checkbox v-model="form.functionHandle2" true-label="1" false-label="0">办理</el-checkbox>
<el-checkbox v-model="form.functionTransmit2" true-label="1" false-label="0">转交</el-checkbox>
</el-form-item>
<el-form-item label="生效身份">
<el-checkbox v-model="form.roleAdmin2" true-label="1" false-label="0">网格员</el-checkbox>
<el-checkbox v-model="form.roleMember2" true-label="1" false-label="0">网格长</el-checkbox>
</el-form-item>
</div>
</el-form>
</ai-dialog>
</template>
</ai-list>
<template slot="footer">
<el-button @click="getList">取消</el-button>
<el-button type="primary" @click="confirm">提交</el-button>
</template>
</ai-detail>
</template>
<script>
@@ -137,35 +153,157 @@
dialog: false,
dialogTitle: '',
form: {
eventStatus: ''
nodeType: '', //0首节点、1上级、2同级、3混合
girdIdList: [],
girdId: '',
girdCode: '',
girdLevel: '',
girdName: '',
functionAdd: '1',
functionHandle: '1',
functionTransmit: '1',
roleAdmin: '1',
roleMember: '1',
girdId2: '',
girdCode2: '',
girdLevel2: '',
girdName2: '',
functionAdd2: '1',
functionHandle2: '1',
functionTransmit2: '1',
roleAdmin2: '1',
roleMember2: '1',
},
checked: false,
checkList: ['0', '1']
list: [],
nodeTypeDictList: [{dictName: '首节点', dictValue: '0'}],
sameLevelUsed: true,
getGirdList: [],
editIndex: ''
}
},
computed: {
rules() {
return {
name: [{ required: true, message: '请输入党员姓名', trigger: 'change'}],
idNumber: [{ required: true, message: '请选择党员', trigger: 'change'}],
status: [{ required: true, message: '请选择缴费状态', trigger: 'change'}],
ymd: [{ required: true, message: '请选择缴纳月份', trigger: 'change'}],
amount: [{ required: true, message: '请输入金额', trigger: 'blur'}],
nodeType: [{ required: true, message: '请选择节点类型', trigger: 'change'}],
girdId: [{ required: true, message: '请选择节点网络', trigger: 'change'}],
girdId2: [{ required: true, message: '请选择同级节点网格', trigger: 'change'}],
}
},
},
created() {
this.dict.load('clapEventStatus').then(() => {
this.dict.load('prfcNodeType').then(() => {
this.getList()
})
},
methods: {
add() {
this.form = {
nodeType: '', //0首节点、1上级、2同级、3混合
girdIdList: [],
girdId: '',
girdCode: '',
girdLevel: '',
girdName: '',
functionAdd: '1',
functionHandle: '1',
functionTransmit: '1',
roleAdmin: '1',
roleMember: '1',
girdId2: '',
girdCode2: '',
girdLevel2: '',
girdName2: '',
functionAdd2: '1',
functionHandle2: '1',
functionTransmit2: '1',
roleAdmin2: '1',
roleMember2: '1',
}
if(this.list.length > 0) {
this.getGird(this.list.length-1)
}else { //首节点
this.form.nodeType = '0'
}
this.dialogTitle = '添加节点'
this.dialog = true
this.$refs.form.resetFields()
},
del(index) {
this.$confirm('确定删除该节点?').then(() => {
this.list.splice(index, 1)
})
},
edit(index) {
this.editIndex = index
this.form = {...this.list[index]}
if(this.form.nodeType != '0') {
this.getGird(index)
}
this.dialogTitle = '编辑节点'
this.dialog = true
},
onConfirm() {
this.$refs.form.validate((valid) => {
if (valid) {
if(this.dialogTitle == '添加节点') {
this.list.push(this.form)
}else {
this.list.splice(this.editIndex, 1, this.form)
}
this.dialog = false
}
})
},
getList() {
this.instance.post(`/app/apppatrolreportflowconfigv2/queryNew`).then(res => {
if (res.code == 0) {
this.list = res.data
}
})
},
onGirdChange(e) {
this.form.girdId = e[0].id
this.form.girdCode = e[0].girdCode
this.form.girdLevel = e[0].girdLevel
this.form.girdName = e[0].girdName
},
changeNodeType(e) { //1 上下级节点取数组02同级节点选择数组1; 3混合节点主取数组0同级选择数组1
console.log(e)
var arr = []
if(e == 1) {
arr.push(this.getGirdList[0])
}
if(e == 2) {
arr.push(this.getGirdList[1])
}
if(e == 3) {
arr.push(this.getGirdList[0])
this.form.girdId2 = this.getGirdList[1].id
this.form.girdCode2 = this.getGirdList[1].girdCode
this.form.girdLevel2 = this.getGirdList[1].girdLevel
this.form.girdName2 = this.getGirdList[1].girdName
}
this.onGirdChange(arr)
},
getGird(index) {
var girdCode = this.list[index].girdCode
this.instance.post(`app/apppatrolreportflowconfigv2/choiseGird?previousGirdCode=${girdCode}`).then(res => {
if (res.code == 0) {
this.getGirdList = res.data
if(res.data.length == 1 && this.dialogTitle == '添加节点') { //返回数据一条表示nodeType 1 上下级节点混合节点主去数组0同级选择数组1同级节点选择数组1
this.form.nodeType = '1'
this.onGirdChange(res.data)
}
}
})
},
confirm() {
this.instance.post(`/app/apppatrolreportflowconfigv2/addOrUpdate`, this.list).then(res => {
if (res.code == 0) {
this.$message.success('提交成功')
this.getList()
}
})
}
}
}
@@ -174,8 +312,12 @@
<style lang="scss" scoped>
.AppPatrolReportSet {
height: 100%;
.list {
padding: 0 16px 16px;
background-color: #fff;
}
.item {
padding: 0 0 4px 26px;
padding: 16px 0 4px 26px;
position: relative;
border-bottom: 1px solid #F2F2F2;
.info {
@@ -202,7 +344,7 @@
}
.index {
position: absolute;
top: 0;
top: 16px;
left: 0;
height: 21px;
font-family: DINAlternate-Bold;
@@ -213,7 +355,7 @@
.btn {
position: absolute;
right: 0;
top: 0;
top: 16px;
}
.flex {
display: flex;
@@ -222,10 +364,27 @@
}
}
}
:deep(.ai-select) {
:deep(.ai-select),
:deep(.el-input) {
display: inline-block;
width: 300px;
width: 50%;
margin-right: 16px;
}
:deep(.AiPicker) {
display: inline-block;
width: 50%;
margin-right: 16px;
border: 1px solid #d0d4dc;
padding-left: 16px;
box-sizing: border-box;
border-radius: 4px;
position: relative;
.el-icon-arrow-down {
position: absolute;
top: 8px;
right: 8px;
}
}
}
</style>