You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

309 lines
8.8 KiB

<template>
<div class="basic-detail">
<div class="basic-header">
<div class="header-wrap">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/enterpriseInformation' }"
>企业信息</el-breadcrumb-item
>
<el-breadcrumb-item>企业信息详情</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div>
<div class="basic-main">
<div class="main-wrap">
<div class="basicinfo" style="margin-bottom: 20px;">
<descriptionsEnterpriseTable />
</div>
<div class="tabs-wrap">
<el-tabs
type="border-card"
v-model="activeName"
@tab-click="handleClick"
class="tabs"
>
<!-- <el-tab-pane label="企业基本信息" name="basic"></el-tab-pane> -->
<el-tab-pane
v-for="item in tabsOption"
:key="item.name"
:label="item.label"
:name="item.name"
>
<div slot="label" class="tab-label">
<img
:src="activeName == item.name ? item.atImg : item.normalImg"
alt=""
style="width: 24px;
height: 24px; margin-right: 10px;"
/>
<span>{{ item.label }}</span>
</div>
</el-tab-pane>
<!-- <el-tab-pane label="人员信息" name="personal"></el-tab-pane>
<el-tab-pane label="项目业绩" name="proAchievement"></el-tab-pane>
<el-tab-pane label="工程获奖" name="projectAward"></el-tab-pane>
<el-tab-pane label="动态信用" name="credit"></el-tab-pane> -->
</el-tabs>
<div class="descriptions-wrap">
<descriptionsEnterpriseTable v-if="activeName == 'basic'" />
<qualificationTable v-else-if="activeName == 'qualification'" />
<personalTable v-else-if="activeName == 'personal'" />
<proAchievementTable v-else-if="activeName == 'proAchievement'" />
<projectAwardTable v-else-if="activeName == 'projectAward'" />
<div v-else-if="activeName == 'credit'">
<realTimeCredit />
<actionList :title="'良好行为列表'" />
<actionList :title="'不良行为列表'" />
</div>
</div>
<!-- <div class="real-time" v-if="activeName == 'basic'">
<realTimeCredit />
</div> -->
</div>
<div v-if="activeName == 'basic'">
<!-- <actionList
:title="'良好行为列表'"
:tableData="goodList"
:total="goodTotal"
@getGoodResult="getCreditList"
/>
<actionList
:title="'不良行为列表'"
:tableData="badList"
:total="badTotal"
@getBadResult="getCreditBadList"
/> -->
<actionList :title="'良好行为列表'" />
<actionList :title="'不良行为列表'" />
</div>
</div>
</div>
</div>
</template>
<script>
import { creditList } from "@/api/enterpriseInformation";
import descriptionsEnterpriseTable from "./components/descriptionsEnterpriseTable";
import qualificationTable from "./components/qualificationTable";
import personalTable from "./components/personalTable";
import proAchievementTable from "./components/proAchievementTable";
import projectAwardTable from "./components/projectAwardTable";
import realTimeCredit from "./components/realTimeCredit";
import actionList from "./components/actionList";
import { enterpriseInfo } from "../../api/enterpriseInformation";
export default {
components: {
descriptionsEnterpriseTable,
qualificationTable,
personalTable,
proAchievementTable,
projectAwardTable,
realTimeCredit,
actionList
},
data() {
return {
activeName: "qualification",
tabsOption: [
{
label: "资质信息",
name: "qualification",
atImg: require("@/assets/image/资质信息_at.png"),
normalImg: require("@/assets/image/资质信息.png")
},
{
label: "人员信息",
name: "personal",
atImg: require("@/assets/image/人员信息_at.png"),
normalImg: require("@/assets/image/人员信息.png")
},
{
label: "项目业绩",
name: "proAchievement",
atImg: require("@/assets/image/项目业绩_at.png"),
normalImg: require("@/assets/image/项目业绩.png")
},
{
label: "工程获奖",
name: "projectAward",
atImg: require("@/assets/image/工程获奖_at.png"),
normalImg: require("@/assets/image/工程获奖.png")
},
{
label: "动态信用",
name: "credit",
atImg: require("@/assets/image/动态信用_at.png"),
normalImg: require("@/assets/image/动态信用.png")
}
]
// enterpriseGoodForm: {
// pageNum: 1,
// pageSize: 10,
// data: {
// enterpriseId: "",
// type: "1"
// }
// },
// goodList: [],
// goodTotal: 0,
// enterpriseBadForm: {
// pageNum: 1,
// pageSize: 10,
// data: {
// enterpriseId: "",
// type: "0"
// }
// },
// badList: [],
// badTotal: 0
};
},
created() {
if (this.$route.query.type == "zizhi") {
this.activeName = "qualification";
}
},
mounted() {
// this.enterpriseGoodForm.data.enterpriseId = this.$route.query.enterpriseId;
// this.enterpriseBadForm.data.enterpriseId = this.$route.query.enterpriseId;
// this.getCreditList();
// this.getCreditBadList();
},
methods: {
// getCreditList() {
// creditList(this.enterpriseGoodForm).then(res => {
// this.goodList = res.data.records;
// console.log("this.goodList", res);
// this.goodTotal = res.data.total;
// });
// },
// getCreditBadList() {
// creditList(this.enterpriseBadForm).then(res => {
// this.badList = res.data.records;
// console.log("this.badList", res);
// this.badTotal = res.data.total;
// });
// },
handleClick(tab, event) {
// console.log(tab, event);
}
}
};
</script>
<style lang="less" scoped>
.basic-detail {
.basic-header {
height: 40px;
background: #ebf4fe;
.header-wrap {
width: 1200px;
margin: 0 auto;
display: flex;
align-items: center;
/deep/.el-breadcrumb {
margin-top: 10px;
.el-breadcrumb__item {
.el-breadcrumb__inner {
font-size: 16px;
color: #005eb7 !important;
}
.el-breadcrumb__separator {
font-size: 16px;
color: #005eb7 !important;
}
}
}
}
}
.basic-main {
background: linear-gradient(180deg, #005eb7 0%, #edf7ff 60% #edf7ff 100%);
padding: 20px 0;
.main-wrap {
width: 1200px;
margin: 0 auto;
// background: #ffffff;
border-radius: 8px;
overflow: hidden;
.tabs-wrap {
// padding: 20px;
background-color: #ffffff;
border-radius: 8px;
overflow: hidden;
}
/deep/.tabs {
.el-tabs__header {
// border-bottom-color: #c8dff8;
border-color: transparent;
}
.el-tabs__nav-wrap {
// height: 50px;
// padding-left: 5px;
.el-tabs__nav {
width: 100%;
display: flex;
}
.el-tabs__item {
flex: 1;
height: 50px;
font-size: 14px;
font-weight: 600;
color: #333333;
padding-top: 5px;
text-align: center;
// margin-top: 5px;
// margin-left: 1px;
// padding-left: 20px;
// padding-right: 20px;
// margin-right: 18px;
}
}
.el-tabs__item.is-active {
// padding-left: 35px;
// padding-right: 35px;
color: #005eb7;
border-right-color: #dadce3;
border-left-color: #dadce3;
border-top-color: #dadce3;
// border-bottom: 0px solid red;
// border-radius: 8px 8px 0px 0px;
}
.el-tabs__content {
padding: 0px;
}
.tab-label {
display: flex;
align-items: center;
justify-content: center;
}
}
/deep/.el-tabs--border-card {
border: none;
box-shadow: none;
}
.descriptions-wrap {
padding: 20px;
}
}
}
}
</style>