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

列表样式

dev2
jiangyy 3 years ago
parent
5b997d1a6f
commit
6191138f30
5 changed files with 316 additions and 297 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 46
      src/assets/scss/modules/management/list-main.scss
  2. 93
      src/views/modules/base/community/buildTable.vue
  3. 290
      src/views/modules/base/community/community.vue
  4. 122
      src/views/modules/base/community/communityTable.vue
  5. 62
      src/views/modules/base/community/roomTable.vue

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

@ -18,7 +18,7 @@
} }
.search_form{ .search_form{
} }
.div_search_btn{ .div_search_btn{
@ -57,9 +57,11 @@
} }
.div_table{ .div_table{
margin:15px 7px 7px; margin:16px 7px 7px;
// padding: 10px 20px; background: #FFFFFF;
box-shadow: 0px 6px 16px 0px rgba(0,0,0,0.08), 0px 3px 6px -4px rgba(0,0,0,0.12);
position: relative; position: relative;
padding:24px 16px 0;
.div_btn { .div_btn {
display: flex; display: flex;
@ -72,6 +74,7 @@
.btn_upload { .btn_upload {
margin-left: 10px; margin-left: 10px;
display: flex; display: flex;
text-align: center;
} }
} }
@ -83,7 +86,7 @@
} }
.div_table_item { .div_table_item {
margin-top: 10px; margin-top: 16px;
position: relative; position: relative;
} }
} }
@ -109,41 +112,6 @@
} }
} }
// .div_table {
// // background: #ffffff;
// // box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
// // border-radius: 4px;
// margin-top: 15px;
// // padding: 10px 20px;
// position: relative;
// .div_btn {
// margin-top: 10px;
// // margin-left: 10px;
// display: flex;
// .btn_upload {
// margin-left: 10px;
// display: flex;
// }
// }
// .table {
// margin-top: 20px;
// .img-voice{
// width:30px;
// height:30px;
// }
// }
// .div_notice {
// position: absolute;
// left: 15px;
// bottom: 0;
// }
// }
.div-mult-form { .div-mult-form {
margin-top: 20px; margin-top: 20px;

93
src/views/modules/base/community/buildTable.vue
View File

@ -4,53 +4,68 @@
<div class="div_btn"> <div class="div_btn">
<div class="div_btn_left"> <div class="div_btn_left">
<el-button style="" <el-button style=""
class="diy-button--purple" class="diy-button--blue"
icon="el-icon-plus"
size="small" size="small"
@click="handleAdd">新增楼栋</el-button> @click="handleAdd">新增楼栋</el-button>
<el-button style="margin-left:10px"
class="diy-button--green"
size="small"
@click="handleExport">导出</el-button>
<div class="btn_upload" <div class="btn_upload"
v-if="showImportBtn"> v-if="showImportBtn">
<el-upload :headers="$getElUploadHeaders()" <el-popover popper-class="btn-popper"
style="" placement="bottom"
ref="upload_building" width="20"
:multiple='false' trigger="hover">
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'building')})" <div class="table-more-btn">
action=""
accept=".xls,.xlsx" <el-upload :headers="$getElUploadHeaders()"
:http-request="(()=>{uploadFile( 'building')})"> style="text-align: center"
<el-button style="" ref="upload_building"
size="small" :multiple='false'
class="diy-button--yellow">导入楼栋数据</el-button> :show-file-list='false'
</el-upload> :before-upload="((file)=>{beforeUpload(file, 'building')})"
action=""
<el-upload :headers="$getElUploadHeaders()" accept=".xls,.xlsx"
style="" :http-request="(()=>{uploadFile( 'building')})">
ref="upload_room" <el-button style=""
:multiple='false' size="small"
:show-file-list='false' type="text"
:before-upload="((file)=>{beforeUpload(file, 'room')})" class="diy-button--other">导入楼栋数据</el-button>
action="" </el-upload>
accept=".xls,.xlsx" </div>
:http-request="(()=>{uploadFile( 'room')})">
<el-button style="margin-left:10px"
size="small"
class="diy-button--orange">导入房屋数据</el-button>
</el-upload>
<el-button style="margin-left:10px" <div class="table-more-btn">
class="diy-button--red" <el-upload :headers="$getElUploadHeaders()"
size="small" style="text-align: center"
@click="deleteBatch">批量删除</el-button> ref="upload_room"
:multiple='false'
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'room')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'room')})">
<el-button size="small"
type="text"
class="diy-button--other">导入房屋数据</el-button>
</el-upload>
</div> </div>
<el-button size="small"
style="float:right"
class="diy-button--white"
slot="reference">导入<i class="el-icon-arrow-down el-icon--right"></i></el-button>
</el-popover>
</div>
<el-button style="margin-left:10px"
class="diy-button--white"
size="small"
@click="handleExport">导出</el-button>
<el-button style="margin-left:10px"
class="diy-button--white"
size="small"
@click="deleteBatch">批量删除</el-button>
</div> </div>
<div class="div_btn_right"> <div class="div_btn_right">
@ -96,7 +111,7 @@
<el-button size="small" <el-button size="small"
style="float:right" style="float:right"
class="diy-button--white" class="diy-button--white"
slot="reference">更多操作<i class="el-icon-caret-bottom"></i></el-button> slot="reference">更多<i class="el-icon-arrow-down el-icon--right"></i></el-button>
</el-popover> </el-popover>
</div> </div>

290
src/views/modules/base/community/community.vue
View File

@ -37,150 +37,150 @@
<el-form :inline="true" <el-form :inline="true"
ref="ref_searchform" ref="ref_searchform"
:label-width="'100px'"> :label-width="'100px'">
<div class="search_form"> <!-- <div class="search_form"> -->
<el-form-item label="房主姓名" <el-form-item label="房主姓名"
prop="ownerName"> prop="ownerName">
<el-input v-model="ownerName" <el-input v-model="ownerName"
class="item_width_normal" class="item_width_normal"
size="small" size="small"
clearable clearable
placeholder="请输入内容"> placeholder="请输入内容">
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="联系方式" <el-form-item label="联系方式"
prop="ownerPhone"> prop="ownerPhone">
<el-input v-model="ownerPhone" <el-input v-model="ownerPhone"
class="item_width_normal" class="item_width_normal"
size="small" size="small"
clearable clearable
placeholder="请输入手机"> placeholder="请输入手机">
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="房屋状态" <el-form-item label="房屋状态"
prop="rentFlag"> prop="rentFlag">
<el-select class="item_width_normal" <el-select class="item_width_normal"
v-model="rentFlag" v-model="rentFlag"
placeholder="请选择" placeholder="请选择"
size="small" size="small"
clearable> clearable>
<el-option v-for="item in rentList" <el-option v-for="item in rentList"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="房屋用途" <el-form-item label="房屋用途"
prop="purpose"> prop="purpose">
<el-select v-model="purpose" <el-select v-model="purpose"
class="item_width_normal" class="item_width_normal"
placeholder="请选择" placeholder="请选择"
size="small" size="small"
clearable> clearable>
<el-option v-for="item in purposeArr" <el-option v-for="item in purposeArr"
:key="item.dictValue" :key="item.dictValue"
:label="item.dictName" :label="item.dictName"
:value="item.dictValue"> :value="item.dictValue">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="更新时间" <el-form-item label="更新时间"
prop="updateStartDate"> prop="updateStartDate">
<el-date-picker v-model="updateStartDate" <el-date-picker v-model="updateStartDate"
:picker-options="startPickerOptions" :picker-options="startPickerOptions"
class="item_width_daterange" class="item_width_daterange"
size="small" size="small"
type="date" type="date"
value-format="yyyyMMdd" value-format="yyyyMMdd"
value="yyyy-MM-dd" value="yyyy-MM-dd"
placeholder="开始时间"> placeholder="开始时间">
</el-date-picker> </el-date-picker>
<span class="data-tag">至</span> <span class="data-tag">至</span>
<el-date-picker v-model="updateEndDate" <el-date-picker v-model="updateEndDate"
:picker-options="endPickerOptions" :picker-options="endPickerOptions"
class="item_width_daterange data-tag" class="item_width_daterange data-tag"
size="small" size="small"
type="date" type="date"
value-format="yyyyMMdd" value-format="yyyyMMdd"
value="yyyy-MM-dd" value="yyyy-MM-dd"
placeholder="结束时间"> placeholder="结束时间">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="备注" <el-form-item label="备注"
prop="remark"> prop="remark">
<el-input v-model="remark" <el-input v-model="remark"
class="item_width_normal" class="item_width_normal"
size="small" size="small"
clearable clearable
placeholder="请输入备注"> placeholder="请输入备注">
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="所属房屋" <el-form-item label="所属房屋"
prop="neighborHoodId"> prop="neighborHoodId">
<el-select v-model.trim="neighborHoodId" <el-select v-model.trim="neighborHoodId"
:disabled="vDisabled" :disabled="vDisabled"
placeholder="小区" placeholder="小区"
size="small" size="small"
clearable clearable
class="item_width_communitycascader" class="item_width_communitycascader"
@change="handleChangeV"> @change="handleChangeV">
<el-option v-for="item in optionsV" <el-option v-for="item in optionsV"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
<el-select v-model.trim="buildingId" <el-select v-model.trim="buildingId"
placeholder="楼号" placeholder="楼号"
:disabled="!neighborHoodId || bDisabled" :disabled="!neighborHoodId || bDisabled"
size="small" size="small"
clearable clearable
class="item_width_buildcascader" class="item_width_buildcascader"
style="margin-left:5px" style="margin-left:5px"
@change="handleChangeB"> @change="handleChangeB">
<el-option v-for="item in optionsB" <el-option v-for="item in optionsB"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
<el-select v-model.trim="buildingUnitId" <el-select v-model.trim="buildingUnitId"
placeholder="单元" placeholder="单元"
size="small" size="small"
:disabled="!buildingId" :disabled="!buildingId"
clearable clearable
class="item_width_buildcascader" class="item_width_buildcascader"
style="margin-left:5px" style="margin-left:5px"
@change="handleChangeD"> @change="handleChangeD">
<el-option v-for="item in optionsD" <el-option v-for="item in optionsD"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
<el-select v-model.trim="houseId" <el-select v-model.trim="houseId"
placeholder="房号" placeholder="房号"
:disabled="!buildingUnitId" :disabled="!buildingUnitId"
size="small" size="small"
clearable clearable
class="item_width_buildcascader" class="item_width_buildcascader"
style="margin-left:5px"> style="margin-left:5px">
<el-option v-for="item in optionsH" <el-option v-for="item in optionsH"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</div> <!-- </div> -->
<div class="div_search_btn"> <div class="div_search_btn">
<el-button size="small" <el-button size="small"
class="diy-button--white" class="diy-button--white"
@ -200,7 +200,7 @@
</div> </div>
<div class="div_table"> <div class="">
<build-table v-if="selTreeObj.level==='neighborHood'&&!showRoomTable" <build-table v-if="selTreeObj.level==='neighborHood'&&!showRoomTable"
ref="ref_neighTable" ref="ref_neighTable"
:staffAgencyId="staffAgencyId" :staffAgencyId="staffAgencyId"

122
src/views/modules/base/community/communityTable.vue
View File

@ -6,60 +6,80 @@
<div class="div_btn_left"> <div class="div_btn_left">
<el-button style="" <el-button style=""
size="small" size="small"
class="diy-button--purple" class="diy-button--blue"
icon="el-icon-plus"
@click="handleAdd">新增小区</el-button> @click="handleAdd">新增小区</el-button>
<el-button style="margin-left:10px"
class="diy-button--green" <div class="btn_upload">
size="small"
@click="handleExportOpen">导出</el-button> <el-popover v-if="showImportBtn"
<div class="btn_upload" popper-class="btn-popper"
v-if="showImportBtn"> placement="bottom"
width="20"
<el-upload :headers="$getElUploadHeaders()" trigger="click">
ref="upload_community"
style="" <div class="table-more-btn">
:multiple='false' <el-upload :headers="$getElUploadHeaders()"
:show-file-list='false' ref="upload_community"
:before-upload="((file)=>{beforeUpload(file, 'community')})" style="text-align: center"
action="" :multiple='false'
accept=".xls,.xlsx" :show-file-list='false'
:http-request="(()=>{uploadFile( 'community')})"> :before-upload="((file)=>{beforeUpload(file, 'community')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'community')})">
<el-button size="small"
type="text"
class="diy-button--other">导入小区数据</el-button>
</el-upload>
</div>
<div class="table-more-btn">
<el-upload :headers="$getElUploadHeaders()"
style="text-align: center"
ref="upload_building"
:multiple='false'
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'building')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'building')})">
<el-button size="small"
type="text"
class="diy-button--other">导入楼栋数据</el-button>
</el-upload>
</div>
<div class="table-more-btn">
<el-upload :headers="$getElUploadHeaders()"
style="text-align: center"
ref="upload_room"
:multiple='false'
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'room')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'room')})">
<el-button size="small"
type="text"
class="diy-button--other">导入房屋数据</el-button>
</el-upload>
</div>
<el-button size="small" <el-button size="small"
class="diy-button--blue">导入小区数据</el-button> style="float:right"
</el-upload> class="diy-button--white"
slot="reference">导入<i class="el-icon-arrow-down el-icon--right"></i></el-button>
<el-upload :headers="$getElUploadHeaders()" </el-popover>
style=""
ref="upload_building"
:multiple='false'
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'building')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'building')})">
<el-button style="margin-left:10px"
size="small"
class="diy-button--yellow">导入楼栋数据</el-button>
</el-upload>
<el-upload :headers="$getElUploadHeaders()"
style=""
ref="upload_room"
:multiple='false'
:show-file-list='false'
:before-upload="((file)=>{beforeUpload(file, 'room')})"
action=""
accept=".xls,.xlsx"
:http-request="(()=>{uploadFile( 'room')})">
<el-button style="margin-left:10px"
size="small"
class="diy-button--orange">导入房屋数据</el-button>
</el-upload>
</div> </div>
<el-button style="margin-left:10px"
class="diy-button--white"
size="small"
@click="handleExportOpen">导出</el-button>
<el-button style="margin-left:10px" <el-button style="margin-left:10px"
class="diy-button--red" class="diy-button--white"
size="small" size="small"
@click="deleteBatch">批量删除</el-button> @click="deleteBatch">批量删除</el-button>
@ -74,7 +94,7 @@
placement="bottom" placement="bottom"
style="margin-left: 10px" style="margin-left: 10px"
width="20" width="20"
trigger="hover"> trigger="click">
<div v-if="showImportBtn" <div v-if="showImportBtn"
class="table-more-btn"> class="table-more-btn">
<el-button class="diy-button--other" <el-button class="diy-button--other"
@ -134,7 +154,7 @@
<el-button size="small" <el-button size="small"
style="float:right" style="float:right"
class="diy-button--white" class="diy-button--white"
slot="reference">更多操作<i class="el-icon-caret-bottom"></i></el-button> slot="reference">更多<i class="el-icon-arrow-down el-icon--right"></i></el-button>
</el-popover> </el-popover>
</div> </div>
</div> </div>
@ -145,7 +165,6 @@
border border
:height="tableHeight" :height="tableHeight"
v-loading="tableLoading" v-loading="tableLoading"
:header-cell-style="tableHeaderStyle"
style="width: 100%" style="width: 100%"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
@select-all="selectAll" @select-all="selectAll"
@ -309,7 +328,6 @@ export default {
pageSize: 20, pageSize: 20,
pageNo: 0, pageNo: 0,
tableLoading: true, tableLoading: true,
// tableHeaderStyle: { background: 'linear-gradient(0deg, #005EB3 0%, #0083F0 100%)', color: '#FFFFFF', padding: '6px' },
showImportBtn: false,//是否显示操作按钮，根据登录人所属组织判断 showImportBtn: false,//是否显示操作按钮，根据登录人所属组织判断
roleList: [],//角色列表 roleList: [],//角色列表

62
src/views/modules/base/community/roomTable.vue
View File

@ -4,37 +4,55 @@
<div class="div_btn_left"> <div class="div_btn_left">
<el-button v-if="agencyObj.level === 'building' || source !== 'search'" <el-button v-if="agencyObj.level === 'building' || source !== 'search'"
v-show="btnAuths.ic_house_add" v-show="btnAuths.ic_house_add"
class="diy-button--purple" class="diy-button--blue"
icon="el-icon-plus"
size="small" size="small"
@click="handleAdd">新增房屋</el-button> @click="handleAdd">新增房屋</el-button>
<el-button style="float: left; margin-left: 10px"
v-if="btnAuths.ic_house_export"
class="diy-button--green"
size="small"
@click="handleExport">导出</el-button>
<div class="btn_upload" <div class="btn_upload"
v-if="showImportBtn"> v-if="showImportBtn">
<el-upload ref="upload" <el-popover popper-class="btn-popper"
v-if="btnAuths.ic_house_import" placement="bottom"
:multiple="false" width="20"
:show-file-list="false" trigger="hover">
:before-upload="beforeUpload"
action="" <div class="table-more-btn">
accept=".xls,.xlsx"
:limit="1" <el-upload ref="upload"
:on-exceed="handleExceed" v-if="btnAuths.ic_house_import"
:http-request="uploadFile"> :multiple="false"
<el-button style="" style="text-align: center"
size="small" :show-file-list="false"
class="diy-button--orange">导入房屋数据</el-button> :before-upload="beforeUpload"
</el-upload> action=""
accept=".xls,.xlsx"
:limit="1"
:on-exceed="handleExceed"
:http-request="uploadFile">
<el-button style=""
size="small"
type="text"
class="diy-button--other">导入房屋数据</el-button>
</el-upload>
</div>
<el-button size="small"
style="float:right"
class="diy-button--white"
slot="reference">导入<i class="el-icon-arrow-down el-icon--right"></i></el-button>
</el-popover>
</div> </div>
<el-button style="float: left; margin-left: 10px"
v-if="btnAuths.ic_house_export"
class="diy-button--white"
size="small"
@click="handleExport">导出</el-button>
<el-button style="float: left; margin-left: 10px" <el-button style="float: left; margin-left: 10px"
v-if="btnAuths.ic_house_batch_del" v-if="btnAuths.ic_house_batch_del"
class="diy-button--red" class="diy-button--white"
size="small" size="small"
@click="deleteBatch">批量删除</el-button> @click="deleteBatch">批量删除</el-button>
@ -78,7 +96,7 @@
<el-button size="small" <el-button size="small"
style="float:right" style="float:right"
class="diy-button--white" class="diy-button--white"
slot="reference">更多操作<i class="el-icon-caret-bottom"></i></el-button> slot="reference">更多<i class="el-icon-arrow-down el-icon--right"></i></el-button>
</el-popover> </el-popover>
</div> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save