You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1048 lines
25 KiB
1048 lines
25 KiB
4 years ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<div class="resi-container">
|
||
|
|
<el-card class="resi-card">
|
||
|
|
<el-row class="resi-row-box" :class="openSearch && 'resi-row-more'">
|
||
|
|
<el-row
|
||
|
|
v-for="(item, index) in sliceList(formList, 4)"
|
||
|
|
:key="index"
|
||
|
|
class="resi-row"
|
||
|
|
:gutter="20"
|
||
|
|
>
|
||
|
|
<el-col v-for="n in item" :key="n.id" :span="6">
|
||
|
|
<div class="resi-cell">
|
||
|
|
<div class="resi-cell-label">{{ n.label }}</div>
|
||
|
|
<div
|
||
|
|
class="resi-cell-value"
|
||
|
|
:class="n.item_type === 'radio' && 'resi-cell-value-radio'"
|
||
|
|
>
|
||
|
|
<el-input
|
||
|
|
v-if="n.item_type === 'input'"
|
||
|
|
v-model="form[n.column_name]"
|
||
|
|
class="resi-cell-input"
|
||
|
|
size="small"
|
||
|
|
clearable
|
||
|
|
placeholder="请输入内容"
|
||
|
|
>
|
||
|
|
</el-input>
|
||
|
|
<el-date-picker
|
||
|
|
v-else-if="n.item_type === 'date'"
|
||
|
|
v-model="form[n.column_name]"
|
||
|
|
class="resi-cell-input"
|
||
|
|
type="date"
|
||
|
|
size="small"
|
||
|
|
clearable
|
||
|
|
placeholder="选择日期"
|
||
|
|
>
|
||
|
|
</el-date-picker>
|
||
|
|
<el-select
|
||
|
|
v-else-if="n.item_type === 'select'"
|
||
|
|
v-model="form[n.column_name]"
|
||
|
|
placeholder="请选择"
|
||
|
|
size="small"
|
||
|
|
clearable
|
||
|
|
class="resi-cell-select"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in options"
|
||
|
|
:key="item.value"
|
||
|
|
:label="item.label"
|
||
|
|
:value="item.value"
|
||
|
|
>
|
||
|
|
</el-option>
|
||
|
|
</el-select>
|
||
|
|
<template v-else-if="n.item_type === 'radio'">
|
||
|
|
<el-radio v-model="form[n.column_name]" label="1"
|
||
|
|
>备选项</el-radio
|
||
|
|
>
|
||
|
|
<el-radio v-model="form[n.column_name]" label="2"
|
||
|
|
>备选项</el-radio
|
||
|
|
>
|
||
|
|
</template>
|
||
|
|
<template v-else-if="n.item_type === 'checkbox'">
|
||
|
|
<el-checkbox-group v-model="form[n.column_name]">
|
||
|
|
<el-checkbox label="复选框 A"></el-checkbox>
|
||
|
|
<el-checkbox label="复选框 B"></el-checkbox>
|
||
|
|
</el-checkbox-group>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-row>
|
||
|
|
<el-row class="resi-search">
|
||
|
|
<el-col :span="24">
|
||
|
|
<el-button type="primary" size="mini" @click="handleSearch"
|
||
|
|
>查询</el-button
|
||
|
|
>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<div class="resi-down" @click="handleOpenSearch">
|
||
|
|
<img v-if="openSearch" src="../../assets/img/arrow-up.png" />
|
||
|
|
<img v-else src="../../assets/img/arrow-down.png" />
|
||
|
|
</div>
|
||
|
|
</el-card>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<el-card class="resi-card-table">
|
||
|
|
<div class="resi-row-btn">
|
||
|
|
<el-button type="warning" size="small">导出</el-button>
|
||
|
|
<el-button type="success" size="small" @click="handleAdd"
|
||
|
|
>新增</el-button
|
||
|
|
>
|
||
|
|
<el-button type="primary" size="small">下载人口模板</el-button>
|
||
|
|
<el-button type="danger" size="small">导入人口数据</el-button>
|
||
|
|
</div>
|
||
|
|
<el-table :data="tableData" border style="width: 100%">
|
||
|
|
<el-table-column prop="date" label="日期" width="180">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="name" label="姓名" width="180">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="地址"> </el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<div>
|
||
|
|
<el-pagination
|
||
|
|
@size-change="handleSizeChange"
|
||
|
|
@current-change="handleCurrentChange"
|
||
|
|
:current-page.sync="currentPage"
|
||
|
|
:page-sizes="[100, 200, 300, 400]"
|
||
|
|
:page-size="100"
|
||
|
|
layout="sizes, prev, pager, next"
|
||
|
|
:total="1000"
|
||
|
|
>
|
||
|
|
</el-pagination>
|
||
|
|
</div>
|
||
|
|
</el-card>
|
||
|
|
|
||
|
|
<el-dialog
|
||
|
|
title="提示"
|
||
|
|
:visible.sync="dialogVisible"
|
||
|
|
width="80%"
|
||
|
|
:close-on-click-modal="true"
|
||
|
|
:before-close="handleClose"
|
||
|
|
>
|
||
|
|
<resi-form ref="baseForm" :form-list="formList" />
|
||
|
|
<div class="resi-other">
|
||
|
|
<div class="resi-other-title">其他</div>
|
||
|
|
<div class="tabs-other-info">
|
||
|
|
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||
|
|
<el-tab-pane
|
||
|
|
v-for="item in tabsList"
|
||
|
|
:key="item.column_name"
|
||
|
|
:label="item.label"
|
||
|
|
:name="item.column_name"
|
||
|
|
>
|
||
|
|
<resi-form
|
||
|
|
:ref="item.column_name"
|
||
|
|
:form-id="item.column_name"
|
||
|
|
:form-list="tabsForm"
|
||
|
|
/>
|
||
|
|
</el-tab-pane>
|
||
|
|
<!-- <el-tab-pane label="配置管理" name="second">
|
||
|
|
<resi-form :form-id="'second'" :form-list="tabsForm" />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane label="角色管理" name="third">
|
||
|
|
<resi-form :form-id="'third'" :form-list="tabsForm" />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane> -->
|
||
|
|
</el-tabs>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="resi-btns">
|
||
|
|
<el-button size="small">取消</el-button>
|
||
|
|
<el-button type="primary" size="small" @click="handleSUbmit"
|
||
|
|
>提交</el-button
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import resiSearch from '../../components/resiSearch.vue'
|
||
|
|
import resiForm from '../../components/resiForm.vue'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
resiSearch,
|
||
|
|
resiForm
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dialogVisible: false,
|
||
|
|
openSearch: false,
|
||
|
|
currentPage: 1,
|
||
|
|
activeName: 'edu',
|
||
|
|
tableData: [
|
||
|
|
{
|
||
|
|
date: '2016-05-02',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1518 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-04',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1517 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-01',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1519 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-03',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1516 弄'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
searchList: [
|
||
|
|
{
|
||
|
|
label: '所属网格',
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
require: true,
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'grid'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '小区名称',
|
||
|
|
require: true,
|
||
|
|
item_type: 'select',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'shequ'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '户籍查询',
|
||
|
|
require: true,
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'huji'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '本地户籍',
|
||
|
|
item_type: 'select',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'huji1'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '姓名',
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
column_name: 'username'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '手机号',
|
||
|
|
item_type: 'input',
|
||
|
|
valid_type: 'mobile',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'userMobile'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '身份证',
|
||
|
|
item_type: 'input',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: 'id_card',
|
||
|
|
column_name: 'idcard'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '出生日期',
|
||
|
|
item_type: 'date',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'birthday'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '联系人',
|
||
|
|
valid_type: null,
|
||
|
|
item_type: 'checkbox',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'contact'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '联系人手机',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'contactMobile'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
value: '',
|
||
|
|
formList: [
|
||
|
|
{
|
||
|
|
label: '所属网格',
|
||
|
|
item_type: 'select',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
require: true,
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'grid'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '所属楼宇',
|
||
|
|
require: true,
|
||
|
|
item_type: 'select',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'shequ'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '所属家庭',
|
||
|
|
require: true,
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'house'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '本地户籍',
|
||
|
|
item_type: 'select',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'huji'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '姓名',
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
column_name: 'username'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '性别',
|
||
|
|
item_type: 'select',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '男',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '女',
|
||
|
|
value: 2
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'sex'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '手机号',
|
||
|
|
item_type: 'input',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: 'mobile',
|
||
|
|
column_name: 'userMobile'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '身份证',
|
||
|
|
item_type: 'input',
|
||
|
|
valid_type: 'id_card',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'idcard'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '出生日期',
|
||
|
|
valid_type: null,
|
||
|
|
item_type: 'date',
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'birthday'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '联系人',
|
||
|
|
item_type: 'input',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'contactUser'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '联系人手机',
|
||
|
|
item_type: 'input',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'contactMobile'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '九小场所',
|
||
|
|
item_type: 'select',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'jiuxiao'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '备注',
|
||
|
|
item_type: 'textarea',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'remarks'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '党员：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'party'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '低保：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'dibao'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '保障房：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'baozf'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '失业：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'shiye'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '育龄妇女：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'yulingfunv'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '退役军人：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'tuiyijunren'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '统战人员：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'tzrenyuan'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '信访人员：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'xfreny'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '志愿者：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'zhiyuanzhe'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '高龄：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'gaoling'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '空巢：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'kongc'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '失独：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'shidu'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '失能：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'shineng'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '失智：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'shizhi'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '残疾：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'canji'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '大病：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'dabing'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '慢病：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'manbing'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '特殊：',
|
||
|
|
item_type: 'radio',
|
||
|
|
valid_type: null,
|
||
|
|
require: false,
|
||
|
|
option_source_type: '',
|
||
|
|
option_source_value: [
|
||
|
|
{
|
||
|
|
label: '是',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '否',
|
||
|
|
value: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
sort: '1',
|
||
|
|
column_name: 'teshu'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
tabsForm: [
|
||
|
|
{
|
||
|
|
label: '所属网格',
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
require: true,
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'grid'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '小区名称',
|
||
|
|
require: true,
|
||
|
|
item_type: 'select',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'shequ'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '户籍查询',
|
||
|
|
require: true,
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'huji'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '本地户籍',
|
||
|
|
item_type: 'select',
|
||
|
|
require: true,
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
column_name: 'huji1'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '姓名',
|
||
|
|
item_type: 'input',
|
||
|
|
option_source_type: '',
|
||
|
|
sort: '1',
|
||
|
|
valid_type: null,
|
||
|
|
require: true,
|
||
|
|
column_name: 'username'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
tabsList: [
|
||
|
|
{
|
||
|
|
label: '教育',
|
||
|
|
column_name: 'edu',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '兴趣爱好',
|
||
|
|
column_name: 'xingqu',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '宗教信仰',
|
||
|
|
column_name: 'zongjiao',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '健康信息',
|
||
|
|
column_name: 'jiank',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '工作信息',
|
||
|
|
column_name: 'job',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '经济状况',
|
||
|
|
column_name: 'jingji',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '家庭信息',
|
||
|
|
column_name: 'family',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '居住需求',
|
||
|
|
column_name: 'juzhu',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '教育发发发',
|
||
|
|
column_name: 'edu1',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '教育滚滚滚',
|
||
|
|
column_name: 'edu2',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '教育哈哈哈',
|
||
|
|
column_name: 'edu3',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '教育急急急',
|
||
|
|
column_name: 'edu4',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '教育快快快',
|
||
|
|
column_name: 'edu5',
|
||
|
|
children: []
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleSizeChange(val) {
|
||
|
|
console.log(`每页 ${val} 条`)
|
||
|
|
},
|
||
|
|
handleCurrentChange(val) {
|
||
|
|
console.log(`当前页: ${val}`)
|
||
|
|
},
|
||
|
|
handleClose() {
|
||
|
|
this.dialogVisible = false
|
||
|
|
},
|
||
|
|
handleSearch(val) {
|
||
|
|
console.log('searchhh--', val)
|
||
|
|
},
|
||
|
|
handleClick(tab, event) {
|
||
|
|
console.log(tab, event)
|
||
|
|
},
|
||
|
|
handleAdd() {
|
||
|
|
this.dialogVisible = true
|
||
|
|
},
|
||
|
|
handleSUbmit() {
|
||
|
|
console.log('baseform', this.$refs)
|
||
|
|
|
||
|
|
this.tabsList.forEach((item) => {
|
||
|
|
console.log('otherFOrm', this.$refs[item.column_name][0].form)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.tabs-other-info {
|
||
|
|
.el-tabs__item {
|
||
|
|
// width: 50px;
|
||
|
|
height: 20px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-right: 7px;
|
||
|
|
padding: 0 10px !important;
|
||
|
|
font-size: 8px;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #666666;
|
||
|
|
line-height: 20px;
|
||
|
|
background: #ebecf1;
|
||
|
|
border-radius: 2px;
|
||
|
|
}
|
||
|
|
.el-tabs__nav-wrap::after,
|
||
|
|
.el-tabs__active-bar {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.el-tabs__nav-next,
|
||
|
|
.el-tabs__nav-prev {
|
||
|
|
line-height: 20px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.resi-card-table {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
.resi-row-btn {
|
||
|
|
margin-bottom: 13px;
|
||
|
|
}
|
||
|
|
.resi-other {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
.resi-other-title {
|
||
|
|
width: 100px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
// padding: 6px 12px 0 0;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #333;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.tabs-other-info {
|
||
|
|
// padding-left: 60px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.resi-btns {
|
||
|
|
margin-top: 20px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.resi-container .resi-card {
|
||
|
|
position: relative;
|
||
|
|
overflow: visible;
|
||
|
|
}
|
||
|
|
.resi-down {
|
||
|
|
position: absolute;
|
||
|
|
left: 50%;
|
||
|
|
bottom: -10px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
width: 46px;
|
||
|
|
height: 12px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-left: -23rpx;
|
||
|
|
cursor: pointer;
|
||
|
|
background: #ffffff;
|
||
|
|
border-radius: 0 0 10px 10px;
|
||
|
|
img {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.resi-row-box {
|
||
|
|
height: 104px;
|
||
|
|
overflow: hidden;
|
||
|
|
transition: height 0.5s;
|
||
|
|
}
|
||
|
|
.resi-row-more {
|
||
|
|
height: max-content;
|
||
|
|
transition: height 0.5s;
|
||
|
|
}
|
||
|
|
.resi-row {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.resi-search {
|
||
|
|
.el-col {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.resi-cell {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
.resi-cell-label {
|
||
|
|
width: 70px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-right: 15px;
|
||
|
|
text-align: right;
|
||
|
|
// line-height: 32;
|
||
|
|
}
|
||
|
|
.resi-cell-value-radio {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
min-height: 32px;
|
||
|
|
}
|
||
|
|
.resi-cell-input {
|
||
|
|
width: 180px;
|
||
|
|
}
|
||
|
|
.resi-cell-select {
|
||
|
|
width: 180px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-right: 10px;
|
||
|
|
&-middle {
|
||
|
|
width: 130px;
|
||
|
|
}
|
||
|
|
&-small {
|
||
|
|
width: 88px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.resi-cell-select:last-child {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|