lukeyan
2 years ago
parent
9e5f1ac296
commit
af6aae9649
@ -1,257 +1,277 @@
|
||||
<template>
|
||||
<div class="cardBox">
|
||||
<div class="cardContent">
|
||||
<!-- 卡片展示 -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6" class="cardCol" v-for="(i, index) in cardListArr" :key="index" @click.native="goArchives(i)">
|
||||
<div class="cardList">
|
||||
<div class="cardListHead">
|
||||
<span>{{ i.companyName }}</span>
|
||||
</div>
|
||||
<div class="cardListBody">
|
||||
<div class="bodySign" :style="{ 'background': 'url('+ i.picUrl +')' }">
|
||||
<!-- <img :src="i.picUrl"/> -->
|
||||
<!-- 中间标签 -->
|
||||
<div class="sign">
|
||||
<div class="impBtnList">
|
||||
<div
|
||||
:class="{
|
||||
shewei: a == '剧毒' || a == '易制毒',
|
||||
zhongdian: a == '消防重点' || a == '所管消防',
|
||||
zhibao: a == '放射源' || a == '易制爆',
|
||||
zhian: a == '治安重点' || a == '创安单位',
|
||||
}"
|
||||
v-for="a in i.companyTypes"
|
||||
:key="a"
|
||||
>
|
||||
{{ a }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cardListFoot">
|
||||
<el-descriptions class="margin-top" :column="2">
|
||||
<el-descriptions-item label="企业员工">{{ i.staffCount || 0}} 人</el-descriptions-item>
|
||||
<el-descriptions-item label="是否有过处罚">
|
||||
<span v-if="i.caseCount == 13">是</span>
|
||||
<span v-else>否</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="企业安全责任人电话">{{ i.emergencyContactPhone }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="address">
|
||||
<img src="@/assets/enterpriseArchives/address.png" alt="">
|
||||
<span>{{ i.companyAddress }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cardBox">
|
||||
<div class="cardContent">
|
||||
<!-- 卡片展示 -->
|
||||
<el-row :gutter="20">
|
||||
<el-col
|
||||
:span="6"
|
||||
class="cardCol"
|
||||
v-for="(i, index) in cardListArr"
|
||||
:key="index"
|
||||
@click.native="goArchives(i)"
|
||||
>
|
||||
<div class="cardList">
|
||||
<div class="cardListHead">
|
||||
<span>{{ i.companyName }}</span>
|
||||
</div>
|
||||
<div class="cardListBody">
|
||||
<div
|
||||
class="bodySign"
|
||||
:style="{ background: 'url(' + i.picUrl + ')' }"
|
||||
>
|
||||
<!-- <img :src="i.picUrl"/> -->
|
||||
<!-- 中间标签 -->
|
||||
<div class="sign">
|
||||
<div class="impBtnList">
|
||||
<div
|
||||
:class="{
|
||||
shewei: a == '剧毒' || a == '易制毒',
|
||||
zhongdian: a == '消防重点' || a == '所管消防',
|
||||
zhibao: a == '放射源' || a == '易制爆',
|
||||
zhian: a == '治安重点' || a == '创安单位',
|
||||
}"
|
||||
v-for="a in i.companyTypes"
|
||||
:key="a"
|
||||
>
|
||||
{{ a }}
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cardListFoot">
|
||||
<el-descriptions class="margin-top" :column="2">
|
||||
<el-descriptions-item label="企业员工"
|
||||
>{{ i.staffCount || 0 }} 人</el-descriptions-item
|
||||
>
|
||||
<el-descriptions-item label="是否有过处罚">
|
||||
<span v-if="i.caseCount == 13">是</span>
|
||||
<span v-else>否</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="企业安全责任人电话">{{
|
||||
i.emergencyContactPhone
|
||||
}}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="address">
|
||||
<img src="@/assets/enterpriseArchives/address.png" alt="" />
|
||||
<span>{{ i.companyAddress }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
cardList:{
|
||||
type:Array,
|
||||
default:()=> []
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
cardList:{
|
||||
handler(val){
|
||||
this.cardListArr =val
|
||||
},
|
||||
immediate:true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cardListArr:[]
|
||||
}
|
||||
props: {
|
||||
cardList: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
created() {
|
||||
|
||||
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
watch: {
|
||||
cardList: {
|
||||
handler(val) {
|
||||
this.cardListArr = val;
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
methods: {
|
||||
goArchives(val) {
|
||||
console.log(val,'val');
|
||||
sessionStorage.setItem('companyID', val.id)
|
||||
sessionStorage.setItem('companyName', val.companyName)
|
||||
this.$router.push({
|
||||
name: 'archives',
|
||||
|
||||
})
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cardListArr: [],
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
goArchives(val) {
|
||||
console.log(val, "val");
|
||||
sessionStorage.setItem("companyID", val.id);
|
||||
sessionStorage.setItem("companyName", val.companyName);
|
||||
this.$router.push({
|
||||
name: "archives",
|
||||
});
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.cardBox{
|
||||
width: 100%;
|
||||
.cardBox {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 0.1px solid #495e70;
|
||||
height: 65vh;
|
||||
.cardContent {
|
||||
width: 80%;
|
||||
height: 60vh;
|
||||
// border:4px solid #fff;
|
||||
}
|
||||
.cardCol {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.cardContent {
|
||||
width: 80%;
|
||||
margin-bottom: 2vh;
|
||||
}
|
||||
.cardList {
|
||||
width: 20vw;
|
||||
cursor: pointer;
|
||||
height: 30vh;
|
||||
background: url("~@/assets/enterpriseArchives/cardBg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.cardListHead {
|
||||
height: 39px;
|
||||
z-index: 99;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
background: url("~@/assets/enterpriseArchives/cardTitle.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 382px;
|
||||
}
|
||||
.cardCol{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 2vh;
|
||||
.cardListHead span {
|
||||
color: #ffffff;
|
||||
display: inline-block;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.cardList {
|
||||
width: 382px;
|
||||
cursor: pointer;
|
||||
height: 291px;
|
||||
background: url("~@/assets/enterpriseArchives/cardBg.png") no-repeat;
|
||||
.cardListHead {
|
||||
height: 39px;
|
||||
z-index: 99;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
background: url(data:image/png;base64,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) no-repeat;
|
||||
width: 382px;
|
||||
}
|
||||
.cardListHead span{
|
||||
color: #FFFFFF;
|
||||
display: inline-block;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.cardListBody{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 200px;
|
||||
justify-content: center;
|
||||
}
|
||||
.bodySign {
|
||||
width: 95%;
|
||||
// background: url("~@/assets/enterpriseArchives/build.jpg") no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
.sign {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
.impBtnList {
|
||||
height: 40px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap; //禁止换行
|
||||
.cardListBody {
|
||||
width: 20vw;
|
||||
display: flex;
|
||||
height: 200px;
|
||||
justify-content: center;
|
||||
}
|
||||
.bodySign {
|
||||
width: 95%;
|
||||
// background: url("~@/assets/enterpriseArchives/build.jpg") no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
.sign {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
.impBtnList {
|
||||
height: 40px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap; //禁止换行
|
||||
|
||||
text-overflow: ellipsis; //...
|
||||
//margin-bottom: 5px;
|
||||
text-overflow: ellipsis; //...
|
||||
//margin-bottom: 5px;
|
||||
|
||||
.shewei {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #b5ebff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.shewei {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #b5ebff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.zhongdian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11222221.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.zhongdian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11222221.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.zhibao {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 10.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.zhibao {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 10.png")
|
||||
no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.zhian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 21.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.signGreen{
|
||||
font-size: 14px;
|
||||
background: url("~@/assets/enterpriseArchives/signGreen.png") no-repeat;
|
||||
}
|
||||
.signRed{
|
||||
background: url("~@/assets/enterpriseArchives/signRed.png") no-repeat;
|
||||
}.signBlue{
|
||||
background: url("~@/assets/enterpriseArchives/signBlue.png") no-repeat;
|
||||
background-size: cover;
|
||||
padding: 3px;
|
||||
padding-left: 6px;
|
||||
padding-right: 6px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.zhian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: auto;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 21.png")
|
||||
no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.cardListFoot{
|
||||
color: #fff;
|
||||
padding: 0 10px 0 10px;
|
||||
margin-top: 5px;
|
||||
.address{
|
||||
font-size: 14px;
|
||||
margin-top: 4px;
|
||||
img{
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
.signGreen {
|
||||
font-size: 14px;
|
||||
background: url("~@/assets/enterpriseArchives/signGreen.png")
|
||||
no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
::v-deep .el-descriptions{
|
||||
width: 80%!important;
|
||||
.signRed {
|
||||
background: url("~@/assets/enterpriseArchives/signRed.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
::v-deep .el-descriptions__body{
|
||||
color: #fff;
|
||||
background-color: transparent!important;
|
||||
.signBlue {
|
||||
background: url("~@/assets/enterpriseArchives/signBlue.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-size: cover;
|
||||
padding: 3px;
|
||||
padding-left: 6px;
|
||||
padding-right: 6px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
}
|
||||
::v-deep .el-descriptions-item__cell{
|
||||
padding-bottom: 3px!important;
|
||||
}
|
||||
}
|
||||
.cardListFoot {
|
||||
color: #fff;
|
||||
padding: 0 10px 0 10px;
|
||||
margin-top: 5px;
|
||||
.address {
|
||||
font-size: 14px;
|
||||
margin-top: 4px;
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .el-descriptions {
|
||||
width: 80% !important;
|
||||
}
|
||||
::v-deep .el-descriptions__body {
|
||||
color: #fff;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
::v-deep .el-descriptions-item__cell {
|
||||
padding-bottom: 3px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<div class="card_box">
|
||||
<div
|
||||
class="card_box_item"
|
||||
v-for="(i, index) in cardList"
|
||||
:key="index"
|
||||
@click="change_item(i)"
|
||||
>
|
||||
<!-- 盒子头部企业公司名 -->
|
||||
<div class="card_head" :title="i.companyName">
|
||||
{{ i.companyName }}
|
||||
</div>
|
||||
<!-- 企业图片展示区域 -->
|
||||
<div class="card_company">
|
||||
<img :src="i.picUrl" alt="" @error="setDefaultImage" />
|
||||
<!-- 企业类型标签 -->
|
||||
<div class="company_type">
|
||||
<div
|
||||
:class="{
|
||||
shewei: val == '剧毒' || val == '易制毒',
|
||||
zhongdian: val == '消防重点' || val == '所管消防',
|
||||
zhibao: val == '放射源' || val == '易制爆',
|
||||
zhian:
|
||||
val == '治安重点' || val == '创安单位' || val == '外资合资',
|
||||
}"
|
||||
v-for="(val, index) in i.companyTypes"
|
||||
:key="index"
|
||||
>
|
||||
{{ val }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 企业信息展示 -->
|
||||
<div class="card_text">
|
||||
<el-descriptions class="margin-top" :column="2">
|
||||
<el-descriptions-item label="企业员工"
|
||||
>{{ i.staffCount || 0 }} 人</el-descriptions-item
|
||||
>
|
||||
<el-descriptions-item label="是否有过处罚">
|
||||
<span v-if="i.caseCount == 13">是</span>
|
||||
<span v-else>否</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="企业安全责任人电话">{{
|
||||
i.emergencyContactPhone
|
||||
}}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="address">
|
||||
<i class="el-icon-location-outline"></i>
|
||||
<span>{{ i.companyAddress }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import defaultImage from "@/assets/companyFile/default.png";
|
||||
export default {
|
||||
props: {
|
||||
// 公司相关详情数据
|
||||
cardList: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cardListArr: [],
|
||||
massage_title: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
setDefaultImage(e) {
|
||||
// 加载失败默认图片
|
||||
e.target.src = defaultImage;
|
||||
},
|
||||
// 跳转公司详情页
|
||||
change_item(val) {
|
||||
sessionStorage.setItem("companyID", val.id);
|
||||
sessionStorage.setItem("companyName", val.companyName);
|
||||
this.$router.push({
|
||||
name: "archives",
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.card_box {
|
||||
width: 76vw;
|
||||
height: 58vh;
|
||||
margin-top: 2vh;
|
||||
margin-left: 12vw;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
.card_box_item {
|
||||
width: 17.5vw;
|
||||
height: 27vh;
|
||||
margin-top: 1vh;
|
||||
margin-left: 1.2vw;
|
||||
background: url("~@/assets/enterpriseArchives/cardBg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
.card_head {
|
||||
width: 17.5vw;
|
||||
height: 4vh;
|
||||
background: url("~@/assets/enterpriseArchives/cardTitle.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: aliceblue;
|
||||
text-align: center;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.card_company {
|
||||
width: 17.5vw;
|
||||
height: 15vh;
|
||||
position: relative;
|
||||
img {
|
||||
width: 17.5vw;
|
||||
height: 15vh;
|
||||
}
|
||||
.company_type {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
left: 10px;
|
||||
width: 16.4vw;
|
||||
bottom: 5px;
|
||||
background: #161325;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
.shewei {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: 60px;
|
||||
background: url("~@/assets/companyFile/编组 11991.png") no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #b5ebff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zhongdian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: 80px;
|
||||
background: url("~@/assets/companyFile/编组 11222221.png") no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zhibao {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: 60px;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 10.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zhian {
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
width: 80px;
|
||||
background: url("~@/assets/companyFile/编组 11991备份 21.png")
|
||||
no-repeat;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #e3deff;
|
||||
letter-spacing: 0.44px;
|
||||
font-weight: 400;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card_text {
|
||||
margin-left: 0.5vw;
|
||||
width: 17vw;
|
||||
height: 8vh;
|
||||
color: #fff;
|
||||
.address {
|
||||
font-size: 14px;
|
||||
margin-top: 4px;
|
||||
height: 2vh;
|
||||
line-height: 2vh;
|
||||
}
|
||||
}
|
||||
::v-deep .el-descriptions {
|
||||
width: 80% !important;
|
||||
}
|
||||
::v-deep .el-descriptions__body {
|
||||
color: #fff;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
::v-deep .el-descriptions-item__cell {
|
||||
padding-bottom: 3px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,266 +1,295 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="searchMain" v-show="!isShow">
|
||||
<div class="searchBox">
|
||||
<div class="searchBody" >
|
||||
<div class="topLogo">
|
||||
<img src="../../assets/companyFile/档案981.png" alt="">
|
||||
企业档案
|
||||
</div>
|
||||
<div class="totalNum">
|
||||
<span>共有</span><i class="numItem" v-for="(item, index) in numList" :key="index">{{ item
|
||||
}}</i><span>家企业</span>
|
||||
</div>
|
||||
<div class="zhcxBox"><input type="text" class="zhcxBoxIPT" placeholder="请输入企业名称/员工姓名/车牌号检索"
|
||||
v-model.trim="searchVal">
|
||||
<el-button type="primary" icon="el-icon-search" class="ssBtn" @click="showResult(searchVal)"><span>搜索</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="zjssBox">
|
||||
<span style="color: #37FDC7;">最近搜索 </span>
|
||||
<div class="ssgs" v-for="(item, index) in historyList" :key="index"><span class="hisSpan" @click="showResult(item)">{{
|
||||
item }}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="searchMain" v-show="!isShow">
|
||||
<div class="searchBox">
|
||||
<div class="searchBody">
|
||||
<div class="topLogo">
|
||||
<img src="../../assets/companyFile/档案981.png" alt="" />
|
||||
企业档案
|
||||
</div>
|
||||
<div class="totalNum">
|
||||
<span>共有</span
|
||||
><i class="numItem" v-for="(item, index) in numList" :key="index">{{
|
||||
item
|
||||
}}</i
|
||||
><span>家企业</span>
|
||||
</div>
|
||||
<div class="zhcxBox">
|
||||
<input
|
||||
type="text"
|
||||
class="zhcxBoxIPT"
|
||||
placeholder="请输入企业名称/员工姓名/车牌号检索"
|
||||
v-model.trim="searchVal"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
class="ssBtn"
|
||||
@click="showResult(searchVal)"
|
||||
><span>搜索</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="zjssBox">
|
||||
<span style="color: #37fdc7">最近搜索 </span>
|
||||
<div class="ssgs" v-for="(item, index) in historyList" :key="index">
|
||||
<span class="hisSpan" @click="showResult(item)">{{ item }}</span>
|
||||
</div>
|
||||
<card :cardList="cardList"></card>
|
||||
</div>
|
||||
</div>
|
||||
<result :searchVal="searchVal" :total="total" :historyList="historyList" :resultList="resultList"
|
||||
@clearInput="clearInput()" v-if="isShow">
|
||||
</result>
|
||||
</div>
|
||||
<!-- <card :cardList="cardList"></card> -->
|
||||
<CardBox ref="cardBox" :cardList="cardList"></CardBox>
|
||||
</div>
|
||||
<result
|
||||
:searchVal="searchVal"
|
||||
:total="total"
|
||||
:historyList="historyList"
|
||||
:resultList="resultList"
|
||||
@clearInput="clearInput()"
|
||||
v-if="isShow"
|
||||
>
|
||||
</result>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import result from './result.vue'
|
||||
import card from './componets/card.vue'
|
||||
import { listTotal, historyList, searchList,cardLists } from '@/api/enterpriseArchives'
|
||||
import result from "./result.vue";
|
||||
import CardBox from "./componets/cardBox"
|
||||
// import card from "./componets/card.vue";
|
||||
import {
|
||||
listTotal,
|
||||
historyList,
|
||||
searchList,
|
||||
cardLists,
|
||||
} from "@/api/enterpriseArchives";
|
||||
export default {
|
||||
components: {
|
||||
result,
|
||||
card
|
||||
components: {
|
||||
result,
|
||||
// card,
|
||||
CardBox
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cardList: [],
|
||||
numList: [],
|
||||
totalNum: "",
|
||||
searchVal: "",
|
||||
isShow: false,
|
||||
resultList: [],
|
||||
historyList: [],
|
||||
resultList1: [],
|
||||
total: 0,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getlistTotal();
|
||||
this.gethistoryList();
|
||||
this.resultList1 = JSON.parse(JSON.stringify(this.resultList));
|
||||
},
|
||||
mounted() {
|
||||
this.getCardList();
|
||||
},
|
||||
methods: {
|
||||
getCardList() {
|
||||
//卡片列表
|
||||
this.cardList = [];
|
||||
cardLists().then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.cardList = res.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cardList:[],
|
||||
numList: [],
|
||||
totalNum: '',
|
||||
searchVal: '',
|
||||
isShow: false,
|
||||
resultList: [],
|
||||
historyList: [],
|
||||
resultList1: [],
|
||||
total: 0,
|
||||
showResult(val) {
|
||||
if (!val) {
|
||||
this.$message.warning("请输入要查询的关键词");
|
||||
return;
|
||||
}
|
||||
this.searchVal = val;
|
||||
searchList({ searchValue: val }).then((res) => {
|
||||
if (res.total || res.data.length) {
|
||||
this.resultList = res.data;
|
||||
this.total = res.total;
|
||||
this.isShow = true;
|
||||
} else {
|
||||
this.$message.warning("未查询到相关数据");
|
||||
}
|
||||
});
|
||||
},
|
||||
created() {
|
||||
this.getlistTotal()
|
||||
this.gethistoryList()
|
||||
this.resultList1 = JSON.parse(JSON.stringify(this.resultList))
|
||||
|
||||
clearInput() {
|
||||
this.resultList = JSON.parse(JSON.stringify(this.resultList1));
|
||||
this.isShow = false;
|
||||
this.gethistoryList();
|
||||
this.getCardList();
|
||||
},
|
||||
mounted(){
|
||||
this.getCardList()
|
||||
getlistTotal() {
|
||||
listTotal().then((res) => {
|
||||
this.totalNum = res.data;
|
||||
this.numList = this.totalNum.toString().split("");
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
getCardList(){//卡片列表
|
||||
this.cardList = []
|
||||
cardLists().then((res) => {
|
||||
if(res.code == 200) {
|
||||
this.cardList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
showResult(val) {
|
||||
if (!val) {
|
||||
this.$message.warning('请输入要查询的关键词')
|
||||
return
|
||||
}
|
||||
this.searchVal = val
|
||||
searchList({ searchValue: val }).then(res => {
|
||||
if (res.total || res.data.length) {
|
||||
this.resultList = res.data
|
||||
this.total = res.total
|
||||
this.isShow = true
|
||||
} else {
|
||||
this.$message.warning('未查询到相关数据')
|
||||
}
|
||||
})
|
||||
},
|
||||
clearInput() {
|
||||
this.resultList = JSON.parse(JSON.stringify(this.resultList1))
|
||||
this.isShow = false
|
||||
this.gethistoryList()
|
||||
this.getCardList()
|
||||
},
|
||||
getlistTotal() {
|
||||
listTotal().then((res) => {
|
||||
this.totalNum = res.data
|
||||
this.numList = this.totalNum.toString().split('')
|
||||
})
|
||||
},
|
||||
gethistoryList() {
|
||||
historyList().then((res) => {
|
||||
this.historyList = res.data
|
||||
this.historyList = this.historyList.filter((item, index) => {
|
||||
if (index < 5) {
|
||||
return item
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
gethistoryList() {
|
||||
historyList().then((res) => {
|
||||
this.historyList = res.data;
|
||||
this.historyList = this.historyList.filter((item, index) => {
|
||||
if (index < 5) {
|
||||
return item;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.main {
|
||||
width: 100%;
|
||||
height: calc(100% - 80px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/.el-scrollbar__view {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/deep/.el-scrollbar__wrap {
|
||||
margin: 0;
|
||||
}
|
||||
.searchMain {
|
||||
width: 100%;
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
.searchBox {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
.searchBody {
|
||||
width: 1050px;
|
||||
height: 28vh;
|
||||
// margin-top: 160px;
|
||||
margin-top: 20px;
|
||||
// border: 0.1px solid #495e70;
|
||||
// border-bottom: 1px solid #6C8097;
|
||||
|
||||
/deep/.el-scrollbar__view {
|
||||
padding: 0
|
||||
}
|
||||
.topLogo {
|
||||
width: 260px;
|
||||
height: 5vh;
|
||||
margin: 0 auto;
|
||||
font-size: 36px;
|
||||
color: aliceblue;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
letter-spacing: 5px;
|
||||
|
||||
/deep/.el-scrollbar__wrap {
|
||||
margin: 0;
|
||||
img {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.searchMain {
|
||||
width: 100%;
|
||||
}
|
||||
.searchBox {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
.searchBody {
|
||||
width: 1050px;
|
||||
height: 320px;
|
||||
// margin-top: 160px;
|
||||
margin-top: 60px;
|
||||
// border-bottom: 1px solid #6C8097;
|
||||
}
|
||||
.totalNum {
|
||||
margin-top: 2.5vh;
|
||||
width: 100%;
|
||||
height: 5vh;
|
||||
color: rgba(248, 251, 255, 0.7);
|
||||
|
||||
.topLogo {
|
||||
width: 260px;
|
||||
height: 50px;
|
||||
margin: 0 auto;
|
||||
font-size: 36px;
|
||||
color: aliceblue;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
letter-spacing: 5px;
|
||||
font-size: 22px;
|
||||
word-spacing: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
letter-spacing: 10px;
|
||||
|
||||
img {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.numItem {
|
||||
width: 25px;
|
||||
height: 40px;
|
||||
display: inline-block;
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
rgba(234, 241, 248, 0.1) 0%,
|
||||
rgba(208, 222, 238, 0.1) 100%
|
||||
);
|
||||
border: 1px solid #33cccc;
|
||||
font-family: DS-Digital-Bold;
|
||||
font-size: 40px;
|
||||
color: rgba(248, 251, 255, 0.89);
|
||||
text-align: center;
|
||||
line-height: 38px;
|
||||
text-shadow: 0 0 8px rgba(44, 254, 211, 0.69);
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
margin-right: 10px;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
.totalNum {
|
||||
margin-top: 30px;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
color: rgba(248, 251, 255, 0.7);
|
||||
}
|
||||
|
||||
font-size: 22px;
|
||||
word-spacing: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
letter-spacing: 10px;
|
||||
.zhcxBox {
|
||||
width: 100%;
|
||||
height: 54px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
|
||||
.numItem {
|
||||
width: 25px;
|
||||
height: 40px;
|
||||
display: inline-block;
|
||||
background-image: linear-gradient(180deg, rgba(234, 241, 248, 0.10) 0%, rgba(208, 222, 238, 0.10) 100%);
|
||||
border: 1px solid #33CCCC;
|
||||
font-family: DS-Digital-Bold;
|
||||
font-size: 40px;
|
||||
color: rgba(248, 251, 255, 0.89);
|
||||
text-align: center;
|
||||
line-height: 38px;
|
||||
text-shadow: 0 0 8px rgba(44, 254, 211, 0.69);
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
margin-right: 10px;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
.zhcxBoxIPT {
|
||||
height: 100%;
|
||||
width: 900px;
|
||||
font-size: 20px;
|
||||
background: #121a18;
|
||||
border: 1px solid rgba(108, 128, 151, 0.7);
|
||||
border-radius: 4px;
|
||||
font-size: 18px;
|
||||
color: #f8fbff;
|
||||
letter-spacing: 1.29px;
|
||||
line-height: 16px;
|
||||
font-weight: 400;
|
||||
opacity: 0.95;
|
||||
}
|
||||
|
||||
.zhcxBox {
|
||||
width: 100%;
|
||||
height: 54px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
|
||||
.zhcxBoxIPT {
|
||||
height: 100%;
|
||||
width: 900px;
|
||||
font-size: 20px;
|
||||
background: #121A18;
|
||||
border: 1px solid rgba(108, 128, 151, 0.7);
|
||||
border-radius: 4px;
|
||||
font-size: 18px;
|
||||
color: #F8FBFF;
|
||||
letter-spacing: 1.29px;
|
||||
line-height: 16px;
|
||||
font-weight: 400;
|
||||
opacity: 0.95;
|
||||
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus {
|
||||
|
||||
outline: none;
|
||||
|
||||
}
|
||||
|
||||
.ssBtn {
|
||||
margin-left: 20px;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 100px;
|
||||
color: #eee;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
background: url('~@/assets/companyFile/2121.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
input:focus,
|
||||
textarea:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.zjssBox {
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
color: rgba(208, 222, 238, 0.7);
|
||||
letter-spacing: 1px;
|
||||
line-height: 12px;
|
||||
font-weight: 400;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.ssBtn {
|
||||
margin-left: 20px;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 100px;
|
||||
color: #eee;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
background: url("~@/assets/companyFile/2121.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.ssgs {
|
||||
margin-left: 10px;
|
||||
height: 28px;
|
||||
border-radius: 2px;
|
||||
width: auto;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
// background: url('~@/assets/companyFile/矩形.png') no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
.hisSpan {
|
||||
padding: 0px 7px 0px 7px;
|
||||
}
|
||||
.zjssBox {
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
color: rgba(208, 222, 238, 0.7);
|
||||
letter-spacing: 1px;
|
||||
line-height: 12px;
|
||||
font-weight: 400;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.ssgs {
|
||||
margin-left: 10px;
|
||||
height: 28px;
|
||||
border-radius: 2px;
|
||||
width: auto;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
// background: url('~@/assets/companyFile/矩形.png') no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
.hisSpan {
|
||||
padding: 0px 7px 0px 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue