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>
|
<template>
|
||||||
<div></div>
|
<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>
|
</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>
|
<template>
|
||||||
<div>
|
<div class="enterpriseTopic">
|
||||||
<!-- 驾驶舱 -->
|
<head-wrap title="平安企业专题驾驶舱"></head-wrap>
|
||||||
专题驾驶舱大屏
|
<div class="enterpriseTopicBody">
|
||||||
<el-button @click="gotoPage('/topic/personSafety')">前往菜单</el-button>
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import headWrap from "@/views/home/head.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
components: { headWrap },
|
||||||
data() {
|
data() {
|
||||||
return {};
|
return {};
|
||||||
},
|
},
|
||||||
methods: {
|
|
||||||
gotoPage(val) {
|
|
||||||
this.$router.push({
|
|
||||||
path: val,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</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>
|