epmet pc工作端
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.
 
 
 
 

940 lines
32 KiB

<template>
<popup title="居民详情" @close="handleClose">
<template v-slot:cnt>
<div class="m-info" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 21, 64, 0.3)">
<div class="subtitle">
<i class="i-chunk"></i>
<span>基本信息</span>
<i class="i-line"></i>
</div>
<div class="row">
<div class="item">
<div class="field">所属网格:</div>
<div class="value">
<span v-if="info.community">{{ info.community }}</span>
<span v-if="info.grid"> - {{ info.grid }}</span>
</div>
</div>
<div class="item">
<div class="field">所属房屋:</div>
<div class="value">
<span v-if="info.village">{{ info.village }}</span>
<span v-if="info.building"> - {{ info.building }}</span>
<span v-if="info.unit"> - {{ info.unit }}</span>
<span v-if="info.room"> - {{ info.room }}</span>
</div>
</div>
<div class="item">
<div class="field">本地户籍:</div>
<div class="value">{{ info.census_type }}</div>
</div>
</div>
<div class="row">
<div class="item">
<div class="field">居民姓名:</div>
<div class="value">{{ info.name }}</div>
</div>
<div class="item">
<div class="field">出生日期:</div>
<div class="value">{{ info.birthday }}</div>
</div>
<div class="item">
<div class="field">性别:</div>
<div class="value">{{ info.gender }}</div>
</div>
<div class="item">
<div class="field">民族:</div>
<div class="value">{{ info.ethnic }}</div>
</div>
<div class="item">
<div class="field">联系电话:</div>
<div class="value">{{ info.telephone }}</div>
</div>
<div class="item">
<div class="field">证件号:</div>
<div class="value">{{ info.idcard }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.resident_remark }}</div>
</div>
</div>
<div class="subtitle">
<i class="i-chunk"></i>
<span>分类信息</span>
<i class="i-line"></i>
</div>
<div class="row">
<div class="item">
<div class="field">居民分类:</div>
<div class="value">
<div class="u-categorys">
<span v-if="info.crowd">党员</span>
<span v-if="info.mlsp">低保人员</span>
<span v-if="info.srs">保障房人员</span>
<span v-if="info.unemployed">失业人员</span>
<span v-if="info.woca">育龄妇女</span>
<span v-if="info.exs">退役军人</span>
<span v-if="info.ufs">统战人员</span>
<span v-if="info.petitioner">信访人员</span>
<span v-if="info.volunteer">志愿者</span>
<span v-if="info.in_person">特扶人员</span>
<span v-if="info.tenant">租户</span>
<span v-if="info.float_popu">流动人口</span>
<span v-if="info.special_popu">特殊人群</span>
<span v-if="info.aaaa">独居老人</span>
<span v-if="info.empty_nest">空巢老人</span>
<span v-if="info.disability">失能老人</span>
<span v-if="info.dementia">失智老人</span>
<span v-if="info.adisability">残疾</span>
<span v-if="info.ser_ill">大病</span>
<span v-if="info.ncd">慢病</span>
</div>
</div>
</div>
</div>
<div class="subtitle">
<i class="i-chunk"></i>
<span>其他信息</span>
<i class="i-line"></i>
</div>
<div class="m-tabs">
<div class="tab-btn" @click="subStartTabIndex" v-if="tabList.length > 7">
<img src="@/assets/img/shuju/people/arrow-double-left.png" />
</div>
<div v-show="index >= startTabIndex && index < startTabIndex + 7" class="tab" :class="currentTabIndex % tabList.length == index ? 'z-on' : ''" :key="'tab' + index" @click="currentTabIndex = index" v-for="(item, index) in tabList">
{{ item }}
</div>
<div class="tab-btn" @click="addStartTabIndex" v-if="tabList.length > 7">
<img src="@/assets/img/shuju/people/arrow-double-right.png" />
</div>
</div>
<div v-if="currentTab == '教育信息'">
<div class="row">
<div class="item">
<div class="field">文化程度:</div>
<div class="value">{{ info.education }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.education_remark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '兴趣爱好'">
<div class="row">
<div class="item">
<div class="field">兴趣:</div>
<div class="value">{{ info.hobby }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.hobby_remark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '宗教'">
<div class="row">
<div class="item">
<div class="field">宗教:</div>
<div class="value">{{ info.belief }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.belief_remark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '健康'">
<div class="row">
<div class="item">
<div class="field">残疾类别:</div>
<div class="value">{{ info.disable_type }}</div>
</div>
<div class="item">
<div class="field">残疾等级:</div>
<div class="value">{{ info.disable_degree }}</div>
</div>
<div class="item">
<div class="field">残疾证号:</div>
<div class="value">{{ info.disable_idcard }}</div>
</div>
<div class="item">
<div class="field">残疾说明:</div>
<div class="value">{{ info.disable_remark }}</div>
</div>
<div class="item">
<div class="field">监护人:</div>
<div class="value">{{ info.guardian }}</div>
</div>
<div class="item">
<div class="field">劳动能力:</div>
<div class="value">{{ info.skill }}</div>
</div>
<div class="item">
<div class="field">非义务教育阶段助学:</div>
<div class="value">
{{ info.voluntaryEducationFlag }}
</div>
</div>
<div class="item">
<div class="field">所患大病:</div>
<div class="value">
{{ info.voluntaryEducationFlag }}
</div>
</div>
<div class="item">
<div class="field">大病患病时间:</div>
<div class="value">{{ info.illnessCode }}</div>
</div>
<div class="item">
<div class="field">所患慢性病:</div>
<div class="value">
{{ info.chronicDiseaseCode }}
</div>
</div>
<div class="item">
<div class="field">慢病患病时间:</div>
<div class="value">
{{ info.chronicDiseaseTime }}
</div>
</div>
<div class="item">
<div class="field">是否参保:</div>
<div class="value">
{{ info.chronicDiseaseTime }}
</div>
</div>
<div class="item">
<div class="field">自付金额:</div>
<div class="value">{{ info.selfPayAmount }}</div>
</div>
<div class="item">
<div class="field">救助金额:</div>
<div class="value">{{ info.selfPayAmount }}</div>
</div>
<div class="item">
<div class="field">救助时间:</div>
<div class="value">
{{ info.deliveranceAmount }}
</div>
</div>
<div class="item">
<div class="field">享受救助明细序号:</div>
<div class="value">{{ info.deliveranceTime }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.deliveranceNum }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '工作'">
<div class="row">
<div class="item">
<div class="field">工作单位:</div>
<div class="value">{{ info.workunit }}</div>
</div>
<div class="item">
<div class="field">职业:</div>
<div class="value">{{ info.career }}</div>
</div>
<div class="item">
<div class="field">离退休时间:</div>
<div class="value">{{ info.retire_date }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.retire_remark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '经济状况'">
<div class="row">
<div class="item">
<div class="field">退休金额:</div>
<div class="value">{{ info.retire_income }}</div>
</div>
<div class="item">
<div class="field">月收入:</div>
<div class="value">{{ info.income }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '居住'">
<div class="row">
<div class="item">
<div class="field">籍贯:</div>
<div class="value">{{ info.native }}</div>
</div>
<div class="item">
<div class="field">户籍所在地:</div>
<div class="value">{{ info.native_place }}</div>
</div>
<div class="item">
<div class="field">现居住地:</div>
<div class="value">
{{ info.residence_current }}
</div>
</div>
<div class="item">
<div class="field">人户状况:</div>
<div class="value">{{ info.household }}</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.household_remark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '家庭'">
<div class="row">
<div class="item">
<div class="field">与户主关系:</div>
<div class="value">{{ info.holdingrel }}</div>
</div>
<div class="item">
<div class="field">居住情况:</div>
<div class="value">{{ info.residence }}</div>
</div>
<div class="item">
<div class="field">婚姻状况:</div>
<div class="value">{{ info.marital }}</div>
</div>
<div class="item">
<div class="field">配偶状况:</div>
<div class="value">{{ info.spouse }}</div>
</div>
<div class="item">
<div class="field">有无赡养人:</div>
<div class="value">{{ info.supporters }}</div>
</div>
<div class="item">
<div class="field">与赡养人关系:</div>
<div class="value">
{{ info.supporters_relation }}
</div>
</div>
<div class="item">
<div class="field">赡养人联系电话:</div>
<div class="value">
{{ info.dependantMobile }}
</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.familyInfoRemark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '党员'">
<div class="row">
<div class="item">
<div class="field">入党时间:</div>
<div class="value">{{ info.joinTime }}</div>
</div>
<div class="item">
<div class="field">转正时间:</div>
<div class="value">{{ info.positiveTime }}</div>
</div>
<div class="item">
<div class="field">所属支部:</div>
<div class="value">{{ info.branchId }}</div>
</div>
<div class="item">
<div class="field">是否流动党员:</div>
<div class="value">{{ info.flowFlag }}</div>
</div>
<div class="item">
<div class="field">流动党员活动证号:</div>
<div class="value">{{ info.flowActNum }}</div>
</div>
<div class="item">
<div class="field">职务:</div>
<div class="value">{{ info.partyJob }}</div>
</div>
<div class="item">
<div class="field">是否退休:</div>
<div class="value">{{ info.retiredFlag }}</div>
</div>
<div class="item">
<div class="field">是否党员中心户:</div>
<div class="value">{{ info.centerFlag }}</div>
</div>
<div class="item">
<div class="field">入党时所在党支部:</div>
<div class="value">{{ info.joinBranchName }}</div>
</div>
<div class="item">
<div class="field">组织关系转入社区时间:</div>
<div class="value">
{{ info.joinCommunityTime }}
</div>
</div>
<div class="item">
<div class="field">是否请长假:</div>
<div class="value">{{ info.longHolidayFlag }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '保障房'">
<div class="row">
<div class="item">
<div class="field">住房性质:</div>
<div class="value">{{ info.housingNature }}</div>
</div>
<div class="item">
<div class="field">保障类型:</div>
<div class="value">{{ info.securityType }}</div>
</div>
<div class="item">
<div class="field">发证日期:</div>
<div class="value">{{ info.certificateDate }}</div>
</div>
<div class="item">
<div class="field">补贴编号:</div>
<div class="value">{{ info.subsidyNum }}</div>
</div>
<div class="item">
<div class="field">补贴金额:</div>
<div class="value">{{ info.subsidyAmount }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '失业'">
<div class="row">
<div class="item">
<div class="field">原工作单位:</div>
<div class="value">{{ info.originWorkUnit }}</div>
</div>
<div class="item">
<div class="field">失业时间:</div>
<div class="value">{{ info.unemploymentTime }}</div>
</div>
<div class="item">
<div class="field">失业证号:</div>
<div class="value">{{ info.unemploymentTime }}</div>
</div>
<div class="item">
<div class="field">再就业优惠证号:</div>
<div class="value">{{ info.employmentNum }}</div>
</div>
<div class="item">
<div class="field">技术特长:</div>
<div class="value">{{ info.specialSkill }}</div>
</div>
<div class="item">
<div class="field">失业原因:</div>
<div class="value">
{{ info.unemploymentReason }}
</div>
</div>
<div class="item">
<div class="field">是否就业困难对象:</div>
<div class="value">
{{ info.employmentHardFlag }}
</div>
</div>
<div class="item">
<div class="field">劳动能力就业愿望:</div>
<div class="value">{{ info.employmentWish }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '退役军人'">
<div class="row">
<div class="item">
<div class="field">入伍时间:</div>
<div class="value">{{ info.joinArmyTime }}</div>
</div>
<div class="item">
<div class="field">退伍时间:</div>
<div class="value">{{ info.leaveArmyTime }}</div>
</div>
<div class="item">
<div class="field">服役单位:</div>
<div class="value">{{ info.serviceUnit }}</div>
</div>
<div class="item">
<div class="field">接收单位:</div>
<div class="value">{{ info.receiveUnit }}</div>
</div>
<div class="item">
<div class="field">待安置补助金:</div>
<div class="value">{{ info.settlementAmount }}</div>
</div>
<div class="item">
<div class="field">培训状况:</div>
<div class="value">{{ info.trainDesc }}</div>
</div>
<div class="item">
<div class="field">参战时间开始日期:</div>
<div class="value">{{ info.joinWarStartTime }}</div>
</div>
<div class="item">
<div class="field">参战时间截止日期:</div>
<div class="value">{{ info.joinWarEndTime }}</div>
</div>
<div class="item">
<div class="field">现就业状况:</div>
<div class="value">
{{ info.employmentSituation }}
</div>
</div>
<div class="item">
<div class="field">是否办理公益性岗位:</div>
<div class="value">
{{ info.pubWelfareJobFlag }}
</div>
</div>
</div>
</div>
<div v-if="currentTab == '统战人员'">
<div class="row">
<div class="item">
<div class="field">职务:</div>
<div class="value">{{ info.duty }}</div>
</div>
<div class="item">
<div class="field">探亲情况:</div>
<div class="value">{{ info.visitation }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '志愿者'">
<div class="row">
<div class="item">
<div class="field">志愿者类别:</div>
<div class="value">
{{ info.volunteerCategory }}
</div>
</div>
<div class="item">
<div class="field">备注:</div>
<div class="value">{{ info.volunteerRemark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '老年人'">
<div class="row">
<div class="item">
<div class="field">高龄补助:</div>
<div class="value">{{ info.volunteerRemark }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '特殊人群'">
<div class="row">
<div class="item">
<div class="field">特殊人群类别:</div>
<div class="value">
{{ info.specialCategoryCode }}
</div>
</div>
</div>
</div>
<div v-if="currentTab == '出生信息'">
<div class="row">
<div class="item">
<div class="field">出生地:</div>
<div class="value">{{ info.birthplace }}</div>
</div>
<div class="item">
<div class="field">父亲姓名:</div>
<div class="value">{{ info.father }}</div>
</div>
<div class="item">
<div class="field">母亲姓名:</div>
<div class="value">{{ info.mother }}</div>
</div>
<div class="item">
<div class="field">胎次:</div>
<div class="value">{{ info.count }}</div>
</div>
<div class="item">
<div class="field">申报日期:</div>
<div class="value">{{ info.reportDate }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '死亡信息'">
<div class="row">
<div class="item">
<div class="field">死亡时间:</div>
<div class="value">{{ info.deathDate }}</div>
</div>
<div class="item">
<div class="field">加入原因:</div>
<div class="value">{{ info.deathReason }}</div>
</div>
<div class="item">
<div class="field">移除时间:</div>
<div class="value">{{ info.removeDate }}</div>
</div>
<div class="item">
<div class="field">移除原因:</div>
<div class="value">{{ info.removeReason }}</div>
</div>
</div>
</div>
<div v-if="currentTab == '迁出'">
<div class="row">
<div class="item">
<div class="field">迁出信息:</div>
<div class="value">{{ info.outOfTime }}</div>
</div>
<div class="item">
<div class="field">迁出类别:</div>
<div class="value">{{ info.type }}</div>
</div>
<div class="item">
<div class="field">迁出原因:</div>
<div class="value">{{ info.reason }}</div>
</div>
<div class="item">
<div class="field">迁出至组织:</div>
<div class="value">{{ info.deptId }}</div>
</div>
<div class="item">
<div class="field">小区:</div>
<div class="value">{{ info.villageName }}</div>
</div>
<div class="item">
<div class="field">楼号:</div>
<div class="value">{{ info.buildName }}</div>
</div>
<div class="item">
<div class="field">单元:</div>
<div class="value">{{ info.unitName }}</div>
</div>
<div class="item">
<div class="field">房屋:</div>
<div class="value">{{ info.homeName }}</div>
</div>
<div class="item">
<div class="field">外迁地址:</div>
<div class="value">{{ info.address }}</div>
</div>
</div>
</div>
</div>
</template>
</popup>
</template>
<script>
import popup from "@/views/dataBoard/cpts/popup";
import { requestPostBi } from "@/js/dai/request-bipass";
export default {
name: "residentDetails",
props: {
resiId: {
type: String,
default: "",
},
},
components: { popup },
data() {
return {
info: {},
loading: false,
currentTabIndex: 0,
startTabIndex: 0,
BaseTabList: ["教育信息", "兴趣爱好", "宗教", "健康", "工作", "经济状况", "居住", "家庭"],
tabList: [],
};
},
watch: {
resiId: {
handler(val) {
if (val) {
this.getInfo(val);
// this.getInfoBase(val);
}
},
immediate: true,
},
},
computed: {
currentTab() {
return this.tabList[this.currentTabIndex];
},
},
methods: {
addStartTabIndex() {
const { startTabIndex, tabList } = this;
if (startTabIndex < tabList.length - 7) {
this.startTabIndex = startTabIndex + 1;
} else {
this.startTabIndex = tabList.length - 7;
}
},
subStartTabIndex() {
const { startTabIndex, tabList } = this;
if (startTabIndex > 0) {
this.startTabIndex = startTabIndex - 1;
} else {
this.startTabIndex = 0;
}
},
async getInfo(val) {
const url = "resident_info";
this.loading = true;
const { data, code, msg } = await requestPostBi(url, {
queryParam: {
resident_id: val,
// 1001001
},
});
if (code === 0) {
this.info = { ...this.info, ...data[0] };
const { info } = this;
let tabList = this.BaseTabList;
info.crowd && tabList.push("党员");
info.srs && tabList.push("保障房");
info.unemployed && tabList.push("失业");
info.exs && tabList.push("退役军人");
info.ufs && tabList.push("统战人员");
info.volunteer && tabList.push("志愿者");
info.aged && tabList.push("老年人");
info.special_popu && tabList.push("特殊人群");
tabList.push("出生信息");
tabList.push("死亡信息");
tabList.push("迁出");
this.tabList = tabList;
this.loading = false;
} else {
this.loading = false;
this.$message.error(msg);
}
},
handleClose() {
this.$emit("close");
},
// 根据房屋id获取详情
// getInfo(val) {
// this.$http.post(`/actual/base/residentBaseInfo/detail/1001001`).then((res) => {
// const { code, data } = res.data;
// if (code === 0) {
// this.info = data;
// const { info } = this;
// });
// },
// 根据房屋id获取详情
handlePageNoChange(page_num) {
this.page_num = page_num;
this.getList();
},
handleSizeChange(page_size) {
localStorage.setItem("dataBoard_page_size", page_size);
this.page_size = page_size;
this.getList();
},
async getList() {
const { org_id, listType, page_num, page_size, searchDate } = this;
const start_date = searchDate[0];
const end_date = searchDate[1];
let peop_type = this.type2;
this.loading = true;
const url = "person_resour_list";
const { data, code, msg } = await requestPostBi(
url,
{
queryParam: {
page_num,
page_size,
start_date,
end_date,
org_id,
peop_type,
},
},
{
// mockId: 60068051,
}
);
this.loading = false;
if (code === 0) {
this.srcTableData = data;
// this.total = data.total;
// service_num avg_satisfaction
this.list = data.map((item, index) => {
return [
index + 1,
item.peop_name ? item.peop_name : "--",
// item.peop_id ? item.peop_id : '--',
item.peop_child_type ? item.peop_child_type : "--",
item.service_num ? item.service_num : "--",
item.service_ratio ? item.service_ratio : "--",
item.avg_satisfaction ? item.avg_satisfaction : "--",
item.sum_point ? item.sum_point : "--",
{ type: "operate", list: ["查看"] },
];
});
} else {
this.$message.error(msg);
}
this.list = [];
},
async getCount() {
const { org_id, listType, page_num, page_size, searchDate } = this;
const start_date = searchDate[0];
const end_date = searchDate[1];
const url = "person_resour_list_num";
let peop_type = this.type2;
const { data, code, msg } = await requestPostBi(
url,
{
queryParam: {
org_id,
start_date,
end_date,
peop_type,
},
},
{
// mockId: 63070189,
}
);
if (code === 0) {
this.total = parseInt(data[0].total);
} else {
this.$message.error(msg);
}
},
getHomeTypesMap(item) {
const homeTypeMap = new Map([
["partyFlag", { name: "党员", icon: "dy" }],
["subsistenceAllowanceFlag", { name: "低保人员", icon: "dbry" }],
["ensureHouseFlag", { name: "保障房人员", icon: "bzfry" }],
["unemployedFlag", { name: "失业人员", icon: "syry" }],
["fertileWomanFlag", { name: "育龄妇女", icon: "ylfn" }],
["veteranFlag", { name: "退役军人", icon: "tyjr" }],
["unitedFrontFlag", { name: "统战人员", icon: "tzry" }],
["petitionOfficerFlag", { name: "信访人员", icon: "xfry" }],
["volunteerFlag", { name: "志愿者", icon: "zyz" }],
["oldPeopleFlag", { name: "老年人", icon: "lnr" }],
["emptyNesterFlag", { name: "空巢老人", icon: "kclr" }],
["specialSupportFlag", { name: "特扶人员", icon: "tfry" }],
["disabledFlag", { name: "失能人员", icon: "snry" }],
["dementedFlag", { name: "失智人员", icon: "szry" }],
["disabilityFlag", { name: "残疾人", icon: "cjr" }],
["seriousIllnessFlag", { name: "大病人员", icon: "dbry" }],
["chronicDiseaseFlag", { name: "慢性病人员", icon: "mxbry" }],
["specialCrowdFlag", { name: "特殊人群", icon: "tsry" }],
["tenantFlag", { name: "租户", icon: "zh" }],
["floatingFlag", { name: "流动人员", icon: "ldry" }],
["liveAloneFlag", { name: "独居老人", icon: "kclr" }],
["publicWelfareFlag", { name: "公益岗人员", icon: "gyg" }],
]);
return homeTypeMap.get(item).name;
},
getHomeTypes(newItem) {
let arr = [];
const itemNumOne = Object.keys(newItem).filter((key) => newItem[key] === 1);
itemNumOne.forEach((item) => {
arr.push(this.getHomeTypesMap(item));
this.peopleTypesArr = arr;
});
},
},
};
</script>
<style lang="scss" src="@/assets/scss/dataBoard/popup-info.scss" scoped></style>
<style lang="scss" scoped>
@import "~@/assets/scss/c/config.scss";
@import "~@/assets/scss/c/function.scss";
.u-categorys {
display: flex;
flex-wrap: wrap;
}
.u-categorys span {
display: block;
width: 90px;
}
.m-tabs {
margin-top: 30px;
display: flex;
align-items: center;
padding-left: 20px;
.tab-btn {
width: 30px;
text-align: center;
cursor: pointer;
}
.tab {
@include toe;
margin: 0 5px;
min-width: 72px;
padding: 0 8px;
height: 24px;
box-shadow: inset 0px 0px 12px 0px rgba(26, 149, 255, 0.45);
border-radius: 2px;
border: 1px solid #1a95ff;
border-radius: 2px;
text-align: center;
font-size: 14px;
font-family: PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 23px;
cursor: pointer;
transition: all ease 0.5s;
&.z-on {
background: linear-gradient(90deg, #1a5afd, #009cff);
box-shadow: none;
}
}
}
.row {
.field {
width: 150px !important;
}
}
</style>