From ed58afaaa564c54d22a42593265addce08bd5850 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 16 七月 2019 12:09:26 +0800
Subject: [PATCH] format-code
---
src/views/successCase/index.vue | 691 ++++++++++++++++++++++++++++-----------------------------
1 files changed, 338 insertions(+), 353 deletions(-)
diff --git a/src/views/successCase/index.vue b/src/views/successCase/index.vue
index 67e64bf..8df90d8 100644
--- a/src/views/successCase/index.vue
+++ b/src/views/successCase/index.vue
@@ -1,399 +1,384 @@
<template>
- <div class="main">
- <div class="banner">
- <img src="../../img/successBanner.png" alt="" class="m_hide">
- <img src="../../img/an1.png" alt="" class="p_hide">
- </div>
- <div style="background-color: #f9f9f9;" class="m_hide">
- <div class="wrapper">
- <div class="content_title">
- <span>妗堜緥璇︽儏</span>
- </div>
- <div class="content">
- <div class="left_border">浠撳偍鐗╂祦</div>
- <div class="contnt-describe">
- <div class="left" style="float: left;padding-top: 0.1rem;">
- <ul>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s1.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s2.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s3.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s4.png" alt=""></li>
- </router-link>
- </ul>
- </div>
- <div class="right" style="position: relative;">
- <img src="../../img/s5.png" alt="" >
- <span v-if="isShow1" class="txt">鏄庣涓轰腑鐭虫补瀹炴柦浜嗙墿璧勬潯鐮佺鐞嗙郴缁燂紝瀹炵幇浜嗛渶姹傞儴闂ㄥ湪绾胯鍒掓姤鎵广�佷緵搴斿晢鍗忓悓閫佽揣銆侀」鐩幇鍦烘敹銆佸彂銆佺洏銆佸瓨绛夊姛鑳姐�傜郴缁熼噰鐢ㄤ簡浜掕仈缃戙�佹棤绾挎妧鏈潯鐮佹妧鏈浉缁撳悎鐨勬柟妗堣繘琛屽疄鏂斤紝涓轰腑鐭虫补鑺傜渷澶ч噺浜哄姏銆佺墿鍔涖��</span>
- </div>
- </div>
-
- <div class="left_border" style="float: right;margin-top: 0.5rem;">鏅鸿兘鍒堕��</div>
- <div class="contnt-describe" style="margin-bottom: 1.48rem;">
- <div class="left">
- <ul style="margin-left: 1rem;">
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s7.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s8.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s9.png" alt=""></li>
- </router-link>
- <router-link to="/successCaseIndex" style="padding: 0;">
- <li><img src="../../img/s10.png" alt=""></li>
- </router-link>
- </ul>
- </div>
- <div class="right" style="position: relative;">
- <img src="../../img/s6.png" alt="">
- <span v-if="isShow2" class="txt">鏄庣涓轰腑骞挎牳瀹炴柦浜嗙墿璧勬潯鐮佽拷婧郴缁燂紝璇ョ郴缁熷熀浜庢槑绉戝彲閰嶇疆骞冲彴K9 1.0瀹炴柦锛屼粠鏉ユ枡楠屾敹寮�濮嬶紝缁忚繃閿�鍞嚭搴撱�佺敓浜ц閰嶇瓑鐜妭锛屽畬鎴愯拷婧暟鎹殑閲囬泦骞舵彁渚涗骇鍝佺敓鍛藉懆鏈熺殑鏁版嵁杩芥函鏌ヨ</span>
- </div>
- </div>
- </div>
- </div>
- </div>
-
- <!-- 绉诲姩绔牱寮� -->
- <div class="webapp p_hide">
- <h3 class="content_title2 fadeInUp zoomIn animated"><span>妗堜緥璇︽儏</span></h3>
- <div class="project" style="padding: 0.2rem 0 0.3rem;">
- <h3 class="content_title3"><span>浠撳偍鐗╂祦</span></h3>
- <div class="img_box"><img src="../../img/an2.png" alt=""></div>
- <div class="three_box">
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an3.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an4.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an5.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an6.png" alt="">
- </router-link>
- </div>
- </div>
- <div class="project" style="padding: 0.2rem 0 0.3rem;margin-bottom: 0.8rem;">
- <h3 class="content_title3"><span>鏅鸿兘鍒堕��</span></h3>
- <div class="img_box"><img src="../../img/an7.png" alt=""></div>
- <div class="three_box">
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an8.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an9.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an10.png" alt="">
- </router-link>
- <router-link tag="div" to="/successCaseIndex">
- <img src="../../img/an11.png" alt="">
- </router-link>
- </div>
- </div>
- </div>
+ <div class="main">
+ <div class="banner">
+ <img src="../../img/successBanner.png" alt="" class="m_hide">
+ <img src="../../img/an1.png" alt="" class="p_hide">
</div>
+ <div style="background-color: #f9f9f9;" class="m_hide">
+ <div class="wrapper">
+ <div class="content_title">
+ <span>妗堜緥璇︽儏</span>
+ </div>
+ <div class="content">
+ <div class="left_border">浠撳偍鐗╂祦</div>
+ <div class="contnt-describe">
+ <div class="left" style="float: left;padding-top: 0.1rem;">
+ <ul>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s1.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s2.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s3.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s4.png" alt=""></li>
+ </router-link>
+ </ul>
+ </div>
+ <div class="right" style="position: relative;">
+ <img src="../../img/s5.png" alt="" >
+ <span v-if="isShow1" class="txt">鏄庣涓轰腑鐭虫补瀹炴柦浜嗙墿璧勬潯鐮佺鐞嗙郴缁燂紝瀹炵幇浜嗛渶姹傞儴闂ㄥ湪绾胯鍒掓姤鎵广�佷緵搴斿晢鍗忓悓閫佽揣銆侀」鐩幇鍦烘敹銆佸彂銆佺洏銆佸瓨绛夊姛鑳姐�傜郴缁熼噰鐢ㄤ簡浜掕仈缃戙�佹棤绾挎妧鏈潯鐮佹妧鏈浉缁撳悎鐨勬柟妗堣繘琛屽疄鏂斤紝涓轰腑鐭虫补鑺傜渷澶ч噺浜哄姏銆佺墿鍔涖��</span>
+ </div>
+ </div>
+ <div class="left_border" style="float: right;margin-top: 0.5rem;">鏅鸿兘鍒堕��</div>
+ <div class="contnt-describe" style="margin-bottom: 1.48rem;">
+ <div class="left">
+ <ul style="margin-left: 1rem;">
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s7.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s8.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s9.png" alt=""></li>
+ </router-link>
+ <router-link to="/successCaseIndex" style="padding: 0;">
+ <li><img src="../../img/s10.png" alt=""></li>
+ </router-link>
+ </ul>
+ </div>
+ <div class="right" style="position: relative;">
+ <img src="../../img/s6.png" alt="">
+ <span v-if="isShow2" class="txt">鏄庣涓轰腑骞挎牳瀹炴柦浜嗙墿璧勬潯鐮佽拷婧郴缁燂紝璇ョ郴缁熷熀浜庢槑绉戝彲閰嶇疆骞冲彴K9 1.0瀹炴柦锛屼粠鏉ユ枡楠屾敹寮�濮嬶紝缁忚繃閿�鍞嚭搴撱�佺敓浜ц閰嶇瓑鐜妭锛屽畬鎴愯拷婧暟鎹殑閲囬泦骞舵彁渚涗骇鍝佺敓鍛藉懆鏈熺殑鏁版嵁杩芥函鏌ヨ</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- 绉诲姩绔牱寮� -->
+ <div class="webapp p_hide">
+ <h3 class="content_title2 fadeInUp zoomIn animated"><span>妗堜緥璇︽儏</span></h3>
+ <div class="project" style="padding: 0.2rem 0 0.3rem;">
+ <h3 class="content_title3"><span>浠撳偍鐗╂祦</span></h3>
+ <div class="img_box"><img src="../../img/an2.png" alt=""></div>
+ <div class="three_box">
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an3.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an4.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an5.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an6.png" alt="">
+ </router-link>
+ </div>
+ </div>
+ <div class="project" style="padding: 0.2rem 0 0.3rem;margin-bottom: 0.8rem;">
+ <h3 class="content_title3"><span>鏅鸿兘鍒堕��</span></h3>
+ <div class="img_box"><img src="../../img/an7.png" alt=""></div>
+ <div class="three_box">
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an8.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an9.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an10.png" alt="">
+ </router-link>
+ <router-link tag="div" to="/successCaseIndex">
+ <img src="../../img/an11.png" alt="">
+ </router-link>
+ </div>
+ </div>
+ </div>
+ </div>
</template>
<script>
export default {
- data(){
- return{
- isShow1:false,
- isShow2:false,
+ data () {
+ return {
+ isShow1: false,
+ isShow2: true
}
},
- mounted(){
- document.body.scrollTop = 0
- document.documentElement.scrollTop = 0
- }
+ mounted () {
+ document.body.scrollTop = 0
+ document.documentElement.scrollTop = 0
+ }
}
</script>
<style lang="less" scoped>
-
-.content_title{
+ .content_title {
padding: 0.94rem 0 1.03rem;
- p{
- color: #838383;
- font-size: .16rem;
- text-align: center;
- margin-top: .26rem;
+ p {
+ color: #838383;
+ font-size: .16rem;
+ text-align: center;
+ margin-top: .26rem;
}
-}
-h3{
- font-family:MicrosoftYaHei;
- font-weight:400;
+ }
+ h3 {
+ font-family: MicrosoftYaHei;
+ font-weight: 400;
font-size: .3rem;
- color:rgba(58,58,60,1);
+ color: rgba(58,58,60,1);
text-align: left;
- margin:.2rem 4%;
-}
-.contnt-describe{
+ margin: .2rem 4%;
+ }
+ .contnt-describe {
width: 100%;
height: auto;
margin: 0 auto;
padding: 0.1rem 0.3rem 0.3rem;
- border: 1px solid gainsboro;
+ border: 1px solid gainsboro;
// background: #f9f9f9;
- p{
- width: 92%;
- margin: 0 auto;
- text-align-last: left;
- font-size: .16rem;
- margin-bottom: .2rem;
+ p {
+ width: 92%;
+ margin: 0 auto;
+ text-align-last: left;
+ font-size: .16rem;
+ margin-bottom: .2rem;
}
-}
-.content:nth-child(2){
+ }
+ .content:nth-child(2) {
text-align: center;
- a{
- color:#3B3B3C;
- padding: 0.06rem 0.2rem;
- display: inline-block;
- font-size: 0.16rem;
- margin: 0.21rem 0.1rem;
+ a {
+ color:#3B3B3C;
+ padding: 0.06rem 0.2rem;
+ display: inline-block;
+ font-size: 0.16rem;
+ margin: 0.21rem 0.1rem;
}
-}
-@media (min-width: 751px) {
- .contnt-describe{
+ }
+ @media (min-width: 751px) {
+ .contnt-describe {
+ float: left;
+ margin-bottom: .2rem;
+ .left {
float: left;
- margin-bottom: .2rem;
-
- .left{
- float: left;
- width: 50%;
-
- span{
- display: inline-block;
- padding-top: .3rem;
- }
+ width: 50%;
+ span {
+ display: inline-block;
+ padding-top: .3rem;
}
- .right{
- float: right;
- width: 50%;
- }
+ }
+ .right {
+ float: right;
+ width: 50%;
+ }
}
- h3{
- font-size: .3rem;
+ h3 {
+ font-size: .3rem;
}
.contnt-describe {
- .right{
- margin-top: .3rem;
- float: right;
- // width: 3.85rem;
- // height: 2.38rem;
- background: url(../../img/shiyou.png);
- background-size: 100% 100%;
- position: relative;
- .txt{
- position: absolute;
- left: 0.12rem;
- top: 2.65rem;
- width:545px;
- height:67px;
- font-size:16px;
- font-family:MicrosoftYaHei;
- font-weight:400;
- color:rgba(255,255,255,1);
- line-height:25px;
- text-align: left;
- }
- p{
- font-size: .08rem;
- color:#fff;
- position: absolute;;
- bottom: -.1rem;
- }
+ .right {
+ margin-top: .3rem;
+ float: right;
+ // width: 3.85rem;
+ // height: 2.38rem;
+ background: url(../../img/shiyou.png);
+ background-size: 100% 100%;
+ position: relative;
+ .txt {
+ position: absolute;
+ left: 0.12rem;
+ top: 2.65rem;
+ width:545px;
+ height:67px;
+ font-size:16px;
+ font-family:MicrosoftYaHei;
+ font-weight:400;
+ color:rgba(255,255,255,1);
+ line-height:25px;
+ text-align: left;
}
- .left{
- float: left;
-
- ul{
- width: 100%;
- display: flex;
- flex-wrap: wrap;
- padding: 0.4rem 0.1rem;
- li{
- width: 2rem;
- height: 1rem;
- padding: .2rem;
- margin-top: 0.15rem;
- }
- }
+ p {
+ font-size: .08rem;
+ color:#fff;
+ position: absolute;;
+ bottom: -.1rem;
}
+ }
+ .left {
+ float: left;
+ ul {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 0.4rem 0.1rem;
+ li {
+ width: 2rem;
+ height: 1rem;
+ padding: .2rem;
+ margin-top: 0.15rem;
+ }
+ }
+ }
}
- .contnt-describe:nth-child(2n){
- .right{
- float: left;
+ .contnt-describe:nth-child(2n) {
+ .right {
+ float: left;
+ }
+ .left {
+ float: right;
+ span {
+ text-align: right;
+ float: right;
}
- .left{
- float: right;
- span{
- text-align: right;
- float: right;
+ }
+ }
+ .left_border {
+ display: inline-block;
+ width: 1rem;
+ text-align: left;
+ position: relative;
+ padding-left: .2rem;
+ margin-bottom: 0.3rem;
+ float: none;
+ }
+ .left_border::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: .02rem;
+ width: 0.04rem;
+ height: 80%;
+ background: #0070c0;
+ }
+ }
+ @media (max-width: 750px) and (min-width: 0) {
+ .webapp {
+ width: 94%;
+ margin: 0 auto;
+ .content_title3 {
+ font-size: 0.16rem;
+ color: #3A3A3C;
+ padding-left: .06rem;
+ margin-top: 0.2rem;
+ position: relative;
+ span {
+ font-size: 0.36rem;
+ margin-left: 0.18rem;
+ margin-top: 0.02rem;
+ display: inline-block;
+ }
+ }
+ .content_title3::after {
+ content: '';
+ width:0.09rem;
+ height:0.45rem;
+ background:rgba(0,112,192,1);
+ position: absolute;
+ top: 0.05rem;
+ left: 0;
+ }
+ .content_title2 {
+ font-size: 0.36rem;
+ font-family: PingFang-SC-Bold;
+ font-weight: bold;
+ color: rgba(59,59,60,1);
+ padding: 0.55rem 0 0.25rem;
+ position: relative;
+ text-align: center;
+ span {
+ border: 0;
+ }
+ }
+ .content_title2:before {
+ content: '';
+ position: absolute;
+ left: 0.9rem;
+ top: 0.82rem;
+ width: 1.4rem;
+ height: 0.02rem;
+ background: #999999;
+ }
+ .content_title2:after {
+ content: '';
+ position: absolute;
+ right: 0.9rem;
+ top: 0.82rem;
+ width: 1.4rem;
+ height: 0.02rem;
+ background: #999999;
+ }
+ .img_box {
+ margin: 0.3rem 0.3rem 0.4rem;
+ }
+ .project {
+ background: #f9f9f9;
+ box-sizing: border-box;
+ margin: .4rem auto;
+ padding: .1rem 0;
+ .program {
+ width: 100%;
+ height: auto;
+ display: flex;
+ padding: .34rem 0;
+ dl {
+ width: 25%;
+ dt {
+ width: .94rem;
+ height: .94rem;
+ margin: 0 auto;
}
+ dd {
+ text-align: center;
+ padding-top: .07rem;
+ }
+ }
}
+ .three_box {
+ margin: 0.4rem 0.3rem 0;
+ display: flex;
+ div {
+ flex: 1;
+ padding-right: 0.3rem;
+ }
+ div:last-child {
+ padding-right: 0;
+ }
+ }
+ }
}
- .left_border{
- display: inline-block;
- width: 1rem;
- text-align: left;
- position: relative;
- padding-left: .2rem;
- margin-bottom: 0.3rem;
- float: left;
- }
- .left_border::after{
- content: '';
- position: absolute;
- left: 0;
- top: .02rem;
- width: 0.04rem;
- height: 80%;
- background: #0070c0;
- }
-}
-@media (max-width: 750px) and (min-width: 0){
- .webapp{
- width: 94%;
- margin: 0 auto;
- .content_title3{
- font-size: 0.16rem;
- color: #3A3A3C;
- padding-left: .06rem;
- margin-top: 0.2rem;
- position: relative;
-
- span{
- font-size: 0.36rem;
- margin-left: 0.18rem;
- margin-top: 0.02rem;
- display: inline-block;
- }
- }
- .content_title3::after{
- content: '';
- width:0.09rem;
- height:0.45rem;
- background:rgba(0,112,192,1);
- position: absolute;
- top: 0.05rem;
- left: 0;
- }
-
- .content_title2{
- font-size:0.36rem;
- font-family:PingFang-SC-Bold;
- font-weight:bold;
- color:rgba(59,59,60,1);
- padding: 0.55rem 0 0.25rem;
- position: relative;
- text-align: center;
- span{
- border: 0;
- }
- }
- .content_title2:before {
- content: '';
- position: absolute;
- left: 0.9rem;
- top: 0.82rem;
- width: 1.4rem;
- height: 0.02rem;
- background: #999999;
- }
- .content_title2:after {
- content: '';
- position: absolute;
- right: 0.9rem;
- top: 0.82rem;
- width: 1.4rem;
- height: 0.02rem;
- background: #999999;
- }
-
- .img_box{
- margin: 0.3rem 0.3rem 0.4rem;
- }
-
- .project{
- background: #f9f9f9;
- box-sizing: border-box;
- margin: .4rem auto;
- padding: .1rem 0;
- .program{
- width: 100%;
- height: auto;
- display: flex;
- padding: .34rem 0;
- dl{
- width: 25%;
- dt{
- width: .94rem;
- height: .94rem;
- margin: 0 auto;
- }
- dd{
- text-align: center;
- padding-top: .07rem;
- }
- }
- }
-
- .three_box{
- margin: 0.4rem 0.3rem 0;
- display: flex;
-
- div{
- flex: 1;
- padding-right: 0.3rem;
- }
- div:last-child{
- padding-right: 0;
- }
- }
- }
- }
-
-
-
- .header{
- padding: 0 2%;
+ .header {
+ padding: 0 2%;
}
- .wrapper{
- width: 100%;
+ .wrapper {
+ width: 100%;
}
.content_title > span::after ,.content_title > span::before {
- display: none;
+ display: none;
}
- .content_title{
- text-align: center;
+ .content_title {
+ text-align: center;
}
- .content_title >span{
- display: inline-block;
- border-bottom: 1px solid #3B3B3C;
+ .content_title > span {
+ display: inline-block;
+ border-bottom: 1px solid #3B3B3C;
}
- .contnt-describe{
+ .contnt-describe {
+ width: 100%;
+ .left, .right {
width: 100%;
- .left, .right{
- width: 100%;
- }
+ }
}
- .contnt-describe img{
- display: inline-block;
- margin: .6rem 1.6rem;
- width: 3.85rem;
- height: 2.38rem;
- border:1px solid #000;
+ .contnt-describe img {
+ display: inline-block;
+ margin: .6rem 1.6rem;
+ width: 3.85rem;
+ height: 2.38rem;
+ border:1px solid #000;
}
-}
+ }
</style>
--
Gitblit v1.8.0