主体库

This commit is contained in:
cwchen 2025-10-20 18:29:12 +08:00
parent 244bb647c3
commit c74a8b54f8
13 changed files with 550 additions and 3 deletions

View File

@ -45,6 +45,7 @@
"sm-crypto": "^0.3.13",
"sortablejs": "1.10.2",
"splitpanes": "2.4.1",
"v-viewer": "^1.7.4",
"vue": "2.6.12",
"vue-count-to": "1.0.13",
"vue-cropper": "0.5.5",

View File

@ -15,6 +15,7 @@
height: 100%;
margin: 0px;
padding: 0px;
font-family: Source Han Sans CN, Source Han Sans CN;
}
.chromeframe {
margin: 0.2em 0;

View File

@ -35,6 +35,9 @@ import DictTag from '@/components/DictTag'
// 字典数据组件
import DictData from '@/components/DictData'
import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
@ -57,6 +60,7 @@ Vue.component('ImagePreview', ImagePreview)
import { getConfigKey } from '@/utils/systemConfig' // 引入get方法
Vue.use(directive)
Vue.use(plugins)
Vue.use(Viewer)
DictData.install()
/**

View File

@ -249,6 +249,20 @@ export const dynamicRoutes = [
meta: { title: '新增主体信息', activeMenu: '/enterpriseLibrary/enterprise', noCache: true }
}
]
},
{
path: '/EnterpriseDetail',
component: Layout,
hidden: true,
permissions: ['enterpriseLibrary:enterprise:detail'],
children: [
{
path: 'index',
component: () => import('@/views/enterpriseLibrary/enterprise/components/EnterpriseDetail'),
name: 'EnterpriseDetail',
meta: { title: '主体信息详情', activeMenu: '/enterpriseLibrary/enterprise', noCache: true }
}
]
}

View File

@ -0,0 +1,166 @@
<!-- 企业主体库表单 -->
<template>
<div class="app-container">
<div class="content-header">
<el-button class="reset-btn" @click="handleClose()">返回</el-button>
<!-- <el-button class="search-btn" @click="handleSave()">编辑</el-button> -->
</div>
<div class="content-body">
<el-row :gutter="24" class="content-row">
<!-- 基本信息 -->
<el-col :span="6" class="pane-left">
<BasicInfoDetail ref="basicInfoDetail" />
</el-col>
<!-- 法人信息 -->
<el-col :span="6" class="pane-center">
<LegalPersonDetail ref="legalPersonDetail" />
</el-col>
<!-- 开户证明 -->
<el-col :span="6" class="pane-right">
<AccountOpeningCertificateDetail ref="accountOpeningCertificateDetail" />
</el-col>
</el-row>
</div>
</div>
</template>
<script>
import { decryptWithSM4 } from '@/utils/sm'
import BasicInfoDetail from './child/BasicInfoDetail.vue'
import LegalPersonDetail from './child/LegalPersonDetail.vue'
import AccountOpeningCertificateDetail from './child/AccountOpeningCertificateDetail.vue'
export default {
name: 'EnterpriseDetail',
components: {
BasicInfoDetail,
LegalPersonDetail,
AccountOpeningCertificateDetail
},
data() {
return {
id: decryptWithSM4(this.$route.query.id),
type: decryptWithSM4(this.$route.query.type),
}
},
methods: {
//
handleClose() {
const obj = { path: "/enterpriseLibrary/enterprise" }
this.$tab.closeOpenPage(obj)
},
//
async handleSave() {
try {
//
const [basicInfoData, legalPersonData, accountData] = await Promise.all([
this.$refs.basicInfo.validate(),
this.$refs.legalPerson.validate(),
this.$refs.accountOpeningCertificate.validate()
])
//
const formData = {
...basicInfoData,
...legalPersonData,
...accountData
}
console.log('所有表单校验通过,完整数据:', formData)
//
// await this.saveEnterprise(formData)
this.$message.success('保存成功')
} catch (error) {
// console.error(':', error)
this.$message.error(error.message || '请完善表单信息')
}
}
}
}
</script>
<style scoped lang="scss">
.app-container {
padding: 24px;
background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
min-height: 100vh;
overflow-y: auto;
}
.content-body {
margin-top: 20px;
}
.content-row {
margin: 0;
display: flex;
flex-wrap: nowrap;
gap: 16px;
}
.pane-left,
.pane-center,
.pane-right {
background: #fff;
border-radius: 16px 16px 16px 16px;
min-height: 600px;
box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
// border: 1px solid #e8f4ff;
padding: 0;
margin-bottom: 20px;
flex: 1;
min-width: 0;
}
.content-header {
display: flex;
justify-content: flex-end;
align-items: center;
margin-bottom: 20px;
gap: 12px;
}
.search-btn {
background: #409EFF;
border-color: #409EFF;
color: #fff;
font-weight: 600;
padding: 12px 24px;
border-radius: 6px;
box-shadow: 0px 4px 12px 0px rgba(64, 158, 255, 0.4);
letter-spacing: 0.5px;
font-size: 14px;
transition: all 0.3s ease;
&:hover {
background: #66b1ff;
border-color: #66b1ff;
box-shadow: 0px 6px 16px 0px rgba(64, 158, 255, 0.5);
transform: translateY(-1px);
}
}
.reset-btn {
background: #fff;
border: 1px solid #dcdfe6;
color: #606266;
font-weight: 600;
padding: 12px 24px;
border-radius: 6px;
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
letter-spacing: 0.5px;
font-size: 14px;
transition: all 0.3s ease;
&:hover {
background: #f5f7fa;
border-color: #c0c4cc;
color: #409EFF;
box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.15);
transform: translateY(-1px);
}
}
</style>

View File

@ -84,7 +84,7 @@ export default {
.app-container {
padding: 24px;
background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
max-height: 100vh;
min-height: 100vh;
overflow-y: auto;
}

View File

@ -70,6 +70,7 @@ export default {
margin: 10px 0;
span{
margin: 0 5px;
font-size: 20px;
}
}
</style>

View File

@ -0,0 +1,96 @@
<template>
<div class="basic-info-detail">
<div class="basic-info-title">
<img src="@/assets/enterpriseLibrary/legalperson.png" alt="开户证明">
<span>开户证明</span>
</div>
<div class="detail-content">
<!-- 开户许可证 -->
<div class="detail-item">
<div class="item-label">开户许可证</div>
<div class="item-value">
<el-image :src="url" :preview-src-list="srcList" class="license-image">
</el-image>
</div>
</div>
<!-- 开户银行 -->
<div class="detail-item">
<div class="item-label">开户银行</div>
<div class="item-value">{{ enterpriseName || '中讯科技股份有限公司' }}</div>
</div>
<!-- 开户账号 -->
<div class="detail-item">
<div class="item-label">开户账号</div>
<div class="item-value">{{ enterpriseCode || '12345678901313132390' }}</div>
</div>
</div>
</div>
</template>
<script>
import UploadFile from '@/views/common/UploadFile.vue'
import basicInfo from '@/assets/enterpriseLibrary/basic-info.png'
export default {
name: 'AccountOpeningCertificateDetail',
components: {
UploadFile
},
data() {
return {
name: '',
enterpriseName: '',
url: basicInfo,
srcList: [basicInfo],
}
},
methods: {
//
},
}
</script>
<style scoped lang="scss">
.basic-info-title {
display: flex;
align-items: center;
margin: 10px 0;
span {
margin: 0 5px;
font-size: 20px;
}
}
.detail-content {
.detail-item {
margin-bottom: 16px;
.item-label {
color: #424242;
font-size: 18px;
font-weight: 500;
margin-bottom: 8px;
}
.item-value {
color: #424242;
font-size: 16px;
line-height: 1.5;
.license-image {
max-width: 200px;
max-height: 120px;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
object-fit: cover;
}
}
}
}
</style>

View File

@ -101,6 +101,7 @@ export default {
span {
margin: 0 5px;
font-size: 20px;
}
}
</style>

View File

@ -0,0 +1,128 @@
<template>
<div class="basic-info-detail">
<div class="basic-info-title">
<img src="@/assets/enterpriseLibrary/basic-info.png" alt="基本信息">
<span>基本信息</span>
</div>
<div class="detail-content">
<!-- 营业执照 -->
<div class="detail-item">
<div class="item-label">营业执照</div>
<div class="item-value">
<el-image :src="url" :preview-src-list="srcList" class="license-image">
</el-image>
</div>
</div>
<!-- 企业名称 -->
<div class="detail-item">
<div class="item-label">企业名称</div>
<div class="item-value">{{ enterpriseName || '中讯科技股份有限公司' }}</div>
</div>
<!-- 统一社会信用代码 -->
<div class="detail-item">
<div class="item-label">统一社会信用代码</div>
<div class="item-value">{{ enterpriseCode || '12345678901313132390' }}</div>
</div>
<!-- 注册资本 -->
<div class="detail-item">
<div class="item-label">注册资本</div>
<div class="item-value">{{ registeredCapital || '11000.00' }}</div>
</div>
<!-- 营业期限 -->
<div class="detail-item">
<div class="item-label">营业期限</div>
<div class="item-value">{{ businessTerm || '2015/01/01-2035/01/01' }}</div>
</div>
<!-- 住所 -->
<div class="detail-item">
<div class="item-label">住所</div>
<div class="item-value">{{ residence || '安徽省合肥市蜀山区望江西路100号' }}</div>
</div>
<!-- 经营范围 -->
<div class="detail-item">
<div class="item-label">经营范围</div>
<div class="item-value">{{ businessScope || '软件开发、技术服务、电子商务' }}</div>
</div>
</div>
<el-dialog title="营业执照" :visible.sync="showPhoto" width="60%" append-to-body>
<view-photo :images="images" />
</el-dialog>
</div>
</template>
<script>
import basicInfo from '@/assets/enterpriseLibrary/basic-info.png'
export default {
name: 'BasicInfoDetail',
components: {
},
data() {
return {
name: '',
url: basicInfo,
srcList: [basicInfo],
enterpriseName: '',
enterpriseCode: '',
registeredCapital: '',
businessTerm: '',
residence: '',
businessScope: '',
fileList: [],
showPhoto: false
}
},
methods: {
openPhoto() {
this.showPhoto = true
}
},
}
</script>
<style scoped lang="scss">
.basic-info-title {
display: flex;
align-items: center;
margin: 10px 0;
span {
margin: 0 5px;
font-size: 20px;
}
}
.detail-content {
.detail-item {
margin-bottom: 16px;
.item-label {
color: #424242;
font-size: 18px;
font-weight: 500;
margin-bottom: 8px;
}
.item-value {
color: #424242;
font-size: 16px;
line-height: 1.5;
.license-image {
max-width: 200px;
max-height: 120px;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
object-fit: cover;
cursor: pointer;
}
}
}
}
</style>

View File

@ -93,6 +93,7 @@ export default {
span {
margin: 0 5px;
font-size: 20px;
}
}
</style>

View File

@ -0,0 +1,124 @@
<template>
<div class="basic-info-detail">
<div class="basic-info-title">
<img src="@/assets/enterpriseLibrary/legalperson.png" alt="法人信息">
<span>法人信息</span>
</div>
<div class="detail-content">
<!-- 身份证人像面 -->
<div class="detail-item">
<div class="item-label">身份证人像面</div>
<div class="item-value">
<el-image :src="url" :preview-src-list="srcList" class="license-image">
</el-image>
</div>
</div>
<!-- 身份证国徽面 -->
<div class="detail-item">
<div class="item-label">身份证国徽面</div>
<div class="item-value">
<el-image :src="url" :preview-src-list="srcList" class="license-image">
</el-image>
</div>
</div>
<!-- 法人姓名 -->
<div class="detail-item">
<div class="item-label">法人姓名</div>
<div class="item-value">{{ enterpriseName || '中讯科技股份有限公司' }}</div>
</div>
<!-- 法人身份证号 -->
<div class="detail-item">
<div class="item-label">法人身份证号</div>
<div class="item-value">{{ enterpriseCode || '12345678901313132390' }}</div>
</div>
<!-- 身份证有效期 -->
<div class="detail-item">
<div class="item-label">身份证有效期</div>
<div class="item-value">{{ registeredCapital || '11000.00' }}</div>
</div>
<!-- 法人职务 -->
<div class="detail-item">
<div class="item-label">法人职务</div>
<div class="item-value">{{ businessTerm || '2015/01/01-2035/01/01' }}</div>
</div>
<!-- 法人联系方式 -->
<div class="detail-item">
<div class="item-label">法人联系方式</div>
<div class="item-value">{{ residence || '安徽省合肥市蜀山区望江西路100号' }}</div>
</div>
</div>
</div>
</template>
<script>
import UploadFile from '@/views/common/UploadFile.vue'
import basicInfo from '@/assets/enterpriseLibrary/basic-info.png'
export default {
name: 'LegalPersonDetail',
components: {
UploadFile
},
data() {
return {
name: '',
enterpriseName: '',
enterpriseCode: '',
registeredCapital: '',
businessTerm: '',
residence: '',
businessScope: '',
fileList: [],
url: basicInfo,
srcList: [basicInfo],
}
},
methods: {
},
}
</script>
<style scoped lang="scss">
.basic-info-title {
display: flex;
align-items: center;
margin: 10px 0;
span {
margin: 0 5px;
font-size: 20px;
}
}
.detail-content {
.detail-item {
margin-bottom: 16px;
.item-label {
color: #424242;
font-size: 18px;
font-weight: 500;
margin-bottom: 8px;
}
.item-value {
color: #424242;
font-size: 16px;
line-height: 1.5;
.license-image {
max-width: 200px;
max-height: 120px;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
object-fit: cover;
}
}
}
}
</style>

View File

@ -89,7 +89,7 @@
<img :src="EnterpriseKnowledge" alt="企业知识库" />
<span>企业知识库</span>
</div>
<div v-hasPermi="['enterpriseLibrary:enterprise:detail']">
<div v-hasPermi="['enterpriseLibrary:enterprise:detail']" @click="handleDetail(enterprise)">
<img :src="EnterpriseDetail" alt="详情" />
<span>详情</span>
</div>
@ -248,7 +248,6 @@ export default {
//
handleAdd() {
console.log('新增企业')
// this.$router.push('/enterpriseLibrary/enterprise/add')
this.$router.push({
name: 'EnterpriseForm',
query: {
@ -257,6 +256,17 @@ export default {
}
})
},
//
handleDetail(enterprise){
this.$router.push({
name: 'EnterpriseDetail',
query: {
type: encryptWithSM4('detail'),
id: encryptWithSM4(enterprise.id ?? '0'),
}
})
},
//
handleSizeChange(val) {