loveflow
1 year ago
parent
2368f46732
commit
dd3707946a
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 660 KiB |
|
After Width: | Height: | Size: 626 B |
|
After Width: | Height: | Size: 627 B |
|
After Width: | Height: | Size: 188 B |
|
After Width: | Height: | Size: 636 B |
|
After Width: | Height: | Size: 592 B |
@ -0,0 +1,85 @@
|
|||||||
|
<template>
|
||||||
|
<div class="enterpriseTopicWrap loveflow">
|
||||||
|
<div class="riskTrim tlIcon"></div>
|
||||||
|
<div class="riskTrim trIcon"></div>
|
||||||
|
<div class="riskTrim blIcon"></div>
|
||||||
|
<div class="riskTrim brIcon"></div>
|
||||||
|
<div class="topicMianBack">
|
||||||
|
<div class="backBtn" @click="goBack()"><img :src="backIcon" />返回</div>
|
||||||
|
</div>
|
||||||
|
<slot></slot>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
backIcon: require("@/assets/images/topic/left.png"),
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goBack() {
|
||||||
|
this.$router.push({
|
||||||
|
path: "/topic/screen",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.enterpriseTopicWrap {
|
||||||
|
height: 100%;
|
||||||
|
padding: 10px 24px 20px;
|
||||||
|
position: relative;
|
||||||
|
background: url("~@/assets/images/topic/bg.png") no-repeat center center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.topicMianBack {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border-bottom: solid 1px #5b748c;
|
||||||
|
height: 50px;
|
||||||
|
.backBtn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
img {
|
||||||
|
margin-right: 2px;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
opacity: 0.8;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.riskTrim {
|
||||||
|
position: absolute;
|
||||||
|
height: 32px;
|
||||||
|
width: 32px;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.tlIcon {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background: url("~@/assets/images/screen/tl.png") no-repeat center center;
|
||||||
|
}
|
||||||
|
.trIcon {
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
background: url("~@/assets/images/screen/tr.png") no-repeat center center;
|
||||||
|
}
|
||||||
|
.blIcon {
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background: url("~@/assets/images/screen/bl.png") no-repeat center center;
|
||||||
|
}
|
||||||
|
.brIcon {
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background: url("~@/assets/images/screen/br.png") no-repeat center center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,171 @@
|
|||||||
|
<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:djSlot="{ scope }">
|
||||||
|
<span class="noColor"> {{ scope.row.isD }}</span>
|
||||||
|
</template>
|
||||||
|
<template v-slot:qkSlot="{ scope }">
|
||||||
|
<span class="isColor"> {{ scope.row.isQ }}</span>
|
||||||
|
</template>
|
||||||
|
<template v-slot:ptypeSlot="{ 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,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
prop: "name",
|
||||||
|
label: "姓名",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "cmy",
|
||||||
|
label: "所属公司",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "phone",
|
||||||
|
label: "手机号",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "gender",
|
||||||
|
label: "性别",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "card",
|
||||||
|
label: "身份证号",
|
||||||
|
attrs: {
|
||||||
|
width: 180,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "address",
|
||||||
|
label: "来源地",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
slot: "qkSlot",
|
||||||
|
prop: "isQ",
|
||||||
|
label: "是否有前科",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
slot: "djSlot",
|
||||||
|
prop: "isD",
|
||||||
|
label: "是否登记",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
slot: "ptypeSlot",
|
||||||
|
prop: "personType",
|
||||||
|
label: "人员类型",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "date",
|
||||||
|
label: "入职日期",
|
||||||
|
attrs: {
|
||||||
|
width: 180,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "address",
|
||||||
|
label: "主要岗位",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "address",
|
||||||
|
label: "所属部门",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: "address",
|
||||||
|
label: "备注",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
filterClick(val) {
|
||||||
|
this.filterValue = val;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@ -1,7 +1,146 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="enterpriseTopicPanel">
|
||||||
<!-- 人员安全 -->
|
<!-- 人员安全 -->
|
||||||
人员安全
|
<topicMain>
|
||||||
|
<div class="enterpriseTopic">
|
||||||
|
<el-tabs v-model="tabindex" @tab-click="tabChange">
|
||||||
|
<el-tab-pane
|
||||||
|
v-for="item in tabList"
|
||||||
|
:key="item.label"
|
||||||
|
:label="item.label"
|
||||||
|
:name="item.value"
|
||||||
|
></el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
<div class="enterpriseTopicResult">
|
||||||
|
<component :is="content"></component>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</topicMain>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<style lang="less"></style>
|
<script>
|
||||||
|
import topicMain from "../components/topicMain.vue";
|
||||||
|
import flowPerson from "./flowPerson.vue";
|
||||||
|
import workPerson from "./workPerson.vue";
|
||||||
|
import keyPerson from "./keyPerson.vue";
|
||||||
|
export default {
|
||||||
|
components: { topicMain, flowPerson, workPerson, keyPerson },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabList: [
|
||||||
|
{
|
||||||
|
label: "流动人口管理",
|
||||||
|
value: "1",
|
||||||
|
content: flowPerson,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "重点岗位人员",
|
||||||
|
value: "2",
|
||||||
|
content: workPerson,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "重点人员",
|
||||||
|
value: "3",
|
||||||
|
content: keyPerson,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
tabindex: "1",
|
||||||
|
content: "flowPerson",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
tabChange(tab, event) {
|
||||||
|
let findIndex = this.tabList.findIndex((item) => {
|
||||||
|
return this.tabindex === item.value;
|
||||||
|
});
|
||||||
|
if (findIndex > -1) {
|
||||||
|
this.content = this.tabList[findIndex]["content"];
|
||||||
|
} else {
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.enterpriseTopicPanel {
|
||||||
|
padding: 20px;
|
||||||
|
height: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
color: #ffffff;
|
||||||
|
overflow: hidden;
|
||||||
|
.enterpriseTopic {
|
||||||
|
height: calc(100% - 50px);
|
||||||
|
.enterpriseTopicResult {
|
||||||
|
margin: 0;
|
||||||
|
height: calc(100% - 70px);
|
||||||
|
|
||||||
|
.personType {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.gaowei {
|
||||||
|
background: url("~@/assets/images/topic/gaowei.png") no-repeat center
|
||||||
|
center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.bgeng {
|
||||||
|
background: url("~@/assets/images/topic/bgeng.png") no-repeat center
|
||||||
|
center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.wdji {
|
||||||
|
background: url("~@/assets/images/topic/wdji.png") no-repeat center
|
||||||
|
center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.zdian {
|
||||||
|
background: url("~@/assets/images/topic/zdian.png") no-repeat center
|
||||||
|
center;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableOperator {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background: linear-gradient(
|
||||||
|
180deg,
|
||||||
|
rgba(234, 241, 248, 0.1) 0%,
|
||||||
|
rgba(208, 222, 238, 0.1) 100%
|
||||||
|
);
|
||||||
|
border: 1px solid #5b748c;
|
||||||
|
.filterBtnWrap {
|
||||||
|
padding: 2px;
|
||||||
|
&:last-child{
|
||||||
|
.el-divider{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.filterBtn {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 20px;
|
||||||
|
height: 34px;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #eaf6ff;
|
||||||
|
&.filterActive {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #4bffad;
|
||||||
|
background: rgba(129, 255, 204, 0.26);
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: #4bffad;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<div></div>
|
||||||
|
</template>
|
||||||
@ -0,0 +1,159 @@
|
|||||||
|
<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,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
prop: "name",
|
||||||
|
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: "备注",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
filterClick(val) {
|
||||||
|
this.filterValue = val;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
Loading…
Reference in new issue