|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 820 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 103 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 3.7 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 26 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 27 KiB |
@ -0,0 +1,389 @@
|
|||||||
|
<!-- 人员背景审查处置详情 -->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 详情查询 -->
|
||||||
|
<div class="item_search">
|
||||||
|
<div class="isearch">
|
||||||
|
<el-input
|
||||||
|
class="search_input"
|
||||||
|
placeholder="输入企业名称"
|
||||||
|
v-model="search_company"
|
||||||
|
clearable
|
||||||
|
>
|
||||||
|
</el-input>
|
||||||
|
<el-button @click="search" icon="el-icon-search"></el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="item_body">
|
||||||
|
<!-- 详情单元 -->
|
||||||
|
<div v-for="item in item_data" :key="item.id" class="item_cell">
|
||||||
|
<!-- 异常展示 -->
|
||||||
|
<div v-if="item.is_right === '1'" class="abnormal_cell_body">
|
||||||
|
<!-- 厂家名称 -->
|
||||||
|
<div class="cell_body_title">{{ item.company_name }}</div>
|
||||||
|
<div class="cell_body_information">
|
||||||
|
<div class="cell_body_information_text">
|
||||||
|
<div class="text_cell">审查原因:</div>
|
||||||
|
<div class="text_cell">审查人数:</div>
|
||||||
|
<div class="text_cell">申请时间:</div>
|
||||||
|
<div class="text_cell">审查结果:</div>
|
||||||
|
</div>
|
||||||
|
<div class="cell_body_information_value">
|
||||||
|
<div class="value_cell">{{ item.reason }}</div>
|
||||||
|
<div class="value_cell">{{ item.people }}</div>
|
||||||
|
<div class="value_cell">{{ item.time }}</div>
|
||||||
|
<div class="value_cell">{{ item.end }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 详情按钮 -->
|
||||||
|
<div class="cell_body_information_btn">
|
||||||
|
<div class="item_btn" @click="check_item">详情</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 正常展示 -->
|
||||||
|
<div v-else class="normal_cell_body">
|
||||||
|
<div class="cell_body_title">{{ item.company_name }}</div>
|
||||||
|
<div class="cell_body_information">
|
||||||
|
<div class="cell_body_information_text">
|
||||||
|
<div class="text_cell">审查原因:</div>
|
||||||
|
<div class="text_cell">审查人数:</div>
|
||||||
|
<div class="text_cell">申请时间:</div>
|
||||||
|
<div class="text_cell">审查结果:</div>
|
||||||
|
</div>
|
||||||
|
<div class="cell_body_information_value">
|
||||||
|
<div class="value_cell">{{ item.reason }}</div>
|
||||||
|
<div class="value_cell">{{ item.people }}</div>
|
||||||
|
<div class="value_cell">{{ item.time }}</div>
|
||||||
|
<div class="value_cell">{{ item.end }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 详情按钮 -->
|
||||||
|
<div class="cell_body_information_btn">
|
||||||
|
<div class="item_btn" @click="check_item">详情</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="item_pagination">
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="handleCurrentChange"
|
||||||
|
:page-sizes="[6]"
|
||||||
|
:page-size="pageSize"
|
||||||
|
:current-page="pageNum"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
:total="total"
|
||||||
|
>
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "PersonBack",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
search_company: "",
|
||||||
|
item_data: [
|
||||||
|
{
|
||||||
|
id: "1",
|
||||||
|
is_right: "1",
|
||||||
|
company_name: "宁波安捷化工有限公司",
|
||||||
|
reason: "新入职员工人员背景审查",
|
||||||
|
people: "16人",
|
||||||
|
time: "2022-12-12 12:12:12",
|
||||||
|
end: "14人正常, 1人异常",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2",
|
||||||
|
is_right: "2",
|
||||||
|
company_name: "宁波安捷化工有限公司",
|
||||||
|
reason: "新入职员工人员背景审查",
|
||||||
|
people: "16人",
|
||||||
|
time: "2022-12-12 12:12:12",
|
||||||
|
end: "14人正常, 0人异常",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3",
|
||||||
|
is_right: "2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4",
|
||||||
|
is_right: "2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5",
|
||||||
|
is_right: "2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "6",
|
||||||
|
is_right: "2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "7",
|
||||||
|
is_right: "1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "8",
|
||||||
|
is_right: "2",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
pageSize: 10,
|
||||||
|
pageNum: 1,
|
||||||
|
total: 0,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
search() {},
|
||||||
|
// 点击查看详情
|
||||||
|
check_item() {
|
||||||
|
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
console.log(`每页 ${val} 条`);
|
||||||
|
this.pageNum = 1;
|
||||||
|
this.pageSize = val;
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
console.log(`当前页: ${val}`);
|
||||||
|
this.pageNum = val;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.item_search {
|
||||||
|
width: 94vw;
|
||||||
|
height: 5vh;
|
||||||
|
.isearch {
|
||||||
|
display: flex;
|
||||||
|
width: 18vw;
|
||||||
|
margin-left: 1.5vw;
|
||||||
|
.el-button {
|
||||||
|
font-size: 17px;
|
||||||
|
height: 4vh;
|
||||||
|
border-radius: 0px;
|
||||||
|
color: #fff;
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
}
|
||||||
|
.el-button:hover {
|
||||||
|
background: #4d8f89;
|
||||||
|
}
|
||||||
|
/deep/.search_input.el-input {
|
||||||
|
.el-input__inner {
|
||||||
|
color: #fff;
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
border-radius: 0px;
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
width: 16vw;
|
||||||
|
height: 4vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item_body {
|
||||||
|
width: 94vw;
|
||||||
|
height: 60vh;
|
||||||
|
color: #fff;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.item_cell {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 28vh;
|
||||||
|
margin-left: 1vw;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
.abnormal_cell_body {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 28vh;
|
||||||
|
background: url("~@/assets/companyFile/abnormalback.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.cell_body_title {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 4vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
color: #fff;
|
||||||
|
padding-left: 20px;
|
||||||
|
line-height: 4vh;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.cell_body_information {
|
||||||
|
margin-top: 1vh;
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
display: flex;
|
||||||
|
.cell_body_information_text {
|
||||||
|
width: 5vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
.text_cell {
|
||||||
|
width: 5vw;
|
||||||
|
height: 5vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
line-height: 5vh;
|
||||||
|
color: #d0deee;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell_body_information_value {
|
||||||
|
width: 17vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
.value_cell {
|
||||||
|
width: 17vw;
|
||||||
|
height: 5vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
line-height: 5vh;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell_body_information_btn {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 3vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
position: relative;
|
||||||
|
.item_btn {
|
||||||
|
color: #ff6565;
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.item_btn:focus,
|
||||||
|
.item_btn:hover {
|
||||||
|
text-shadow: 0 0 9px #ff8b4e;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.normal_cell_body {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 28vh;
|
||||||
|
background: url("~@/assets/companyFile/normalback.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.cell_body_title {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 4vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
color: #fff;
|
||||||
|
padding-left: 20px;
|
||||||
|
line-height: 4vh;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.cell_body_information {
|
||||||
|
margin-top: 1vh;
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
display: flex;
|
||||||
|
.cell_body_information_text {
|
||||||
|
width: 5vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
.text_cell {
|
||||||
|
width: 5vw;
|
||||||
|
height: 5vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
line-height: 5vh;
|
||||||
|
color: #d0deee;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell_body_information_value {
|
||||||
|
width: 17vw;
|
||||||
|
height: 20vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
.value_cell {
|
||||||
|
width: 17vw;
|
||||||
|
height: 5vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
line-height: 5vh;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell_body_information_btn {
|
||||||
|
width: 22.2vw;
|
||||||
|
height: 3vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
position: relative;
|
||||||
|
.item_btn {
|
||||||
|
color: #30C4FF;
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.item_btn:focus,
|
||||||
|
.item_btn:hover {
|
||||||
|
text-shadow: 0 0 9px #30C4FF;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item_pagination {
|
||||||
|
width: 94vw;
|
||||||
|
height: 6vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row-reverse;
|
||||||
|
// border: 0.1px solid #2f6363;
|
||||||
|
// background: #3c4b4a;
|
||||||
|
/deep/.el-pagination {
|
||||||
|
margin-top: 1vh;
|
||||||
|
margin-right: 1vw;
|
||||||
|
.el-pagination__total {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
/* 显示多少条/页和在哪页的input样式 */
|
||||||
|
.el-input__inner {
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 2px solid #28847e;
|
||||||
|
background: #3c4b4a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.btn-prev {
|
||||||
|
border-radius: 0px;
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
background: #3c4b4a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
li {
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
background: #3c4b4a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn-next {
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
border-radius: 0px;
|
||||||
|
background: #3c4b4a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.el-pager {
|
||||||
|
li {
|
||||||
|
border: 0.1px solid #28847e;
|
||||||
|
background: #3c4b4a !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-pagination__jump {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||||
|
border: 0.1px solid #76eae4;
|
||||||
|
}
|
||||||
|
/deep/.el-pagination.is-background .el-pager li:not(.disabled):hover {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,672 @@
|
|||||||
|
<!-- 应用超市 -->
|
||||||
|
<template>
|
||||||
|
<div class="supermarket_body">
|
||||||
|
<div class="supermarket_title">
|
||||||
|
<div class="supermarket_title_01" @click="back_list">应用超市</div>
|
||||||
|
<div v-if="is_flag != '0'" class="supermarket_title_02">>>处置详情</div>
|
||||||
|
</div>
|
||||||
|
<div class="supermarket_list">
|
||||||
|
<div v-if="is_flag === '0'" class="list_boxs">
|
||||||
|
<!-- 人员背景审查 -->
|
||||||
|
<div class="list_box person_back" @click="person_back_change">
|
||||||
|
<div class="person_back_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="green_mark turn"></div>
|
||||||
|
<div class="person_back_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="person_back_text">人员背景审查</div>
|
||||||
|
</div>
|
||||||
|
<!-- 重点人员核查 -->
|
||||||
|
<div class="list_box key_person">
|
||||||
|
<div class="key_person_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="green_mark turn"></div>
|
||||||
|
<div class="key_person_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="key_person_text">重点人员核查</div>
|
||||||
|
</div>
|
||||||
|
<!-- 重点物品核查 -->
|
||||||
|
<div class="list_box key_item">
|
||||||
|
<div class="key_item_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="blue_mark turn"></div>
|
||||||
|
<div class="key_item_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="key_item_text">重点物品核查</div>
|
||||||
|
</div>
|
||||||
|
<!-- 企业纠纷调解 -->
|
||||||
|
<div class="list_box company_dispute">
|
||||||
|
<div class="company_dispute_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="blue_mark turn"></div>
|
||||||
|
<div class="company_dispute_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="company_dispute_text">企业纠纷调解</div>
|
||||||
|
</div>
|
||||||
|
<!-- 企业通知公告 -->
|
||||||
|
<div class="list_box company_notification">
|
||||||
|
<div class="company_notification_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="yellow_mark turn"></div>
|
||||||
|
<div class="company_notification_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="company_notification_text">企业通知公告</div>
|
||||||
|
</div>
|
||||||
|
<!-- 专家智库 -->
|
||||||
|
<div class="list_box expert_library">
|
||||||
|
<div class="expert_library_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="yellow_mark turn"></div>
|
||||||
|
<div class="expert_library_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="expert_library_text">专家智库</div>
|
||||||
|
</div>
|
||||||
|
<!-- 企业法律法规 -->
|
||||||
|
<div class="list_box law_regulations">
|
||||||
|
<div class="law_regulations_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="green_mark turn"></div>
|
||||||
|
<div class="law_regulations_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="law_regulations_text">企业法律法规</div>
|
||||||
|
</div>
|
||||||
|
<!-- 行业协会 -->
|
||||||
|
<div class="list_box association">
|
||||||
|
<div class="association_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="green_mark turn"></div>
|
||||||
|
<div class="association_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="association_text">行业协会</div>
|
||||||
|
</div>
|
||||||
|
<!-- 统计报表 -->
|
||||||
|
<div class="list_box statement">
|
||||||
|
<div class="statement_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="blue_mark turn"></div>
|
||||||
|
<div class="statement_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="statement_text">统计报表</div>
|
||||||
|
</div>
|
||||||
|
<!-- 经侦最佳指标 -->
|
||||||
|
<div class="list_box target">
|
||||||
|
<div class="target_icon_box">
|
||||||
|
<!-- 遮罩层 负责旋转动画 -->
|
||||||
|
<div class="blue_mark turn"></div>
|
||||||
|
<div class="target_icon"></div>
|
||||||
|
</div>
|
||||||
|
<div class="target_text">经侦最佳指标</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 跳转至人员背景审查详情 -->
|
||||||
|
<div v-else-if="is_flag === '1'" class="person_back_boxs">
|
||||||
|
<PersonBack ref="personBack"></PersonBack>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import PersonBack from './components/personBack'
|
||||||
|
export default {
|
||||||
|
name: "ApplySupermarket",
|
||||||
|
components:{
|
||||||
|
PersonBack
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
is_flag: "0",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 回归到应用超市首页
|
||||||
|
back_list() {
|
||||||
|
this.is_flag = '0'
|
||||||
|
},
|
||||||
|
person_back_change() {
|
||||||
|
this.is_flag = "1";
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.supermarket_body {
|
||||||
|
border: 0px;
|
||||||
|
width: 98vw;
|
||||||
|
height: 89vh;
|
||||||
|
margin-top: 2vh;
|
||||||
|
margin-left: 1vw;
|
||||||
|
padding-top: 2vh;
|
||||||
|
// position: relative;
|
||||||
|
background: url("~@/assets/companyFile/background1.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.supermarket_title {
|
||||||
|
width: 96vw;
|
||||||
|
height: 3vh;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
text-shadow: 0 0 9px rgba(21, 255, 198, 0.64);
|
||||||
|
.supermarket_title_01 {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.supermarket_list {
|
||||||
|
width: 96vw;
|
||||||
|
height: 80vh;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 2vh;
|
||||||
|
padding-top: 4vh;
|
||||||
|
background: url("~@/assets/companyFile/background2.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.list_boxs {
|
||||||
|
width: 94vw;
|
||||||
|
height: 74vh;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
margin: 0 auto;
|
||||||
|
.list_box {
|
||||||
|
width: 260px;
|
||||||
|
height: 260px;
|
||||||
|
border: 0.1px solid #3f5564;
|
||||||
|
margin-left: 64px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.list_box:focus,
|
||||||
|
.list_box:hover {
|
||||||
|
/* 导航选项点击触碰效果 */
|
||||||
|
filter: brightness(150%);
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
}
|
||||||
|
/*人员背景审查样式*/
|
||||||
|
.person_back {
|
||||||
|
background: url("~@/assets/companyFile/background3.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.person_back_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.person_back_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.person_back_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.person_back:focus,
|
||||||
|
.person_back:hover {
|
||||||
|
.green_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*重点人员核查样式*/
|
||||||
|
.key_person {
|
||||||
|
background: url("~@/assets/companyFile/background3.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.key_person_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.key_person_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.key_person_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.key_person:focus,
|
||||||
|
.key_person:hover {
|
||||||
|
.green_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*重点物品核查样式*/
|
||||||
|
.key_item {
|
||||||
|
background: url("~@/assets/companyFile/background4.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.key_item_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.key_item_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon03.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.key_item_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.key_item:focus,
|
||||||
|
.key_item:hover {
|
||||||
|
.blue_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*重点物品核查样式*/
|
||||||
|
.company_dispute {
|
||||||
|
background: url("~@/assets/companyFile/background4.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.company_dispute_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.company_dispute_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon04.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.company_dispute_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.company_dispute:focus,
|
||||||
|
.company_dispute:hover {
|
||||||
|
.blue_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*企业通知公告样式*/
|
||||||
|
.company_notification {
|
||||||
|
background: url("~@/assets/companyFile/background5.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.company_notification_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.company_notification_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon05.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.company_notification_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback03.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.company_notification:focus,
|
||||||
|
.company_notification:hover {
|
||||||
|
.yellow_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn03.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*专家智库样式*/
|
||||||
|
.expert_library {
|
||||||
|
background: url("~@/assets/companyFile/background5.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.expert_library_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.expert_library_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon06.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.expert_library_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback03.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.expert_library:focus,
|
||||||
|
.expert_library:hover {
|
||||||
|
.yellow_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn03.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*法律法规样式*/
|
||||||
|
.law_regulations {
|
||||||
|
background: url("~@/assets/companyFile/background3.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.law_regulations_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.law_regulations_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon07.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.law_regulations_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.law_regulations:focus,
|
||||||
|
.law_regulations:hover {
|
||||||
|
.green_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*行业协会样式*/
|
||||||
|
.association {
|
||||||
|
background: url("~@/assets/companyFile/background3.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.association_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.association_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon08.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.association_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.association:focus,
|
||||||
|
.association:hover {
|
||||||
|
.green_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn01.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*统计报表样式*/
|
||||||
|
.statement {
|
||||||
|
background: url("~@/assets/companyFile/background4.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.statement_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.statement_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon09.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.statement_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.statement:focus,
|
||||||
|
.statement:hover {
|
||||||
|
.blue_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*经侦最佳指标样式*/
|
||||||
|
.target {
|
||||||
|
background: url("~@/assets/companyFile/background4.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
.target_icon_box {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border: 0.1px solid rgba(0, 0, 0, 0);
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
margin: 20px auto;
|
||||||
|
position: relative;
|
||||||
|
/* 遮罩层 旋转动画 */
|
||||||
|
.target_icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 50px auto;
|
||||||
|
background: url("~@/assets/companyFile/icon10.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.target_text {
|
||||||
|
width: 240px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 19px;
|
||||||
|
// border: 0.1px solid #3f5564;
|
||||||
|
background: url("~@/assets/companyFile/btnback02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.target:focus,
|
||||||
|
.target:hover {
|
||||||
|
.blue_mark {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
z-index: 2;
|
||||||
|
background: url("~@/assets/companyFile/turn02.png") no-repeat !important;
|
||||||
|
background-size: 100% 100% !important;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.person_back_boxs {
|
||||||
|
width: 94vw;
|
||||||
|
height: 74vh;
|
||||||
|
// border: 0.1px solid #fff;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 旋转动画
|
||||||
|
@keyframes turn {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: rotate(-72deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
40% {
|
||||||
|
transform: rotate(-144deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
transform: rotate(-216deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: rotate(-288deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(-360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.turn {
|
||||||
|
animation: turn 10s linear infinite;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue