232 lines
7.0 KiB
Vue
232 lines
7.0 KiB
Vue
<template>
|
||
<ai-list 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="info">
|
||
<div class="label">生效功能</div>
|
||
<div class="value">
|
||
<span>添加</span>
|
||
<span>办理</span>
|
||
<span>转交</span>
|
||
</div>
|
||
</div>
|
||
<div class="info">
|
||
<div class="label">生效身份</div>
|
||
<div class="value">
|
||
<span>网格员</span>
|
||
<span>网格长</span>
|
||
</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>
|
||
</div>
|
||
<div class="info">
|
||
<div class="label">生效身份</div>
|
||
<div class="value">
|
||
<span>网格员</span>
|
||
<span>网格长</span>
|
||
</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">
|
||
<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"
|
||
clearable
|
||
placeholder="请选择..."
|
||
:selectList="dict.getDict('clapEventStatus')">
|
||
</ai-select>
|
||
</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>
|
||
<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>
|
||
</el-form>
|
||
</ai-dialog>
|
||
</template>
|
||
</ai-list>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'AppPatrolReportSet',
|
||
label: '巡查上报设置',
|
||
|
||
props: {
|
||
instance: Function,
|
||
dict: Object,
|
||
permissions: Function
|
||
},
|
||
|
||
data () {
|
||
return {
|
||
dialog: false,
|
||
dialogTitle: '',
|
||
form: {
|
||
eventStatus: ''
|
||
},
|
||
checked: false,
|
||
checkList: ['0', '1']
|
||
}
|
||
},
|
||
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'}],
|
||
}
|
||
},
|
||
},
|
||
created() {
|
||
this.dict.load('clapEventStatus').then(() => {
|
||
|
||
})
|
||
},
|
||
methods: {
|
||
add() {
|
||
this.dialogTitle = '添加节点'
|
||
this.dialog = true
|
||
},
|
||
onConfirm() {
|
||
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.AppPatrolReportSet {
|
||
height: 100%;
|
||
.item {
|
||
padding: 0 0 4px 26px;
|
||
position: relative;
|
||
border-bottom: 1px solid #F2F2F2;
|
||
.info {
|
||
height: 22px;
|
||
font-family: MicrosoftYaHei;
|
||
font-size: 14px;
|
||
color: #888;
|
||
line-height: 22px;
|
||
margin-bottom: 16px;
|
||
.label {
|
||
display: inline-block;
|
||
width: 112px;
|
||
color: #888;
|
||
}
|
||
.value {
|
||
display: inline-block;
|
||
width: calc(100% - 112px);
|
||
color: #222;
|
||
span {
|
||
display: inline-block;
|
||
margin-right: 24px;
|
||
}
|
||
}
|
||
}
|
||
.index {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
height: 21px;
|
||
font-family: DINAlternate-Bold;
|
||
font-weight: 700;
|
||
font-size: 18px;
|
||
color: #666;
|
||
}
|
||
.btn {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
}
|
||
.flex {
|
||
display: flex;
|
||
.info {
|
||
width: 33.3%;
|
||
}
|
||
}
|
||
}
|
||
:deep(.ai-select) {
|
||
display: inline-block;
|
||
width: 300px;
|
||
margin-right: 16px;
|
||
}
|
||
}
|
||
</style>
|