loveflow
1 year ago
parent
1629421b69
commit
6011a2aea5
|
After Width: | Height: | Size: 98 KiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 29 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 16 KiB |
@ -1,3 +1,201 @@
|
||||
<template>
|
||||
<div></div>
|
||||
</template>
|
||||
<div style="height: 100%">
|
||||
<div class="flexSpaceBetween">
|
||||
<div class="tableOperator">
|
||||
<div
|
||||
class="flex-center filterBtnWrap"
|
||||
v-for="item in filterList"
|
||||
:key="item.name"
|
||||
@click="filterClick(item.value)"
|
||||
>
|
||||
<div
|
||||
:class="{ filterActive: filterValue == item.value }"
|
||||
class="filterBtn"
|
||||
>
|
||||
{{ item.name }} ({{ item.total }})
|
||||
</div>
|
||||
<el-divider
|
||||
:class="{ filterActive: filterValue == '2' }"
|
||||
direction="vertical"
|
||||
></el-divider>
|
||||
</div>
|
||||
</div>
|
||||
<div class="searchWrap">
|
||||
<el-form :inline="true" :model="queryParam" class="demo-form-inline">
|
||||
<el-form-item label="关键字">
|
||||
<el-input
|
||||
v-model="queryParam.key"
|
||||
placeholder="请输入姓名、身份证"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="searchQuery">查询</el-button>
|
||||
<el-button type="primary" plain @click="searchReset"
|
||||
>重置</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tableWrap">
|
||||
<gMainTable
|
||||
border
|
||||
stripe
|
||||
ref="gMainTable"
|
||||
:tableData="dataSource"
|
||||
:columns="columns"
|
||||
rowKey="id"
|
||||
:pagination="ipagination"
|
||||
@pageSizeChange="handlePageSizeChange"
|
||||
@currentPageChange="handleCurrentPageChange"
|
||||
>
|
||||
<template v-slot:scSlot="{ scope }">
|
||||
<span class="noColor"> {{ scope.row.sc }}</span>
|
||||
</template>
|
||||
<template v-slot:gwSlot="{ scope }">
|
||||
<div class="personType gaowei">{{ scope.row.personType }}</div>
|
||||
</template>
|
||||
</gMainTable>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { tableListMixins } from "@/loveflow/mixins/tableListMixins";
|
||||
|
||||
export default {
|
||||
mixins: [tableListMixins],
|
||||
data() {
|
||||
return {
|
||||
filterValue: "1",
|
||||
filterList: [
|
||||
{
|
||||
name: "全部",
|
||||
value: "1",
|
||||
total: 123,
|
||||
},
|
||||
{
|
||||
name: "重要精神病",
|
||||
value: "2",
|
||||
total: 12,
|
||||
},
|
||||
{
|
||||
name: "非防人员",
|
||||
value: "3",
|
||||
total: 123,
|
||||
},
|
||||
{
|
||||
name: "退役重点人员",
|
||||
value: "4",
|
||||
total: 23,
|
||||
},
|
||||
{
|
||||
name: "个人极端人员",
|
||||
value: "5",
|
||||
total: 13,
|
||||
},
|
||||
{
|
||||
name: "家暴人员",
|
||||
value: "6",
|
||||
total: 13,
|
||||
},
|
||||
{
|
||||
name: "前科人员",
|
||||
value: "7",
|
||||
total: 13,
|
||||
},
|
||||
{
|
||||
name: "酗酒人员",
|
||||
value: "8",
|
||||
total: 13,
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
prop: "name",
|
||||
label: "姓名",
|
||||
},
|
||||
{
|
||||
prop: "gender",
|
||||
label: "性别",
|
||||
},
|
||||
{
|
||||
prop: "gender",
|
||||
label: "人员类型",
|
||||
},
|
||||
{
|
||||
prop: "gender",
|
||||
label: "民族",
|
||||
},
|
||||
{
|
||||
prop: "card",
|
||||
label: "身份证号",
|
||||
attrs: {
|
||||
width: 180,
|
||||
},
|
||||
},
|
||||
{
|
||||
prop: "gender",
|
||||
label: "户口省县",
|
||||
},
|
||||
{
|
||||
prop: "phone",
|
||||
label: "户口详址",
|
||||
},
|
||||
{
|
||||
prop: "cmy",
|
||||
label: "归属企业",
|
||||
},
|
||||
{
|
||||
prop: "address",
|
||||
label: "婚姻状况",
|
||||
},
|
||||
{
|
||||
slot: "gwSlot",
|
||||
prop: "address",
|
||||
label: "文化程度",
|
||||
},
|
||||
{
|
||||
prop: "personType",
|
||||
label: "暂住地址",
|
||||
},
|
||||
{
|
||||
prop: "date",
|
||||
label: "暂住场所",
|
||||
attrs: {
|
||||
width: 180,
|
||||
},
|
||||
},
|
||||
{
|
||||
slot: "scSlot",
|
||||
prop: "address",
|
||||
label: "所属区县",
|
||||
},
|
||||
{
|
||||
prop: "address",
|
||||
label: "所属派出所",
|
||||
},
|
||||
{
|
||||
prop: "address",
|
||||
label: "所属委员会",
|
||||
},
|
||||
{
|
||||
prop: "date",
|
||||
label: "登记日期",
|
||||
attrs: {
|
||||
width: 180,
|
||||
},
|
||||
},
|
||||
{
|
||||
prop: "address",
|
||||
label: "重点类别",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
filterClick(val) {
|
||||
this.filterValue = val;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="enterpriseTopic">
|
||||
<head-wrap title="平安企业专题驾驶舱"></head-wrap>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import headWrap from "@/views/home/head.vue";
|
||||
|
||||
export default {
|
||||
components: { headWrap },
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less"></style>
|
||||
<style lang="scss" scoped>
|
||||
@import "@/loveflow/assets/index.scss";
|
||||
.enterpriseTopic {
|
||||
.riskCol {
|
||||
padding-left: vw(8);
|
||||
font-size: vh(16);
|
||||
|
||||
.riskName {
|
||||
height: 30px;
|
||||
display: flex;
|
||||
margin-top: vh(6);
|
||||
color: #d9e7ff;
|
||||
|
||||
.riskIcon {
|
||||
width: vw(24);
|
||||
height: vh(24);
|
||||
background: url("~@/assets/images/screen/riskIcon.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,21 +1,124 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 驾驶舱 -->
|
||||
专题驾驶舱大屏
|
||||
<el-button @click="gotoPage('/topic/personSafety')">前往菜单</el-button>
|
||||
<div class="enterpriseTopic">
|
||||
<head-wrap title="平安企业专题驾驶舱"></head-wrap>
|
||||
<div class="enterpriseTopicBody">
|
||||
<div class="riskRow topRow">
|
||||
<div class="riskCol mr18">
|
||||
<div class="inRow">
|
||||
<div class="sideLtCol mb10"></div>
|
||||
<div class="sideLmCol"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="riskCol midCol mr18"></div>
|
||||
<div class="riskCol midCol mr18"></div>
|
||||
<div class="riskCol">
|
||||
<div class="inRow">
|
||||
<div class="riskCol sideCol mb10"></div>
|
||||
<div class="riskCol sideCol"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="riskRow btmRow">
|
||||
<div class="riskCol mr18"></div>
|
||||
<div class="riskCol"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import headWrap from "@/views/home/head.vue";
|
||||
|
||||
export default {
|
||||
components: { headWrap },
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
methods: {
|
||||
gotoPage(val) {
|
||||
this.$router.push({
|
||||
path: val,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.enterpriseTopic {
|
||||
height: 100%;
|
||||
background: url("~@/assets/images/topic/allback.png") no-repeat center center;
|
||||
background-size: 100% 100%;
|
||||
.enterpriseTopicBody {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 16px;
|
||||
width: calc(100% - 32px);
|
||||
height: calc(100% - 110px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.riskRow {
|
||||
display: flex;
|
||||
}
|
||||
.inRow {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
}
|
||||
.riskCol {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
@import "@/loveflow/assets/index.scss";
|
||||
.enterpriseTopic {
|
||||
.enterpriseTopicBody {
|
||||
.topRow {
|
||||
height: vh(632);
|
||||
.midCol {
|
||||
background: url("~@/assets/images/topic/midCol.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.sideCol {
|
||||
background: url("~@/assets/images/topic/sideCol.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.sideLtCol {
|
||||
height: vh(248);
|
||||
background: url("~@/assets/images/topic/sideLtCol.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.sideLmCol {
|
||||
flex: 1;
|
||||
background: url("~@/assets/images/topic/sideLmCol.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.btmRow {
|
||||
height: vh(308);
|
||||
.riskCol {
|
||||
background: url("~@/assets/images/topic/bCol.png") no-repeat center
|
||||
center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.riskCol {
|
||||
//padding-left: vw(8);
|
||||
font-size: vh(16);
|
||||
|
||||
.riskName {
|
||||
height: 30px;
|
||||
display: flex;
|
||||
margin-top: vh(6);
|
||||
color: #d9e7ff;
|
||||
|
||||
.riskIcon {
|
||||
width: vw(24);
|
||||
height: vh(24);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<div class="homeHeadPanel">
|
||||
<div class="homeHeadWrap">{{ title }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return "";
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="less">
|
||||
.homeHeadWrap {
|
||||
position: absolute;
|
||||
padding-top: 36px;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 130px;
|
||||
font-weight: bold;
|
||||
font-size: 34px;
|
||||
letter-spacing: 4px;
|
||||
color: #ffffff;
|
||||
background: url("~@/assets/images/home/head.png") no-repeat center center;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue