城阳车管所项目
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.

547 lines
16 KiB

5 years ago
<html>
<head>
<meta charset="utf-8">
<title>{ms:global.name/}</title>
<#include "head-file.htm" />
</head>
<body>
<div id="app" v-cloak>
<#include "header.htm" />
<div class="content">
<div class="body">
<div class="left">
{ms:channel type='parent'}
<span class="title"> ${field.typetitle} </span>
{/ms:channel}
<#assign typetitle=field.typetitle>
5 years ago
<#if field.typeleaf>
{ms:channel type='level'}
<a href="{ms:global.url/}${field.typelink}" class="<#if typetitle==field.typetitle>sub-title-sel<#else>sub-title</#if>"> ${field.typetitle} </a>
{/ms:channel}
<#else>
{ms:channel type='son'}
<a href="{ms:global.url/}${field.typelink}" class="<#if typetitle==field.typetitle>sub-title-sel<#else>sub-title</#if>"> ${field.typetitle} </a>
{/ms:channel}
</#if>
5 years ago
</div>
<div class="right">
<div class="ms-channel-path">
<span class="ms-channel-path-label"> 当前位置: </span>
<a href="/" class="ms-channel-path-index"> 首页 </a> {ms:channel type="path"}
<i class="iconfont icon-youjiantou"></i>
<a href="{ms:global.url/}${field.typelink}" class="ms-channel-path-link"> ${field.typetitle} </a> {/ms:channel}
</div>
<div class="product">
<div class="pic">
5 years ago
<img title="" alt="" src="{ms:global.host/}/{@ms:file field.litpic/}">
<div class="text">
<span class="big-title"> ${field.title} </span>
<span class="desc"> ${field.descrip} </span>
</div>
</div>
<div class="content">
<div class="content-body">
<span> ${field.content} </span>
</div>
</div>
</div>
</div>
</div>
</div>
<#include "footer.htm" />
</div>
<script>
5 years ago
var app = new Vue({
el: '#app',
watch:{
},
data: {
},
methods: {
switchShow:function(arr){
var that = this
arr.forEach(function(x){
let e = that.$el.querySelector("#key_"+x)
if(e){
e.style.display=e.style.display=='none'?'flex':'none'
}
})
},
},
created(){
}
})
</script>
<style>
5 years ago
body {
5 years ago
background-color:#fff;
5 years ago
box-sizing:border-box;
font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Segoe UI", "Helvetica Neue", "PingFang SC", "Noto Sans", "Noto Sans CJK SC", "Microsoft YaHei", 微软雅黑, sans-serif;
moz-box-sizing:border-box;
webkit-box-sizing:border-box;
}
.content
{
5 years ago
align-items:flex-start;
flex-direction:row;
5 years ago
display:flex;
padding-right:0px;
5 years ago
box-sizing:border-box;
justify-content:center;
padding-bottom:0px;
flex-wrap:nowrap;
5 years ago
width:100%;
margin-bottom:0px;
padding-top:0px;
padding-left:0px;
margin-top:0px;
}
5 years ago
.content .body
5 years ago
{
5 years ago
padding-bottom:20px;
flex-wrap:nowrap;
5 years ago
flex-direction:row;
display:flex;
5 years ago
padding-right:0px;
width:1200px;
5 years ago
box-sizing:border-box;
5 years ago
padding-top:20px;
padding-left:0px;
}
.content .body .left
{
5 years ago
padding-bottom:0px;
flex-wrap:nowrap;
5 years ago
flex-direction:column;
display:flex;
padding-right:0px;
width:100%;
box-sizing:border-box;
5 years ago
padding-top:0px;
5 years ago
padding-left:0px;
margin-top:0px;
5 years ago
height:100%;
5 years ago
}
5 years ago
.content .body .left .title
5 years ago
{
border-bottom-color:#C0C4CC;
5 years ago
color:#C0C4CC;
5 years ago
flex-direction:row;
word-wrap:break-word;
display:inline-block;
5 years ago
font-size:16PX;
border-bottom-style:dashed;
padding-top:10px;
border-bottom-width:1px;
padding-left:10px;
margin-top:0px;
5 years ago
height:40px;
5 years ago
}
.content .body .left .sub-title-sel {
background-color: #F2F6FC;
color: #409EFF;
flex-direction: row;
word-wrap: break-word;
display: inline-block;
font-size: 16PX;
padding-top: 10px;
padding-left: 10px;
margin-top: 2px;
height: 40px;
5 years ago
}
.content .body .left .sub-title {
color: #5F5F5F;
flex-direction: row;
word-wrap: break-word;
display: inline-block;
font-size: 16PX;
padding-top: 10px;
padding-left: 10px;
margin-top: 0px;
height: 40px;
5 years ago
}
5 years ago
.content .body .right
5 years ago
{
padding-bottom:0px;
flex-wrap:wrap;
5 years ago
flex-direction:column;
display:flex;
padding-right:0px;
5 years ago
width:1000px;
margin-bottom:0px;
box-sizing:border-box;
5 years ago
padding-top:0px;
position:relative;
5 years ago
padding-left:20px;
5 years ago
margin-top:0px;
}
5 years ago
.content .body .right .ms-channel-path
5 years ago
{
margin-right:auto;
5 years ago
align-items:center;
flex-wrap:nowrap;
5 years ago
flex-direction:row;
display:flex;
width:100%;
5 years ago
margin-bottom:10px;
box-sizing:border-box;
5 years ago
padding-left:0px;
5 years ago
margin-top:10px;
5 years ago
height:30px;
margin-left:auto;
5 years ago
}
5 years ago
.content .body .right .ms-channel-path span
5 years ago
{
5 years ago
color:#909399;
5 years ago
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:16PX;
5 years ago
}
.content .body .right .ms-channel-path .ms-channel-path-index
{
cursor:pointer;
color:#000;
5 years ago
font-size:16PX;
5 years ago
text-decoration:none;
margin-bottom:0px;
5 years ago
margin-top:0px;
}
5 years ago
.content .body .right .ms-channel-path >i
5 years ago
{
5 years ago
}
.content .body .right .ms-channel-path .ms-channel-path-link
{
cursor:pointer;
color:#000;
font-size:16PX;
text-decoration:none;
5 years ago
margin-bottom:0px;
margin-top:0px;
}
5 years ago
.content .body .right .product
5 years ago
{
5 years ago
margin-right:0px;
5 years ago
padding-bottom:0px;
5 years ago
flex-direction:column;
display:flex;
padding-right:0px;
width:980px;
5 years ago
margin-bottom:0px;
5 years ago
box-sizing:border-box;
5 years ago
padding-top:0px;
5 years ago
padding-left:0px;
5 years ago
margin-top:0px;
}
5 years ago
.content .body .right .product .pic
5 years ago
{
5 years ago
flex-wrap:nowrap;
5 years ago
flex-direction:row;
display:flex;
5 years ago
width:100%;
5 years ago
box-sizing:border-box;
5 years ago
padding-left:0px;
height:240px;
5 years ago
}
5 years ago
.content .body .right .product .pic img
{
width:320px;
5 years ago
padding-left:0px;
height:206px;
5 years ago
}
.content .body .right .product .pic .text
5 years ago
{
flex-wrap:nowrap;
5 years ago
flex-direction:column;
5 years ago
display:flex;
5 years ago
width:740px;
5 years ago
box-sizing:border-box;
5 years ago
padding-left:20px;
5 years ago
height:100%;
}
5 years ago
.content .body .right .product .pic .text .big-title
5 years ago
{
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:22PX;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .pic .text .desc
5 years ago
{
5 years ago
color:#C8C8C8;
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:16PX;
padding-top:0px;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .content
5 years ago
{
5 years ago
padding-bottom:10px;
5 years ago
flex-wrap:nowrap;
5 years ago
flex-direction:column;
5 years ago
display:flex;
5 years ago
width:100%;
5 years ago
box-sizing:border-box;
5 years ago
padding-top:10px;
5 years ago
padding-left:0px;
}
5 years ago
.content .body .right .product .content .label
5 years ago
{
5 years ago
padding-bottom:0px;
5 years ago
flex-direction:row;
word-wrap:break-word;
display:inline-block;
5 years ago
font-size:18PX;
padding-top:0px;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .content .content-body
5 years ago
{
padding-bottom:0px;
5 years ago
flex-wrap:nowrap;
flex-direction:column;
display:flex;
width:100%;
box-sizing:border-box;
5 years ago
padding-top:0px;
5 years ago
padding-left:0px;
height:100%;
5 years ago
}
.content .body .right .product .content .content-body span
{
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:14px;
}
5 years ago
@media (max-width: 768px){
.content
{
5 years ago
align-items:center;
flex-direction:row;
5 years ago
display:flex;
padding-right:0px;
5 years ago
box-sizing:border-box;
justify-content:center;
padding-bottom:0px;
flex-wrap:nowrap;
5 years ago
width:100%;
margin-bottom:0px;
padding-top:0px;
padding-left:0px;
margin-top:0px;
}
5 years ago
.content .body
5 years ago
{
5 years ago
padding-bottom:20px;
5 years ago
flex-wrap:nowrap;
5 years ago
flex-direction:column;
5 years ago
display:flex;
5 years ago
padding-right:0px;
width:90%;
5 years ago
box-sizing:border-box;
5 years ago
padding-top:20px;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .left
5 years ago
{
5 years ago
padding-bottom:0px;
flex-wrap:nowrap;
flex-direction:column;
display:flex;
padding-right:0px;
width:100%;
box-sizing:border-box;
padding-top:0px;
padding-left:0px;
height:100%;
}
.content .body .left .title
{
border-bottom-color:#C0C4CC;
5 years ago
color:#C0C4CC;
5 years ago
flex-direction:row;
word-wrap:break-word;
display:inline-block;
5 years ago
font-size:16PX;
border-bottom-style:dashed;
padding-top:10px;
border-bottom-width:1px;
padding-left:10px;
margin-top:0px;
5 years ago
height:40px;
5 years ago
}
5 years ago
.content .body .left .sub-title-sel
5 years ago
{
5 years ago
background-color:#F2F6FC;
color:#409EFF;
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:16PX;
padding-top:10px;
padding-left:10px;
margin-top:2px;
height:40px;
}
.content .body .right
5 years ago
{
5 years ago
padding-bottom:0px;
flex-wrap:nowrap;
flex-direction:column;
display:flex;
padding-right:0px;
width:100%;
5 years ago
margin-bottom:0px;
5 years ago
box-sizing:border-box;
padding-top:0px;
padding-left:0px;
5 years ago
margin-top:0px;
}
5 years ago
.content .body .right .ms-channel-path
5 years ago
{
margin-right:auto;
5 years ago
align-items:center;
flex-wrap:nowrap;
5 years ago
flex-direction:row;
5 years ago
display:flex;
width:100%;
margin-bottom:10px;
box-sizing:border-box;
5 years ago
padding-left:0px;
margin-top:10px;
5 years ago
height:30px;
margin-left:auto;
5 years ago
}
5 years ago
.content .body .right .ms-channel-path span
5 years ago
{
5 years ago
color:#909399;
5 years ago
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:16PX;
5 years ago
}
5 years ago
.content .body .right .ms-channel-path .ms-channel-path-index
5 years ago
{
5 years ago
cursor:pointer;
color:#000;
font-size:16PX;
text-decoration:none;
5 years ago
margin-bottom:0px;
margin-top:0px;
}
5 years ago
.content .body .right .ms-channel-path .ms-channel-path-link
5 years ago
{
5 years ago
cursor:pointer;
color:#000;
5 years ago
font-size:16PX;
5 years ago
text-decoration:none;
margin-bottom:0px;
margin-top:0px;
5 years ago
}
5 years ago
.content .body .right .product
5 years ago
{
margin-right:0px;
padding-bottom:0px;
5 years ago
flex-direction:column;
display:flex;
5 years ago
padding-right:0px;
width:100%;
5 years ago
margin-bottom:0px;
box-sizing:border-box;
5 years ago
padding-top:0px;
5 years ago
padding-left:0px;
5 years ago
margin-top:0px;
5 years ago
height:610px;
5 years ago
}
5 years ago
.content .body .right .product .pic
5 years ago
{
5 years ago
flex-wrap:nowrap;
5 years ago
flex-direction:column;
display:flex;
5 years ago
width:100%;
5 years ago
box-sizing:border-box;
5 years ago
padding-left:0px;
height:240px;
}
.content .body .right .product .pic img
{
padding-bottom:0px;
5 years ago
width:100%;
padding-top:0px;
5 years ago
padding-left:0px;
height:400px;
5 years ago
}
5 years ago
.content .body .right .product .pic .text
5 years ago
{
flex-wrap:nowrap;
5 years ago
flex-direction:column;
5 years ago
display:flex;
5 years ago
width:100%;
5 years ago
box-sizing:border-box;
5 years ago
padding-left:0px;
5 years ago
height:100%;
}
5 years ago
.content .body .right .product .pic .text .big-title
5 years ago
{
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:22PX;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .pic .text .desc
5 years ago
{
5 years ago
color:#C8C8C8;
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:16PX;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .content
5 years ago
{
flex-wrap:nowrap;
5 years ago
flex-direction:column;
5 years ago
display:flex;
5 years ago
width:100%;
5 years ago
box-sizing:border-box;
padding-left:0px;
5 years ago
height:240px;
5 years ago
}
5 years ago
.content .body .right .product .content .label
5 years ago
{
flex-direction:row;
word-wrap:break-word;
display:inline-block;
5 years ago
font-size:18PX;
padding-top:0px;
padding-left:0px;
5 years ago
}
5 years ago
.content .body .right .product .content .content-body
5 years ago
{
5 years ago
flex-wrap:nowrap;
flex-direction:column;
display:flex;
width:100%;
box-sizing:border-box;
padding-top:20px;
padding-left:0px;
height:100%;
5 years ago
}
.content .body .right .product .content .content-body span
{
flex-direction:row;
word-wrap:break-word;
display:inline-block;
font-size:14px;
}
5 years ago
}</style>
</body>
</html>