15 changed files with 880 additions and 37 deletions
|
After Width: | Height: | Size: 905 B |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 754 B |
|
After Width: | Height: | Size: 797 B |
|
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,28 @@ |
|||
<template> |
|||
<div class=''> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return {}; |
|||
}, |
|||
//创建前 |
|||
created() { }, |
|||
//方法 |
|||
methods: {}, |
|||
//子组件注册 |
|||
components: {}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,28 @@ |
|||
<template> |
|||
<div class=''> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return {}; |
|||
}, |
|||
//创建前 |
|||
created() { }, |
|||
//方法 |
|||
methods: {}, |
|||
//子组件注册 |
|||
components: {}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,28 @@ |
|||
<template> |
|||
<div class=''> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return {}; |
|||
}, |
|||
//创建前 |
|||
created() { }, |
|||
//方法 |
|||
methods: {}, |
|||
//子组件注册 |
|||
components: {}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,713 @@ |
|||
<template> |
|||
<div class="homeWrap"> |
|||
|
|||
<div class="top-nav-list" v-if="$route.query.typeB == 'building'"> |
|||
<div v-for="item in buildingList" :key="item.id" :class="[item.ifActive ? 'top-nav-itemAC' : 'top-nav-item']" |
|||
@click="chooseNav(item)"> |
|||
{{ item.buildingName }}{{ item.unitName }} |
|||
</div> |
|||
</div> |
|||
<el-row :gutter="48" style="background-color: #fff;height: calc(100vh - 129px);"> |
|||
<el-col :span="8"> |
|||
<!-- <div class="mount"> |
|||
<people-mount /> |
|||
</div> --> |
|||
<div class="apartment"> |
|||
<div class="apar_comtent" v-if="houseMountArr.length > 0"> |
|||
<div class="apar_top"> |
|||
<img src="@/assets/images/home/homeTop.png" alt="/" /> |
|||
</div> |
|||
<div style="min-width: 284px; max-width: 488px; padding: 0 20px"> |
|||
<div class="apar_center"> |
|||
<div class="apar_center_flex" :style="{ width: flexWidth + 'px' }"> |
|||
<div v-for="(item, index) in houseMountArr" :key="index" class="floor"> |
|||
<div v-for="itm in item" :key="itm.id" :class="[ |
|||
itm.riskyNum === 0 && itm.importanceNum === 0 |
|||
? 'households' |
|||
: '', |
|||
itm.riskyNum > 0 ? 'dangerHome' : '', |
|||
itm.importanceNum > 0 ? 'dangerPeople' : '', |
|||
itm.rentFlag === '2' ? 'freeHome' : '', |
|||
]"> |
|||
<div v-if="itm.riskyNum === 0 && |
|||
itm.importanceNum === 0 && |
|||
itm.rentFlag != '2' |
|||
"> |
|||
{{ itm.doorName }} |
|||
</div> |
|||
<div v-if="itm.riskyNum > 0" class="dangerClass"> |
|||
<div>{{ itm.doorName }}</div> |
|||
<img :src="require('@/assets/images/home/dangerHomeS.png')" alt="" |
|||
width="16px" /> |
|||
</div> |
|||
<div v-if="itm.importanceNum > 0" class="dangerClass"> |
|||
<div>{{ itm.doorName }}</div> |
|||
<img :src="require('@/assets/images/home/dangerPeopleS.png') |
|||
" alt="" width="16px" /> |
|||
</div> |
|||
<div v-if="itm.rentFlag === '2'" class="dangerClass"> |
|||
<div>闲置</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="apar_bottom"> |
|||
<img src="@/assets/images/home/homeBottomS.png" alt="/" /> |
|||
</div> |
|||
</div> |
|||
<div v-else class="apar_comtent"> |
|||
<div class="apar_top"> |
|||
<img src="@/assets/images/home/homeTop.png" alt="/" /> |
|||
</div> |
|||
<div style="min-width: 284px; max-width: 488px; padding: 0 20px"> |
|||
<div class="apar_center"> |
|||
<div class="apar_center_flex" style="width: 50px"> |
|||
<div v-for="(item, index) in freeHomeArr" :key="index" class="floor"> |
|||
<div v-for="(itm, i) in item" :key="i" class="freeHome"></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="apar_bottom"> |
|||
<img src="@/assets/images/home/homeBottom.png" alt="/" /> |
|||
</div> |
|||
</div> |
|||
<!-- <div class="apar_right"> |
|||
<img src="@/assets/images/home/homeRight.png" alt="" /> |
|||
</div> --> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="16"> |
|||
<div class="table"> |
|||
<el-table :data="list" :height="tableHeight" v-loading="loading"> |
|||
<el-table-column label="序号" type="index" width="60" /> |
|||
<el-table-column prop="doorName" width="100" label="门牌号" /> |
|||
<el-table-column prop="quartersName" show-overflow-tooltip label="所属小区"> |
|||
<template slot-scope="scope"> |
|||
<div> |
|||
<el-tooltip class="item" effect="dark" :content="scope.row.quartersName" |
|||
placement="top-start"> |
|||
<span>{{ scope.row.quartersName }}</span> |
|||
</el-tooltip> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="buildingName" width="100" show-overflow-tooltip label="所属楼栋" /> |
|||
<el-table-column prop="buildingUnitName" width="100" show-overflow-tooltip label="所属单元" /> |
|||
<el-table-column prop="houseCode" width="100" label="房屋编码"> |
|||
<template slot-scope="scope"> |
|||
<div> |
|||
<el-tooltip class="item" effect="dark" :content="scope.row.houseCode" placement="top"> |
|||
<div class="suolue">{{ scope.row.houseCode }}</div> |
|||
</el-tooltip> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="rentFlag" width="90" label="房屋状态"> |
|||
<template slot-scope="scope"> |
|||
<!-- 1：出租 0：自住 2：闲置 3：未售出 --> |
|||
<span>{{ getRentFlag(scope.row.rentFlag) }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<!-- <el-table-column prop="houseType" width="120" label="房屋类型"> |
|||
<template slot-scope="scope"> --> |
|||
<!-- 1楼房，2平房，3别墅 --> |
|||
<!-- <span>{{ getHouseType(scope.row.houseType) }}</span> |
|||
</template> |
|||
</el-table-column> --> |
|||
<el-table-column prop="ownerName" width="100" label="房主姓名" /> |
|||
<el-table-column prop="ownerPhone" width="110" show-overflow-tooltip label="房主电话"> |
|||
<template slot-scope="scope"> |
|||
{{ $sensitive(scope.row.ownerPhone, 3, 7) }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="riskyNum" width="150" label="满意度风险家庭"> |
|||
<template slot="header"> |
|||
满意度风险家庭 |
|||
</template> |
|||
<template slot-scope="scope"> |
|||
<span v-if="+scope.row.riskyNum > 0">是</span> |
|||
<span v-else>否</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="categorys" width="120" label="重点人员"> |
|||
<template slot="header"> |
|||
重点人员 |
|||
</template> |
|||
<template slot-scope="scope"> |
|||
<div v-if="scope.row.categorys && scope.row.categorys.length > 0" |
|||
style="display: flex; align-items: center; margin-bottom: 5px"> |
|||
<div v-for="item in scope.row.categorys.slice(0, 5)" :key="item"> |
|||
<img :src="require(`@/assets/images/home/${getHomeTypesMap( |
|||
item |
|||
)}.png`) |
|||
" alt="" style="width: 20px; height: 20px; margin-right: 5px" /> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="操作" width="80" align="center"> |
|||
<template slot-scope="{ row }"> |
|||
<el-button type="text" @click=" |
|||
$router.push( |
|||
`/dataBoard/overview/familyPortrait/?name=${row.doorName}&houseId=${row.id}&id=${row.buildingId}&buId=${row.buildingUnitId}&type=${$route.query.typeB}&name2=${row.houseName}` |
|||
) |
|||
">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
</div> |
|||
<div class="pagination"> |
|||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" |
|||
:current-page.sync="queryParams.pageNo" :page-size="queryParams.pageSize" layout="total,->,prev, pager, next, jumper" |
|||
:total="total"> |
|||
</el-pagination> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from "vuex"; |
|||
export default { |
|||
name: "homeDetails", |
|||
components: { |
|||
}, |
|||
data() { |
|||
return { |
|||
total: 0, |
|||
queryParams: { |
|||
pageNo: 1, |
|||
pageSize: 20, |
|||
unitId: "", |
|||
ownerName: "", |
|||
ownerPhone: "", |
|||
ownerIdCard: "", |
|||
riskyFlag: "", |
|||
residentTag: "", |
|||
}, |
|||
orgOptions: [], |
|||
peopleTypeList: [], |
|||
riskHomeList: [ |
|||
{ |
|||
label: "风险", |
|||
value: "1", |
|||
}, |
|||
{ |
|||
label: "无风险", |
|||
value: "0", |
|||
}, |
|||
], |
|||
flexWidth: 0, |
|||
loading: false, |
|||
homeMsg: {}, |
|||
list: [], |
|||
homeText: "", |
|||
buildingList: [], |
|||
houseMountArr: [ |
|||
[ |
|||
// { doorName: 101, riskyNum: 0, importanceNum: 0, rentFlag: "0" }, |
|||
// { doorName: 102, riskyNum: 1, importanceNum: 0, rentFlag: "0" }, |
|||
// { doorName: 103, riskyNum: 0, importanceNum: 1, rentFlag: "0" }, |
|||
// { doorName: 104, riskyNum: 0, importanceNum: 0, rentFlag: "0" }, |
|||
// { doorName: 105, riskyNum: 0, importanceNum: 0, rentFlag: "0" }, |
|||
// { doorName: 205, riskyNum: 0, importanceNum: 0, rentFlag: "0" }, |
|||
], |
|||
], |
|||
freeHomeArr: [], |
|||
buildingId: "", |
|||
level: '' |
|||
}; |
|||
}, |
|||
watch: {}, |
|||
created() { |
|||
this.buildingId = this.$store.state.huaXiang.buildingInfo.buildingId || null; |
|||
this.queryParams.unitId = this.$store.state.huaXiang.buildingInfo.buildingUnitId || null; |
|||
this.level = this.$store.state.huaXiang.buildingInfo.level || null; |
|||
}, |
|||
mounted() { |
|||
|
|||
this.getList(this.buildingId); |
|||
this.getPeopleTypeList(); |
|||
}, |
|||
methods: { |
|||
handleSizeChange(val) { |
|||
this.queryParams.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
handleCurrentChange(val) { |
|||
this.queryParams.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
getDoorNameList(list) { |
|||
const doorNameList = []; |
|||
const doorNameArr = []; |
|||
list.forEach((item) => { |
|||
const doorName = item.doorName; |
|||
if (doorName.length === 4) { |
|||
doorNameArr.push(doorName.slice(0, 2)); |
|||
} else if (doorName.length === 3) { |
|||
doorNameArr.push(doorName.slice(0, 1)); |
|||
} |
|||
}); |
|||
const doorNameSet = new Set(doorNameArr); |
|||
doorNameSet.forEach((item) => { |
|||
const arr = []; |
|||
list.forEach((item2) => { |
|||
const doorName = item2.doorName; |
|||
if (doorName.length === 4) { |
|||
if (doorName.slice(0, 2) === item) { |
|||
arr.push(item2); |
|||
} |
|||
} else if (doorName.length === 3) { |
|||
if (doorName.slice(0, 1) === item) { |
|||
arr.push(item2); |
|||
} |
|||
} |
|||
}); |
|||
doorNameList.push(arr); |
|||
}); |
|||
return doorNameList; |
|||
}, |
|||
|
|||
getPeopleTypeList() { |
|||
this.$http |
|||
.post("sys/dict/data/dictlist", { |
|||
dictType: "resident_category", |
|||
}) |
|||
.then((res) => { |
|||
const { code, data } = res.data; |
|||
if (code === 0) { |
|||
this.peopleTypeList = data; |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
getUnitList(id) { |
|||
this.$http |
|||
.get(`/actual/base/streetOverview/getUnitHouseList?unitId=` + id) |
|||
.then((res) => { |
|||
const { |
|||
code, |
|||
data: { houseList, unitInfo }, |
|||
} = res.data; |
|||
if (code === 0) { |
|||
let unitInfos = unitInfo || {}; |
|||
const freeHomeArr = new Array(unitInfos.totalFloorNum).fill([ |
|||
{}, |
|||
{}, |
|||
{}, |
|||
]); |
|||
this.freeHomeArr = freeHomeArr; |
|||
this.homeMsg = unitInfos; |
|||
this.homeText = |
|||
(unitInfos.quartersName ? unitInfos.quartersName : "") + |
|||
(unitInfos.buildingName ? unitInfos.buildingName : "") + |
|||
(unitInfos.unitNum ? unitInfos.unitNum + "单元" : ""); |
|||
this.houseMountArr = this.getDoorNameList(houseList); |
|||
console.log(this.houseMountArr); |
|||
if (this.houseMountArr.length > 0) { |
|||
this.flexWidth = this.houseMountArr[0].length * 58; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
getTableData(id) { |
|||
// const idx = "812295ba44c594fc85a808f67b7a8aa4"; |
|||
this.loading = true; |
|||
this.$http |
|||
.get( |
|||
"/actual/base/streetOverview/getUnitHouseOverviewList?" + |
|||
this.$paramsFormat(this.queryParams) |
|||
) |
|||
.then((res) => { |
|||
const { |
|||
code, |
|||
data: { list, total }, |
|||
} = res.data; |
|||
if (code === 0) { |
|||
this.list = list; |
|||
this.total = total; |
|||
this.loading = false; |
|||
} else { |
|||
this.loading = false; |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
|
|||
|
|||
getList(buid) { |
|||
// const homeType = this.$route.query.typeB; |
|||
console.log(this.level); |
|||
if (this.level == "building") { |
|||
// 1514914015259979777 |
|||
this.$http |
|||
.get( |
|||
`/actual/base/streetOverview/getUnitListByBuilding?buildingId=` + |
|||
this.buildingId |
|||
) |
|||
.then((res) => { |
|||
const { code, data } = res.data; |
|||
if (code === 0) { |
|||
this.buildingList = data; |
|||
this.homeText = |
|||
this.buildingList[0].buildingName + |
|||
this.buildingList[0].unitName; |
|||
if (this.buildingList && this.buildingList.length > 0) { |
|||
if (buid) { |
|||
this.buildingList.forEach((item, i) => { |
|||
if (item.id === buid) { |
|||
item.ifActive = true; |
|||
this.getUnitList(item.id); |
|||
this.getTableData(item.id); |
|||
} else { |
|||
item.ifActive = false; |
|||
} |
|||
}); |
|||
} else { |
|||
this.buildingList.forEach((item, i) => { |
|||
if (i === 0) { |
|||
item.ifActive = true; |
|||
this.getUnitList(item.id); |
|||
this.getTableData(item.id); |
|||
} else { |
|||
item.ifActive = false; |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
this.loading = false; |
|||
} else { |
|||
this.loading = false; |
|||
} |
|||
}); |
|||
} else { |
|||
this.getUnitList(this.queryParams.unitId); |
|||
this.getTableData(this.queryParams.unitId); |
|||
} |
|||
}, |
|||
|
|||
getRentFlag(type) { |
|||
const rentFlag = new Map([ |
|||
["0", "出租"], |
|||
["1", "自住"], |
|||
["2", "闲置"], |
|||
["3", "未售出"], |
|||
]); |
|||
return rentFlag.get(type); |
|||
}, |
|||
|
|||
getHouseType(type) { |
|||
const houseTypeMap = new Map([ |
|||
["1", "楼房"], |
|||
["2", "平房"], |
|||
["3", "别墅"], |
|||
]); |
|||
return houseTypeMap.get(type); |
|||
}, |
|||
|
|||
getHomeTypesMap(item) { |
|||
const homeTypeMap = new Map([ |
|||
["PARTY_FLAG", "dy"], |
|||
["SUBSISTENCE_ALLOWANCE_FLAG", "dbry"], |
|||
["ENSURE_HOUSE_FLAG", "bzfry"], |
|||
["UNEMPLOYED_FLAG", "syry"], |
|||
["FERTILE_WOMAN_FLAG", "ylfn"], |
|||
["VETERAN_FLAG", "tyjr"], |
|||
["UNITED_FRONT_FLAG", "tzry"], |
|||
["PETITION_OFFICER_FLAG", "xfry"], |
|||
["VOLUNTEER_FLAG", "zyz"], |
|||
["oldPeopleFlag", "lnr"], |
|||
["EMPTY_NESTER_FLAG", "kclr"], |
|||
["SPECIAL_SUPPORT_FLAG", "tfry"], |
|||
["DISABLED_FLAG", "snry"], |
|||
["DEMENTED_FLAG", "szry"], |
|||
["DISABILITY_FLAG", "cjr"], |
|||
["SERIOUS_ILLNESS_FLAG", "dbry"], |
|||
["CHRONIC_DISEASE_FLAG", "mxbry"], |
|||
["SPECIAL_CROWD_FLAG", "tsry"], |
|||
["TENANT_FLAG", "zh"], |
|||
["FLOATING_FLAG", "ldry"], |
|||
["LIVE_ALONE_FLAG", "kclr"], |
|||
["PUBLIC_WELFARE_FLAG", "gyg"], |
|||
]); |
|||
console.log(item); |
|||
console.log(homeTypeMap.get(item)); |
|||
return homeTypeMap.get(item); |
|||
}, |
|||
|
|||
chooseNav(item) { |
|||
let buildList = [...this.buildingList]; |
|||
this.homeText = item.buildingName + item.unitName; |
|||
buildList.forEach((d) => { |
|||
if (item.id === d.id) { |
|||
d.ifActive = true; |
|||
this.getUnitList(item.id); |
|||
this.getTableData(item.id); |
|||
} else { |
|||
d.ifActive = false; |
|||
} |
|||
}); |
|||
this.buildingList = buildList; |
|||
}, |
|||
}, |
|||
computed: { |
|||
tableHeight() { |
|||
return this.clientHeight - 60 - 80 - 80 ; |
|||
}, |
|||
...mapGetters(["clientHeight", "env"]), |
|||
}, |
|||
|
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.table{ |
|||
margin-top: 16px; |
|||
} |
|||
@mixin radio { |
|||
display: inline-block; |
|||
width: 90px; |
|||
height: 24px; |
|||
opacity: 0.8; |
|||
border-radius: 11px; |
|||
text-align: center; |
|||
line-height: 22px; |
|||
margin-left: 15px; |
|||
font-size: 14px; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
@mixin navListCommon { |
|||
min-width: 120px; |
|||
height: 36px; |
|||
font-size: 14px; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
margin-right: 4px; |
|||
text-align: center; |
|||
line-height: 36px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
@mixin homeCommon { |
|||
height: 58px; |
|||
background-size: 100% 100%; |
|||
display: flex; |
|||
flex: 0 0 48px; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 14px; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #fff; |
|||
|
|||
&:not(:last-child) { |
|||
margin-right: 20px; |
|||
} |
|||
} |
|||
|
|||
.suolue { |
|||
width: 80px; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
} |
|||
::v-deep .pagination{ |
|||
width: 100%; |
|||
.el-pagination{ |
|||
display: flex; |
|||
width: 100%; |
|||
position: relative; |
|||
.el-pagination__rightwrapper{ |
|||
position: absolute; |
|||
right: 20px; |
|||
} |
|||
} |
|||
} |
|||
.top-nav-list { |
|||
display: flex; |
|||
margin-bottom: 16px; |
|||
|
|||
.top-nav-item { |
|||
@include navListCommon; |
|||
background-image: url("~@/assets/images/home/noChooseMain.png"); |
|||
color: #96b1ce; |
|||
} |
|||
|
|||
.top-nav-itemAC { |
|||
@include navListCommon; |
|||
background-image: url("~@/assets/images/home/chooseMain.png"); |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.homeWrap { |
|||
.bread { |
|||
margin-bottom: 16px; |
|||
} |
|||
|
|||
.apar_top { |
|||
width: 100%; |
|||
|
|||
img { |
|||
width: 100%; |
|||
} |
|||
} |
|||
|
|||
.apartment { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: center; |
|||
margin-top: 60px; |
|||
|
|||
.apar_comtent { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
|
|||
.apar_center { |
|||
min-width: 288px; |
|||
max-width: 500px; |
|||
overflow: auto; |
|||
background: #f3f5fb; |
|||
padding: 30px 30px 10px 30px; |
|||
display: flex; |
|||
// align-items: flex-end; |
|||
flex-direction: column-reverse; |
|||
height: calc(100vh - 376px); |
|||
.apar_center_flex { |
|||
// width: 100%; |
|||
display: flex; |
|||
flex-wrap: wrap-reverse; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.floor { |
|||
width: 100%; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
margin-bottom: 20px; |
|||
|
|||
.households { |
|||
@include homeCommon; |
|||
background: url("@/assets/images/home/hasPeopleS.png") no-repeat; |
|||
} |
|||
|
|||
.dangerHome, |
|||
.dangerPeople { |
|||
@include homeCommon; |
|||
background: url("@/assets/images/home/dangerHomeBgS.png") no-repeat; |
|||
} |
|||
|
|||
.freeHome { |
|||
@include homeCommon; |
|||
background: url("@/assets/images/home/freeHomeS.png") no-repeat; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.dangerClass { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
|
|||
div:first-child { |
|||
margin-bottom: 5px; |
|||
font-weight: bold; |
|||
} |
|||
} |
|||
|
|||
.apar_bottom { |
|||
width: 100%; |
|||
margin-top: -1px; |
|||
|
|||
img { |
|||
width: 100%; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// .apar_right { |
|||
// margin-left: -3px; |
|||
// } |
|||
} |
|||
|
|||
.more { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #a0cdff; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.bg { |
|||
margin-bottom: 0px; |
|||
background: linear-gradient(144deg, |
|||
rgba(46, 164, 255, 0.1) 0%, |
|||
rgba(13, 143, 243, 0) 100%); |
|||
|
|||
.miniGrid_red { |
|||
@include radio; |
|||
background: rgba(249, 86, 25, 0.2); |
|||
border: 1px solid #f95619; |
|||
color: #f95619; |
|||
} |
|||
|
|||
.miniGrid_green { |
|||
@include radio; |
|||
background: rgba(249, 86, 25, 0.2); |
|||
border: 1px solid green; |
|||
color: green; |
|||
} |
|||
|
|||
.miniGrid_yellow { |
|||
@include radio; |
|||
background: rgba(249, 86, 25, 0.2); |
|||
border: 1px solid yellow; |
|||
color: yellow; |
|||
} |
|||
} |
|||
|
|||
.mount { |
|||
margin-top: 25px; |
|||
} |
|||
|
|||
.screen { |
|||
margin: 5px 0 40px; |
|||
|
|||
.el-select, |
|||
.el-input { |
|||
width: 150px; |
|||
margin-right: 4px; |
|||
border: 1px solid #126ac5; |
|||
border-radius: 2px; |
|||
|
|||
/deep/ .el-input__inner { |
|||
background: none; |
|||
border: none; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
|
|||
.btn { |
|||
margin-left: 46px; |
|||
height: 32px; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue