企业知识库
This commit is contained in:
parent
c74a8b54f8
commit
f264bc7fbf
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
|
|
@ -263,6 +263,20 @@ export const dynamicRoutes = [
|
|||
meta: { title: '主体信息详情', activeMenu: '/enterpriseLibrary/enterprise', noCache: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/EnterpriseKnowledge',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
permissions: ['enterpriseLibrary:enterprise:EnterpriseKnowledge'],
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/enterpriseLibrary/enterprise/components/EnterpriseKnowledge'),
|
||||
name: 'EnterpriseKnowledge',
|
||||
meta: { title: '企业知识库', activeMenu: '/enterpriseLibrary/enterprise', noCache: true }
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -284,5 +298,5 @@ export default new Router({
|
|||
mode: 'history', // 去掉url中的#
|
||||
scrollBehavior: () => ({ y: 0 }),
|
||||
routes: constantRoutes,
|
||||
base: process.env.VUE_APP_ENV === 'production'? '/smart-archiving': ''
|
||||
base: process.env.VUE_APP_ENV === 'production' ? '/smart-archiving' : ''
|
||||
})
|
||||
|
|
|
|||
|
|
@ -0,0 +1,306 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 返回按钮 -->
|
||||
<div class="back-container">
|
||||
<el-button type="default" size="small" @click="handleBack" class="back-btn">
|
||||
返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 知识库卡片网格 -->
|
||||
<div class="knowledge-grid">
|
||||
<!-- 业绩库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('performance')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="业绩库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">业绩库</h3>
|
||||
<p class="card-description">业绩库主要管理企业的项目业绩信息, 包括合同、验收报告、中标通知书等</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 人员库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('personnel')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="人员库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">人员库</h3>
|
||||
<p class="card-description">人员库主要管理企业的人员资质信息, 包括岗位、工作经验、员工证书等</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 资质库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('qualification')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="资质库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">资质库</h3>
|
||||
<p class="card-description">资质库主要管理企业的资质证书信息, 包括软著、专利、荣誉等</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 技术方案库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('technical')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="技术方案库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">技术方案库</h3>
|
||||
<p class="card-description">解决方案库主要用于管理企业内部技术方案、产品方案、项目方案等</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 工器具库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('tools')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="工器具库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">工器具库</h3>
|
||||
<p class="card-description">工器具库主要用于登记工器具资料信息, 统一管理工器具清单等</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 财务库 -->
|
||||
<div class="knowledge-card" @click="handleCardClick('financial')">
|
||||
<div class="card-icon">
|
||||
<img :src="enterpriseKnowledgeIcon" alt="财务库" />
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">财务库</h3>
|
||||
<p class="card-description">财务库主要管理企业的财务报告文档, 包括审计报告、年报等</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import enterpriseKnowledgeIcon from '@/assets/enterpriseLibrary/enterpriseKnowledgeIcon.png';
|
||||
|
||||
export default {
|
||||
name: 'EnterpriseKnowledge',
|
||||
data() {
|
||||
return {
|
||||
enterpriseId: this.$route.query.id,
|
||||
enterpriseKnowledgeIcon
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 返回上一页
|
||||
handleBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
|
||||
// 卡片点击事件
|
||||
handleCardClick(type) {
|
||||
console.log('点击了知识库类型:', type)
|
||||
// 这里可以根据不同类型跳转到不同的页面
|
||||
this.$message.info(`点击了${this.getCardTitle(type)}`)
|
||||
},
|
||||
|
||||
// 获取卡片标题
|
||||
getCardTitle(type) {
|
||||
const titles = {
|
||||
'performance': '业绩库',
|
||||
'personnel': '人员库',
|
||||
'qualification': '资质库',
|
||||
'technical': '技术方案库',
|
||||
'tools': '工器具库',
|
||||
'financial': '财务库'
|
||||
}
|
||||
return titles[type] || '未知'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.back-container {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-bottom: 30px;
|
||||
padding: 0 20px;
|
||||
|
||||
.back-btn {
|
||||
width: 98px;
|
||||
height: 36px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
background: #f5f5f5;
|
||||
color: #409EFF;
|
||||
box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.knowledge-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 16px;
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.knowledge-card {
|
||||
background: #fff;
|
||||
border: 1px solid #e8e8e8;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
transition: all 0.3s ease;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
text-align: left;
|
||||
min-height: 120px;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
|
||||
transform: translateY(-2px);
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.card-icon {
|
||||
background: transparent;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 16px;
|
||||
flex-shrink: 0;
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
|
||||
.card-content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin: 0 0 8px 0;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.card-description {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 响应式设计
|
||||
@media (max-width: 1400px) {
|
||||
.knowledge-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.knowledge-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.app-container {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.back-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.knowledge-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 12px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.knowledge-card {
|
||||
padding: 16px;
|
||||
min-height: 100px;
|
||||
|
||||
.card-icon {
|
||||
margin-right: 12px;
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.card-content {
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.card-description {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.knowledge-card {
|
||||
padding: 16px;
|
||||
min-height: 160px;
|
||||
|
||||
.card-icon {
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.card-content {
|
||||
.card-title {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.card-description {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -75,13 +75,10 @@ export default {
|
|||
residence: '',
|
||||
businessScope: '',
|
||||
fileList: [],
|
||||
showPhoto: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openPhoto() {
|
||||
this.showPhoto = true
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@
|
|||
|
||||
<!-- 操作按钮 -->
|
||||
<div class="enterprise-actions">
|
||||
<div>
|
||||
<div @click="handleEnterpriseKnowledge(enterprise)">
|
||||
<img :src="EnterpriseKnowledge" alt="企业知识库" />
|
||||
<span>企业知识库</span>
|
||||
</div>
|
||||
|
|
@ -256,6 +256,17 @@ export default {
|
|||
}
|
||||
})
|
||||
},
|
||||
// 企业知识库
|
||||
handleEnterpriseKnowledge(enterprise){
|
||||
this.$router.push({
|
||||
name: 'EnterpriseKnowledge',
|
||||
query: {
|
||||
type: encryptWithSM4('knowledge'),
|
||||
id: encryptWithSM4(enterprise.id ?? '0'),
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
// 详情
|
||||
handleDetail(enterprise){
|
||||
this.$router.push({
|
||||
|
|
@ -265,7 +276,6 @@ export default {
|
|||
id: encryptWithSM4(enterprise.id ?? '0'),
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
// 分页大小改变
|
||||
|
|
|
|||
Loading…
Reference in New Issue