elink-star
/
epmet-oper-gov
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

居民信息对齐调整

dev2
jiangyy 3 years ago
parent
aa860a0c4d
commit
9b6cd2da28
3 changed files with 181 additions and 171 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/assets/scss/modules/management/list-main.scss
  2. 10
      src/views/components/rangeInput.vue
  3. 336
      src/views/components/resiSearch.vue

6
src/assets/scss/modules/management/list-main.scss
View File

@ -44,10 +44,14 @@
.item_width_normal{
width: 168px;
}
//查询栏---日期、时间范围的宽度
//查询栏---分开的日期、时间范围的宽度
.item_width_daterange{
width: 206px;
}
//查询栏---合并的日期、时间范围的宽度
.item_width_daterange2{
width: 455px;
}
//查询栏---小区、楼、单元、楼号，级联长度
.item_width_communitycascader{
width: 141px;

10
src/views/components/rangeInput.vue
View File

@ -106,9 +106,9 @@ export default {
max-width: 200px;
height: 37px;
}
// .wd50 {
// // width: 45%;
// }
.wd50 {
width: 79px;
}
.demo-form-inline {
::v-deep {
.el-form-item {
@ -127,8 +127,8 @@ export default {
}
.div_middle {
padding: 0 10px;
padding: 0 3px;
position: relative;
bottom: 10px;
bottom: 10px;
}
</style>

336
src/views/components/resiSearch.vue
View File

@ -3,170 +3,170 @@
<!-- <el-card class="resi-card"> -->
<div>
<el-form :inline="true" :label-width="'100px'" class="header_form_box" v-for="(item, index) in sliceList(itemList, 4)" :class="boxHeight?'setFormBoxHeightAuto':'setFormBoxHeight'"
:key="index">
<el-form-item v-for="n in item"
:key="n.id"
:span="computdSpan(item.length)"
class="margin0"
>
<div class="resi-cell">
<div class="resi-cell-label"
:class="item.length != 4 && 'resi-cell-label1'">{{ n.label }}:</div>
<div class="resi-cell-value"
:class="n.itemType === 'radio' && 'resi-cell-value-radio'">
<el-input v-if="n.itemType === 'input' || n.itemType === 'textarea'"
v-model.trim="form[n.columnName]"
class="resi-cell-input"
size="small"
clearable
placeholder="请输入内容">
</el-input>
<template v-else-if="n.itemType == 'inputRange'">
<!-- <el-input
<el-form :inline="true"
:label-width="'110px'"
class="header_form_box"
v-for="(item, index) in sliceList(itemList, 4)"
:class="boxHeight?'setFormBoxHeightAuto':'setFormBoxHeight'"
:key="index">
<el-form-item v-for="n in item"
:key="n.id"
:span="computdSpan(item.length)"
:label="n.label"
class="margin0">
<el-input v-if="n.itemType === 'input' || n.itemType === 'textarea'"
v-model.trim="form[n.columnName]"
class="item_width_normal"
size="small"
clearable
placeholder="请输入内容">
</el-input>
<template v-else-if="n.itemType == 'inputRange'">
<!-- <el-input
v-model.trim="form[n.columnName]"
class="resi-cell-input"
size="small"
clearable
placeholder="请输入内容"
/> -->
<inputRange v-model="form[n.columnName]"
:type="n.validType"
@change="handleAgeChange" />
</template>
<template v-else-if="n.itemType === 'datepicker'">
<el-date-picker v-if="n.queryType === 'daterange'"
v-model.trim="form[n.columnName]"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
class="resi-cell--daterange"
size="small"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd">
</el-date-picker>
<el-date-picker v-else
v-model.trim="form[n.columnName]"
class="resi-cell-input"
type="date"
size="small"
clearable
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</template>
<el-select v-else-if="n.itemType === 'select' || n.itemType === 'radio'"
v-model.trim="form[n.columnName]"
placeholder="请选择"
size="small"
clearable
class="resi-cell-select"
:collapse-tags="n.multiSelect == 1 ? true : false"
:multiple="n.multiSelect == 1 ? true : false">
<el-option v-for="item in n.options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-cascader v-else-if="n.itemType === 'cascader'"
v-model.trim="form[n.columnName]"
:options="n.options"
:props="{ checkStrictly: true }"
clearable
size="small"
class="resi-cell-select">
</el-cascader>
<template v-else-if="n.itemType === 'checkbox'">
<el-checkbox-group v-model="form[n.columnName]">
<el-checkbox v-for="ns in n.options"
:key="ns.value"
:label="ns.value">{{ns.label}}</el-checkbox>
</el-checkbox-group>
</template>
</div>
</div>
<inputRange v-model="form[n.columnName]"
:type="n.validType"
@change="handleAgeChange" />
</template>
<template v-else-if="n.itemType === 'datepicker'">
<el-date-picker v-if="n.queryType === 'daterange'"
v-model.trim="form[n.columnName]"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
class="item_width_daterange2"
size="small"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd">
</el-date-picker>
<el-date-picker v-else
v-model.trim="form[n.columnName]"
class="item_width_normal"
type="date"
size="small"
clearable
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</template>
<el-select v-else-if="n.itemType === 'select' || n.itemType === 'radio'"
v-model.trim="form[n.columnName]"
placeholder="请选择"
size="small"
clearable
class="item_width_normal"
:collapse-tags="n.multiSelect == 1 ? true : false"
:multiple="n.multiSelect == 1 ? true : false">
<el-option v-for="item in n.options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-cascader v-else-if="n.itemType === 'cascader'"
v-model.trim="form[n.columnName]"
:options="n.options"
:props="{ checkStrictly: true }"
clearable
size="small"
class="resi-cell-select">
</el-cascader>
<template v-else-if="n.itemType === 'checkbox'">
<el-checkbox-group v-model="form[n.columnName]">
<el-checkbox v-for="ns in n.options"
:key="ns.value"
:label="ns.value">{{ns.label}}</el-checkbox>
</el-checkbox-group>
</template>
</el-form-item>
<el-form-item label="所属组织" prop="agencyIdArray">
<el-cascader class="item_width_normal"
ref="myCascader"
v-model="agencyIdArray"
:options="orgOptions"
:props="orgOptionProps"
:show-all-levels="false"
@change="handleChangeAgency"></el-cascader>
<el-form-item label="所属组织"
prop="agencyIdArray">
<el-cascader class="item_width_normal"
ref="myCascader"
size="small"
v-model="agencyIdArray"
:options="orgOptions"
:props="orgOptionProps"
:show-all-levels="false"
@change="handleChangeAgency"></el-cascader>
</el-form-item>
<el-form-item label="所属房屋" prop="VILLAGE_ID">
<div class="resi-cell">
<div class="resi-cell-value">
<el-select v-model.trim="form.VILLAGE_ID"
placeholder="请选择小区"
size="small"
filterable
clearable
class="resi-cell-select"
@clear="handleClearVillage"
@change="handleChangeV">
<el-option v-for="item in optionsV"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.BUILD_ID"
placeholder="楼号"
size="small"
filterable
clearable
style="width: 120px;"
class="resi-cell-select"
:disabled="changeVDisabled"
@clear="handleClearBuild"
@change="handleChangeB">
<el-option v-for="item in optionsB"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.UNIT_ID"
:disabled="changeBDisabled"
placeholder="单元"
size="small"
filterable
clearable
style="width: 120px;"
class="resi-cell-select"
@click="handleClearDan"
@change="handleChangeD">
<el-option v-for="item in optionsD"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.HOME_ID"
:disabled="changeDDisabled"
placeholder="房号"
size="small"
filterable
clearable
style="width: 120px;"
class="resi-cell-select">
<el-option v-for="item in optionsH"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</div>
<el-form-item label="所属房屋"
prop="VILLAGE_ID">
<el-select v-model.trim="form.VILLAGE_ID"
placeholder="请选择小区"
size="small"
filterable
clearable
class="item_width_communitycascader"
@clear="handleClearVillage"
@change="handleChangeV">
<el-option v-for="item in optionsV"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.BUILD_ID"
placeholder="楼号"
size="small"
filterable
clearable
style="margin-left:5px"
class="item_width_buildcascader"
:disabled="changeVDisabled"
@clear="handleClearBuild"
@change="handleChangeB">
<el-option v-for="item in optionsB"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.UNIT_ID"
:disabled="changeBDisabled"
placeholder="单元"
size="small"
filterable
clearable
style="margin-left:5px"
class="item_width_buildcascader"
@click="handleClearDan"
@change="handleChangeD">
<el-option v-for="item in optionsD"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model.trim="form.HOME_ID"
:disabled="changeDDisabled"
placeholder="房号"
size="small"
filterable
clearable
style="margin-left:5px"
class="item_width_buildcascader">
<el-option v-for="item in optionsH"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
</div>
@ -191,19 +191,25 @@
class="resi-search">
<el-col :span="24">
<el-button type="primary"
size="small"
@click="handleSearch" plain>查询 </el-button>
<el-button size="small"
class="diy-button--blue"
@click="handleSmartSearch">智能查询</el-button>
<el-button style="margin-left:10px"
size="small"
type="primary"
plain
class="diy-button--white"
@click="resetForm">重置</el-button>
<el-button type="primary"
<el-button class="diy-button--blue"
size="small"
plain
@click="handleSmartSearch">智能查询</el-button>
<span class="font_color_blue" style="cursor:pointer;" @click="boxHeight = !boxHeight">{{boxHeight?'收起':'展开'}} <i :class="boxHeight?'el-icon-arrow-up':'el-icon-arrow-down'"></i></span>
@click="handleSearch">查询 </el-button>
<el-button style="margin-left:15px"
size="small"
class="div-table-button--blue"
type="text"
@click="boxHeight = !boxHeight">{{boxHeight?'收起':'展开'}}<i class="el-icon-arrow-down el-icon--right"></i></el-button>
<!-- <span class="font_color_blue"
style="cursor:pointer;"
@click="boxHeight = !boxHeight">{{boxHeight?'收起':'展开'}} <i :class="boxHeight?'el-icon-arrow-up':'el-icon-arrow-down'"></i></span> -->
</el-col>
</el-row>
@ -288,7 +294,7 @@ export default {
}
return {
boxHeight:false,
boxHeight: false,
pageLoading: false,
openSearch: false,
optionsV: [],
@ -814,7 +820,7 @@ export default {
<style lang="scss" scope>
@import "@/assets/scss/modules/management/list-main.scss";
@import "@/assets/scss/modules/visual/communityManage.scss";
.header_form_box{
.header_form_box {
display: flex;
flex-wrap: wrap;
}

Write Preview
Loading…
Cancel
Save