remilia/jinshen-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature: 新增界面-公司简介

Browse Source
This commit is contained in:
R2m1liA
2025-08-18 17:16:35 +08:00
parent bf19fc9d35
commit 6d405b5367
6 changed files with 118 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
app/pages/productions/example.vue
View File

@ -1,95 +0,0 @@
<template>
<div class="production-detail">
<div>
<el-breadcrumb class="breadcrumb" separator="/">
<el-breadcrumb-item class="text-sm" :to="{ path: '/' }">
{{ $t('navigation.home') }}
</el-breadcrumb-item>
<el-breadcrumb-item class="text-sm" :to="{ path: '/' }">
{{ $t('productions') }}
</el-breadcrumb-item>
<el-breadcrumb-item class="text-sm" :to="{ path: '/' }">
示例
</el-breadcrumb-item>
</el-breadcrumb>
<div class="production-header">
<div class="production-image">
<el-empty description="产品图片" class="border" />
</div>
<div class="production-info">
<h1>产品名称</h1>
<p class="summary">产品描述...</p>
</div>
</div>
<div class="production-content">
<el-tabs v-model="activeName" class="production-tabs">
<el-tab-pane label="产品详情" name="details">
<p>这里是产品的详细描述内容...</p>
</el-tab-pane>
<el-tab-pane label="技术规格" name="specs">
<p>这里是产品的技术规格内容...</p>
</el-tab-pane>
<el-tab-pane label="常见问题" name="faq">
<p>这里是产品的常见问题内容...</p>
</el-tab-pane>
<el-tab-pane label="相关资料" name="resources">
<p>这里是产品的相关资料内容...</p>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</template>
<script setup lang="ts">
const activeName = ref('details')
</script>
<style scoped lang="scss">
.production-detail {
min-height: 60vh;
}
.breadcrumb {
padding: 0rem 1rem;
margin-bottom: 2rem;
}
.breadcrumb-item {
color: var(--el-color-info);
}
.production-header {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
margin-bottom: 3rem;
}
.production-image .el-empty {
width: 100%;
height: 400px;
border-radius: 8px;
}
.production-info h1 {
color: var(--el-color-text);
margin-top: 2rem;
margin-bottom: 1rem;
font-size: 2rem;
}
.production-info p {
color: var(--el-color-info);
font-size: 1rem;
line-height: 1.6;
margin-bottom: 2rem;
}
.el-tab-pane {
margin-top: 1rem;
}
</style>