xiu'gaixiugai

This commit is contained in:
wangting 2024-05-27 17:49:58 +08:00
parent c0cc4589a2
commit 24bc2dd04f
35 changed files with 360 additions and 62 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

BIN
src/assets/images/4545.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
src/assets/images/640.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

BIN
src/assets/images/back.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 710 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 337 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 866 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 354 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 830 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 430 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 185 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 200 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 147 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 67 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 143 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 576 B

View File

@ -17,7 +17,8 @@ import 'element-plus/dist/index.css'
const app = createApp(App) const app = createApp(App)
const baseUrl = 'https://admin.liandaojq.com/prod-api' // const baseUrl = 'https://admin.liandaojq.com/prod-api'
const baseUrl = 'http://192.168.3.114:80/dev-api'
axios.defaults.baseURL = baseUrl axios.defaults.baseURL = baseUrl
app.config.globalProperties.$http=axios app.config.globalProperties.$http=axios

View File

@ -65,6 +65,16 @@ const routes = [
title: '人才招聘', title: '人才招聘',
keepAlive: true keepAlive: true
} }
},
// 文章
{
path: 'article',
name: 'article',
component: () => import( '@/views/pages/article.vue'),
meta: {
title: '内容',
keepAlive: true
}
} }
] ]
}, },

View File

@ -15,10 +15,20 @@
</div> </div>
</div> </div>
<div class="main-img"> <div class="main-img">
<img src="@/assets/images/组 10.png" alt=""> <el-carousel height="8.5625rem">
<el-carousel-item v-for="item in imgList" :key="item">
<img :src="$baseUrl+item.path" alt="">
</el-carousel-item>
</el-carousel>
</div> </div>
</div> </div>
<router-view/> <!-- <router-view/> -->
<router-view v-slot="{ Component,route }">
<keep-alive>
<component :is="Component" v-if="route.meta.keepAlive==true" :key="route.path" />
</keep-alive>
<component :is="Component" v-if="route.meta.keepAlive==false" :key="route.path" />
</router-view>
<bottom></bottom> <bottom></bottom>
</div> </div>
</template> </template>
@ -32,6 +42,7 @@ export default {
}, },
data(){ data(){
return{ return{
imgList:[],
menuList:[ menuList:[
{ {
name: '主页', name: '主页',
@ -91,10 +102,17 @@ export default {
if(this.$route.path=='/'){ if(this.$route.path=='/'){
this.$router.push('/home') this.$router.push('/home')
} }
this.getImgs()
}, },
methods:{ methods:{
getImgs(){
this.$http.get(`zy/website/resources/selectByCategory?category=轮播图`).then(res=>{
this.imgList = res.data.data
console.log(this.imgList)
})
},
jumpTo(i){ jumpTo(i){
this.activeIndex = i this.activeIndex = i
this.$router.push({path: this.menuList[i].url}) this.$router.push({path: this.menuList[i].url})

View File

@ -0,0 +1,68 @@
<template>
<div class="container">
<div class="title">{{article.tittle}}</div>
<div class="time">发布时间 {{article.submitTime}}</div>
<div class="ql-editor content" v-html="article.content"></div>
<div class="back" @click="$router.go(-1)">
<img src="../../assets/images/back.png" alt="">
</div>
</div>
</template>
<script>
export default {
name: 'Top',
props: {
},
data(){
return {
article:{},
}
},
created(){
let id = this.$route.query.id
this.$http.get(`/zy/website/article/detail?id=${id}`).then(res=>{
this.article = res.data.data
this.article.content = this.article.content.replace(/<img/g,'<img style="width:13rem; height: auto;"')
})
},
methods:{
}
}
</script>
<style scoped lang="scss">
.content{
padding: .5rem 3.25rem;
font-size: .25rem;
color: #505050;
line-height: .6rem;
min-height: 800px;
img{
width: 100%;
height: auto;
}
}
.title{
font-size: .4rem;
font-weight: bold;
color: #333333;
text-align: center;
margin: .6rem 0 .375rem 0;
}
.time{
font-size: .225rem;
color: #666;
text-align: center;
}
.back{
position: fixed;
bottom: 3.75rem;
right: 1.25rem;
img{
width: 1.25rem;
height: auto;
}
}
</style>

View File

@ -11,22 +11,22 @@
</div> </div>
<div class="content"> <div class="content">
<div class="left"> <div class="left">
<img src="@/assets/images/15探海神龟.jpg" alt=""> <img :src="$baseUrl + introduce.img" alt="">
</div> </div>
<div class="right"> <div class="right">
<div class="indroduce"> <div class="indroduce">
江苏中业消防技术服务有限公司位于江苏省连云港市注册资本1000万元具备消防设施工程专业承包贰级建筑装修装饰工程专业承包贰级施工劳务不分等级资质同时具备建筑消防设施检测维保评估资质是一家集设计咨询消防技术咨询消防工程技术服务消防施工火灾隐患排查整治指导及消防设施维护保养检测安全评估为一体的综合性消防技术服务机构一直致力于消防领域的科学研究与社会消防技术服务实现品牌创造与效益双赢 {{introduce.excerpt}}
</div> </div>
<div class="menu"> <div class="menu">
<div class="item"> <div class="item" @click="jumpTo('/introduce',1)">
<img src="@/assets/images/企业介绍(1).png" alt=""> <img src="@/assets/images/企业介绍(1).png" alt="">
<span>公司介绍</span> <span>公司介绍</span>
</div> </div>
<div class="item"> <div class="item" @click="jumpTo('/introduce',2)">
<img src="@/assets/images/组织架构管理.png" alt=""> <img src="@/assets/images/组织架构管理.png" alt="">
<span>组织机构</span> <span>组织机构</span>
</div> </div>
<div class="item"> <div class="item" @click="jumpTo('/introduce',3)">
<img src="@/assets/images/资质.png" alt=""> <img src="@/assets/images/资质.png" alt="">
<span>资质证书</span> <span>资质证书</span>
</div> </div>
@ -66,15 +66,17 @@
</div> </div>
<div class="list"> <div class="list">
<div class="left"> <div class="left">
<div class="item" v-for="i in 5"> <div class="item" v-for="(item,i) in information" @click="jumpToArticle(item.id)">
<span class="title">中业消防获第一批成都工业精品认定</span> <span class="title" v-if="item.tittle.length<=34">{{item.tittle}}</span>
<span class="time">2019-2-13</span> <span class="title" v-else>{{item.tittle.slice(0,34)}}...</span>
<span class="time">{{item.submitTime}}</span>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<div class="item" v-for="i in 2"> <div class="item" v-for="(item,i) in information.slice(0,2)" @click="jumpToArticle(item.id)">
<img src="@/assets/images/15探海神龟.jpg" alt=""> <img :src="$baseUrl+item.img" alt="">
<div class="title">中业消防获第一批成都工业精品认定</div> <div class="title" v-if="item.tittle.length>20">{{item.tittle.slice(0,20)}}...</div>
<div class="title" v-else>{{item.tittle}}</div>
</div> </div>
</div> </div>
</div> </div>
@ -91,22 +93,60 @@
}, },
data(){ data(){
return{ return{
introduce:{},
activeIndexInfo: 0, activeIndexInfo: 0,
news:[],
dynamic:[],
statute:[],
information:[],
informationMenu:[ informationMenu:[
{name:'公司新闻'}, {name:'公司新闻'},
{name:'行业动态'}, {name:'行业动态'},
{name:'消防规范'} {name:'法规标准'}
] ],
queryParams:{
pageNum: 1,
pageSize: 5
},
} }
}, },
created(){ created(){
this.getIntroduce()
}, },
methods:{ methods:{
jumpTo(path,name){
this.$router.push({path: path,query:{name: name}})
},
jumpToArticle(id){
this.$router.push({path:'/article',query:{id: id}})
},
selectTab(i){ selectTab(i){
this.activeIndexInfo = i this.activeIndexInfo = i
if(i==0){
this.information = this.news
}
if(i==1){
this.information = this.dynamic
}
if(i==2){
this.information = this.statute
}
},
getIntroduce(){
this.$http.get(`zy/website/article/page?type=公司介绍`).then(res=>{
this.introduce = res.data.rows[0]
})
this.$http.get(`zy/website/article/page?type=公司新闻&pageNum=${this.queryParams.pageNum}&pageSize=${this.queryParams.pageSize}`).then(res=>{
this.news = res.data.rows
this.information = this.news
})
this.$http.get(`zy/website/article/page?type=行业动态&pageNum=${this.queryParams.pageNum}&pageSize=${this.queryParams.pageSize}`).then(res=>{
this.dynamic = res.data.rows
})
this.$http.get(`zy/website/article/page?type=法规标准&pageNum=${this.queryParams.pageNum}&pageSize=${this.queryParams.pageSize}`).then(res=>{
this.statute = res.data.rows
})
} }
} }
} }
@ -179,6 +219,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
cursor: pointer;
img{ img{
width: auto; width: auto;
height: .25rem; height: .25rem;
@ -269,6 +310,10 @@
font-size: .2rem; font-size: .2rem;
color: #282828; color: #282828;
border-bottom: .0125rem solid #DADADA; border-bottom: .0125rem solid #DADADA;
cursor: pointer;
&:hover{
color: #189eef;
}
&:last-child{ &:last-child{
border: none; border: none;
} }
@ -286,6 +331,11 @@
height: 3.2875rem; height: 3.2875rem;
margin-left: .4rem; margin-left: .4rem;
position: relative; position: relative;
&:hover{
.title{
color: #189eef;
}
}
img{ img{
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -299,6 +349,8 @@
color: #FFFFFF; color: #FFFFFF;
line-height: .475rem; line-height: .475rem;
bottom: 0; bottom: 0;
padding-left: .125rem;
text-align: left;
} }
} }
} }

View File

@ -1,9 +1,9 @@
<template> <template>
<div class="page"> <div class="page">
<div class="list"> <div class="list">
<div class="item" v-for="i in 5"> <div class="item" v-for="(item,i) in certificate">
<img src="@/assets/images/15探海神龟.jpg" alt=""> <img :src="$baseUrl+item.img" alt="">
<div class="title">安全生产许可证</div> <div class="title">{{item.tittle}}</div>
</div> </div>
</div> </div>
</div> </div>
@ -16,14 +16,19 @@
}, },
data(){ data(){
return{ return{
certificate:[]
} }
}, },
created(){ created(){
this.getData()
}, },
methods:{ methods:{
getData(){
this.$http.get(`zy/website/article/page?type=资质证书`).then(res=>{
this.certificate = res.data.rows
})
},
} }
} }
@ -45,7 +50,7 @@
margin-bottom: .375rem; margin-bottom: .375rem;
img{ img{
width: auto; width: auto;
height: 4rem; height: 3.75rem;
} }
.title{ .title{
margin-top: .125rem; margin-top: .125rem;

View File

@ -3,30 +3,39 @@
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="公司新闻" name="1"> <el-tab-pane label="公司新闻" name="1">
<div class="item-1"> <div class="item-1">
<div class="item" v-for="i in 9"> <div class="item" v-for="(item,i) in news" @click="jumpToArticle(item.id)">
<img src="@/assets/images/15探海神龟.jpg" alt=""> <img :src="$baseUrl+item.img" alt="">
<div class="info"> <div class="info">
<div class="title">新闻名称新闻标题长长的标题</div> <div class="title" v-if="item.tittle.length>18">{{item.tittle.slice(0,18)}}...</div>
<div class="time">2019-3-1</div> <div class="title" v-else>{{item.tittle}}.</div>
<div class="time">{{item.submitTime}}</div>
</div> </div>
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="行业动态" name="2"> <el-tab-pane label="行业动态" name="2">
<!-- <div class="item-2"> <div class="item-1">
<img src="@/assets/images/组 21 拷贝.png" alt=""> <div class="item" v-for="(item,i) in dynamic" @click="jumpToArticle(item.id)">
</div> --> <img :src="$baseUrl+item.img" alt="">
</el-tab-pane>
<el-tab-pane label="消防规范" name="3">
<!-- <div class="item-3">
<div class="item" v-for="i in 5">
<img src="@/assets/images/15探海神龟.jpg" alt="">
<div class="info"> <div class="info">
<div class="title"></div> <div class="title" v-if="item.tittle.length>18">{{item.tittle.slice(0,18)}}...</div>
<div class="time"></div> <div class="title" v-else>{{item.tittle}}.</div>
<div class="time">{{item.submitTime}}</div>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="法规标准" name="3">
<div class="item-1">
<div class="item" v-for="(item,i) in statute" @click="jumpToArticle(item.id)">
<img :src="$baseUrl+item.img" alt="">
<div class="info">
<div class="title" v-if="item.tittle.length>18">{{item.tittle.slice(0,18)}}...</div>
<div class="title" v-else>{{item.tittle}}.</div>
<div class="time">{{item.submitTime}}</div>
</div>
</div> </div>
</div> </div>
</div> -->
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -41,15 +50,35 @@
}, },
data(){ data(){
return{ return{
activeName: '1' activeName: '1',
news:[],
dynamic:[],
statute:[],
} }
}, },
created(){ created(){
this.getData()
localStorage.getItem('activeName')
}, },
methods:{ methods:{
jumpToArticle(id){
localStorage.setItem('activeName',this.activeName)
this.$router.push({path:'/article',query:{id: id}})
},
getData(){
this.$http.get(`zy/website/article/page?type=公司新闻`).then(res=>{
this.news = res.data.rows
})
this.$http.get(`zy/website/article/page?type=行业动态`).then(res=>{
this.dynamic = res.data.rows
})
this.$http.get(`zy/website/article/page?type=法规标准`).then(res=>{
this.statute = res.data.rows
})
},
handleClick(tabsPaneContext,e){ handleClick(tabsPaneContext,e){
console.log(tabsPaneContext) console.log(tabsPaneContext)
console.log(e) console.log(e)
@ -59,10 +88,19 @@
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .el-tabs{
--el-tabs-header-height: 1.1rem
}
::v-deep .el-tabs__header{
margin-bottom: 0;
}
::v-deep .el-tabs__nav-scroll{ ::v-deep .el-tabs__nav-scroll{
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
::v-deep .el-tabs__item{
font-size: .25rem;
}
::v-deep .el-tabs__item:hover{ ::v-deep .el-tabs__item:hover{
color: #1D2088; color: #1D2088;
} }
@ -70,6 +108,7 @@
color: #1D2088; color: #1D2088;
} }
::v-deep .el-tabs__active-bar{ ::v-deep .el-tabs__active-bar{
width: 1rem!important;
background-color: #1D2088; background-color: #1D2088;
} }
.page{ .page{
@ -77,7 +116,7 @@
.item-1{ .item-1{
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding: 1rem 2.25rem; padding: 1rem 2rem;
.item{ .item{
width: 4.875rem; width: 4.875rem;
padding: 0 .125rem; padding: 0 .125rem;
@ -96,8 +135,13 @@
padding-left: .125rem; padding-left: .125rem;
.title{ .title{
width: 100%; width: 100%;
font-size: .225rem;
line-height: .4rem;
background-color: #fff; background-color: #fff;
} }
.time{
font-size: .2rem;
}
} }

View File

@ -3,29 +3,45 @@
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="公司介绍" name="1"> <el-tab-pane label="公司介绍" name="1">
<div class="item-1"> <div class="item-1">
<h3>江苏中业消防技术服务有限公司公司简介</h3> <div class="title">{{introduce.tittle}}</div>
<p> <div class="ql-editor content" v-html="introduce.content" ref="content"></div>
江苏中业消防技术服务有限公司位于江苏省连云港市注册资本1000万元具备消防设施工程专业承包贰级建筑装修装饰工程专业承包贰级施工劳务不分等级资质同时具备建筑消防设施检测维保评估资质是一家集设计咨询消防技术咨询消防工程技术服务消防施工火灾隐患排查整治指导及消防设施维护保养检测安全评估为一体的综合性消防技术服务机构一直致力于消防领域的科学研究与社会消防技术服务实现品牌创造与效益双赢
</p>
<p>
公司技术力量雄厚
</p>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="组织机构" name="2"> <el-tab-pane label="组织机构" name="2">
<div class="item-2"> <div class="item-2">
<img src="@/assets/images/组 21 拷贝.png" alt=""> <img :src="$baseUrl+structure.img" alt="">
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="资质证书" name="3"> <el-tab-pane label="资质证书" name="3">
<div class="item-3"> <div class="item-3">
<div class="item" v-for="i in 5"> <div class="item" v-for="(item,i) in certificate">
<img src="@/assets/images/15探海神龟.jpg" alt=""> <img :src="$baseUrl+item.img" alt="">
<div class="title">安全生产许可证</div> <div class="title">{{item.tittle}}</div>
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="联系我们" name="4"> <el-tab-pane label="联系我们" name="4">
<div class="item-4">
<div class="lianxi">
<div class="phone">
<span class="icon">
<img src="@/assets/images/电话.png" alt="">
</span>
<span class="value">电话0518-90876754</span>
</div>
<div class="address">
<span class="icon">
<img src="@/assets/images/地址.png" alt="">
</span>
<span class="value">地址连云港海宁中路西大街</span>
</div>
</div>
<div class="content">
<div class="left">
</div>
</div>
</div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -41,15 +57,37 @@
}, },
data(){ data(){
return{ return{
introduce:{},
structure:{},
certificate:[],
activeName: '1' activeName: '1'
} }
}, },
created(){ created(){
if(this.$route.query&&this.$route.query.name){
this.activeName = this.$route.query.name
}
this.getData()
},
activated(){
if(this.$route.query&&this.$route.query.name){
this.activeName = this.$route.query.name
}
}, },
methods:{ methods:{
getData(){
this.$http.get(`zy/website/article/page?type=公司介绍`).then(res=>{
this.introduce = res.data.rows[0]
})
this.$http.get(`zy/website/article/page?type=组织机构`).then(res=>{
this.structure = res.data.rows[0]
})
this.$http.get(`zy/website/article/page?type=资质证书`).then(res=>{
this.certificate = res.data.rows
})
},
handleClick(tabsPaneContext,e){ handleClick(tabsPaneContext,e){
console.log(tabsPaneContext) console.log(tabsPaneContext)
console.log(e) console.log(e)
@ -59,10 +97,19 @@
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .el-tabs{
--el-tabs-header-height: 1.1rem
}
::v-deep .el-tabs__header{
margin-bottom: 0;
}
::v-deep .el-tabs__nav-scroll{ ::v-deep .el-tabs__nav-scroll{
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
::v-deep .el-tabs__item{
font-size: .25rem;
}
::v-deep .el-tabs__item:hover{ ::v-deep .el-tabs__item:hover{
color: #1D2088; color: #1D2088;
} }
@ -70,6 +117,7 @@
color: #1D2088; color: #1D2088;
} }
::v-deep .el-tabs__active-bar{ ::v-deep .el-tabs__active-bar{
width: 1rem!important;
background-color: #1D2088; background-color: #1D2088;
} }
.page{ .page{
@ -84,6 +132,16 @@
line-height: .6rem; line-height: .6rem;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
padding: 1rem 2.375rem; padding: 1rem 2.375rem;
.title{
font-size: .35rem;
font-weight: bold;
text-align: center;
}
.content{
margin-top: .25rem;
font-size: .275rem;
line-height: .6rem;
}
} }
.item-2{ .item-2{
@ -109,8 +167,9 @@
align-items: center; align-items: center;
margin-bottom: .375rem; margin-bottom: .375rem;
img{ img{
width: 90%; /* width: 90%; */
height: 100%; width: auto;
height: 3.75rem;
} }
.title{ .title{
margin-top: .125rem; margin-top: .125rem;
@ -119,6 +178,47 @@
} }
} }
} }
.item-4{
.lianxi{
width: 100%;
height: 2.5rem;
background-color: #ccc;
display: flex;
align-items: center;
padding-left: 1.625rem;
.phone,.address{
display: flex;
margin-left: .75rem;
}
.icon{
display: inline-block;
width: .575rem;
height: .575rem;
background: #A11715;
border-radius: .05rem;
display: flex;
justify-content: center;
align-items: center;
img{
width: .375rem;
height: .375rem;
}
}
.value{
display: inline-block;
width: 4.875rem;
height: .575rem;
background: #A11715;
border-radius: .05rem;
margin-left: .0375rem;
line-height: .575rem;
color: #fff;
padding-left: .375rem;
}
}
}
} }
</style> </style>