Skip to content

V
vue-ssr
Commit e66dcdde authored by lixy's avatar lixy
Browse files
Options

首页、活动、车型样式调整

parent 46c0bf9c
Hide whitespace changes
Inline Side-by-side
Showing with 54 additions and 45 deletions
assets/main.css
View file @ e66dcdde
...@@ -6,6 +6,10 @@ body { ...@@ -6,6 +6,10 @@ body {
#newBridge .nb-middle{ #newBridge .nb-middle{
display: none !important; display: none !important;
} }
#newBridge .icon-right-center{
bottom: 100px !important;
top: auto !important;
}
.min-win{ .min-win{
width: 1200px; width: 1200px;
} }
...@@ -46,15 +50,15 @@ body { ...@@ -46,15 +50,15 @@ body {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
background: #fff; background: #fff;
padding: 20px; padding: 40px;
} }
.content-t{ .content-t{
/*border-bottom: 5px solid #1bbb9f;*/
width: 100px; width: 100px;
text-align: center; text-align: center;
padding: 10px;
margin-bottom: 20px; margin-bottom: 20px;
font-weight: normal; font-weight: normal;
height: 54px;
line-height: 56px;
} }
.bread-menu span{ .bread-menu span{
......
components/menu.vue
View file @ e66dcdde
...@@ -74,6 +74,7 @@ ...@@ -74,6 +74,7 @@
background: #fff; background: #fff;
display: flex; display: flex;
justify-content: center; justify-content: center;
border-bottom: 1px solid #eee;
} }
.logo-t{ .logo-t{
color: #333; color: #333;
......
pages/activityList/_id.vue
View file @ e66dcdde
...@@ -21,11 +21,11 @@ ...@@ -21,11 +21,11 @@
</div> </div>
</div> </div>
<div class="flex-jcb"> <div class="flex-jcb">
<div style="width: 800px;background: #fff;margin: 20px 0;padding: 20px;"> <div style="width: 800px;background: #fff;margin: 20px 0;padding: 0 40px 40px 40px;">
<h3 class="content-t">活动详情</h3> <h3 class="content-t content-t-l" style="text-align: left;">活动详情</h3>
<div class="models-details" v-html="detail.content"></div> <div class="models-details" v-html="detail.content"></div>
</div> </div>
<div class="content-r-link" style="width: 300px;background: #fff;margin: 20px 0;padding: 20px;"> <div class="content-r-link" style="width: 300px;background: #fff;margin: 20px 0;padding: 0 20px 20px 20px;">
<h3 class="content-t hot-t-r">热门活动</h3> <h3 class="content-t hot-t-r">热门活动</h3>
<div class="content-detail tc" v-for="item in hotList" :key="item.id"> <div class="content-detail tc" v-for="item in hotList" :key="item.id">
<img :src="item.banner" :alt="item.title" style="width: 190px;height: 120px;"/> <img :src="item.banner" :alt="item.title" style="width: 190px;height: 120px;"/>
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
async asyncData({ env, params, error}) { async asyncData({ env, params, error}) {
const { data } = await axios.get( '/api/uccn/summitActivity/app/unauth/'+params.id); const { data } = await axios.get( '/api/uccn/summitActivity/app/unauth/'+params.id);
let detail = data.data; let detail = data.data;
detail.content =detail.content.replace(/<img/g,"<img style='width:100%'"); detail.content =detail.content.replace(/<img/g,"<img style='width:90%'");
if (!detail) { if (!detail) {
return error({ message: 'detail not found', statusCode: 404 }) return error({ message: 'detail not found', statusCode: 404 })
} }
......
pages/index.vue
View file @ e66dcdde
This source diff could not be displayed because it is too large. You can view the blob instead.
pages/newsList/_id.vue
View file @ e66dcdde
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
let detail = data.data; let detail = data.data;
let tempBannerData = await axios.get('/api/uccn/article/app/unauth/three?type=1&number=3&id='+params.id); let tempBannerData = await axios.get('/api/uccn/article/app/unauth/three?type=1&number=3&id='+params.id);
let hot = tempBannerData.data.data; let hot = tempBannerData.data.data;
detail.text = detail.text.replace(/<img/g,"<img style='width:100%'"); detail.text = detail.text.replace(/<img/g,"<img style='width:90%'");
// detail.text = detail.text.replace(/font-size: 18px !important;/g,"font-size: 14px !important;color:#666;line-height: normal !important;"); // detail.text = detail.text.replace(/font-size: 18px !important;/g,"font-size: 14px !important;color:#666;line-height: normal !important;");
return {detail: detail, hotList: hot} return {detail: detail, hotList: hot}
}, },
......
pages/vehicle.vue
View file @ e66dcdde
...@@ -26,22 +26,24 @@ ...@@ -26,22 +26,24 @@
</div> </div>
<ul class="campsiteDetail clearfix"> <ul class="campsiteDetail clearfix">
<li v-for="item in dataDetail" :key="item.id" class="vehicle-item"> <li v-for="item in dataDetail" :key="item.id" class="vehicle-item">
<img class="v-img-cover" :src="item.coverPic" alt="房车租赁" />
<div style="margin-left: 20px;width: 800px;">
<h2 style="font-size: 18px;margin:10px 0">{{ item.name }}</h2>
<div class="vehicle-desc">{{item.intro}}</div>
<div class="flex-aic">
<span class="flex-aic config" v-for="(iitem,iindex) in item.uccnCataList" :key="iitem.id">
<img style="margin-right: 5px;" v-if="iindex==0" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNDMDRBRkVDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNDMDRBRkRDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlLS+CAAAADISURBVHjaYvz//z8DNQATA5UAdQ2aNWvWWyAOo8QgFigtBMRSQMMYgXQzENsC8XIgXgPENnj0vwHio2lpaf9Z0CS8gbgayrYD4o9AvIyAYxYAcSJ6GL1AYn8F4u9E+CoWI7CBTjwDpFyBuAHqvS1ALEgAiyCHEbJhe4DUHiShD8QENiMoQQIDGZQq7wPxMxIjiw+I3wItd0R20WMgPk+iQYZA7IDutfVAkyeQYgrQJwXQ2KV+FnlHRviAwHNYZDAO89xPDQAQYAC8zTagKPdHCQAAAABJRU5ErkJggg=="/>
<img style="margin-right: 5px;" v-if="iindex==1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNDMDRCMDJDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNDMDRCMDFDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PmkBcLEAAADwSURBVHjaYvz//z8DNQATA5UA1QxiARGzZs36CaTYyDTjV1paGjsLlPMdxCHHFKAjPsBdhCZhCKSCgPgeEC8CWvCXaK8hGaILpJYAcQcQ2wGxGRBnAsWDgXQsFv19WA0CAn8g7ge6YjFQ81Ig+wpUfB8Q38Vi0E1cBt0BGQY0ZB7UNa+h4oJArIDFoOe4DALZ6gvEL6Cal0DFFYHYAYtBD3AZ1A7E7kD8FJrGJgBdZw306l4gey+OWMNqECgtLUXicwCxAFBxDJAuwWJOAZwFymszZ878AKLJwTC91M0iIBrofHKLga8ggnH4FiMAAQYAZvR1GACV0mMAAAAASUVORK5CYII="/>
<img style="margin-right: 5px;" v-if="iindex==2" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNENUU3MTJDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNENUU3MTFDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhIc0EUAAAFvSURBVHjarJM9SwNBEIYv0UQUP5ImnQiW2qWzsEhjY3eF1lfk/oK/wb+QFFebIpWVTcDGLmBjI6hIMJAmKgQ1Rs5n4Y2ZO67zBh52bm/m3dnZ3UIcx14etpyeaLVabi6AU6hDFcbQhwuIwjCcpfMKtiJE9hi6UHMJ0IORvhtawH37iN1lCknkBq6gSeBrRrUVhjYcwYEVK5rtdCVyAj8med1ozfTfxXWVt6iIiSb+OezCVD3ZhyG4ynbgXf42fMADnFFV+68iNTbSdsrCVVLSgZQ1LsGK4iLleVaorsZa24At+ZvGn1tPeYnjr+o0PK3u7Nok3Rq/pHGkvITQWEfsqUfOjmEgkUP5q2zrXv9ryksI9XVPLs3KL/Asf4DAU2prDeUleuRubKB7MtWpvME3fMJXxn0KlJcQirTntkQqVPAIE9dkxqERKShupLyFkN6OrxvbgbV5AP+mqUo6ivPtm8v/reX6+v9jRS8n+xVgAORemfNTP4ZNAAAAAElFTkSuQmCC"/>
{{iitem.name}}
</span>
<nuxt-link :to="item.link"><span class="more-set">+更多配置</span></nuxt-link>
</div>
</div>
<nuxt-link :to="item.link" class="flex-aic"> <nuxt-link :to="item.link" class="flex-aic">
<button class="buttonDetails">租车详情<img style="position: absolute;" src="../assets/images/r.png"/></button> <img class="v-img-cover" :src="item.coverPic" alt="房车租赁" />
<div style="margin-left: 20px;width: 750px;">
<h2 style="font-size: 18px;margin:10px 0">{{ item.name }}</h2>
<div class="vehicle-desc">{{item.intro}}</div>
<div class="flex-aic">
<span class="flex-aic config" v-for="(iitem,iindex) in item.uccnCataList" :key="iitem.id">
<img style="margin-right: 5px;" v-if="iindex==0" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNDMDRBRkVDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNDMDRBRkRDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlLS+CAAAADISURBVHjaYvz//z8DNQATA5UAdQ2aNWvWWyAOo8QgFigtBMRSQMMYgXQzENsC8XIgXgPENnj0vwHio2lpaf9Z0CS8gbgayrYD4o9AvIyAYxYAcSJ6GL1AYn8F4u9E+CoWI7CBTjwDpFyBuAHqvS1ALEgAiyCHEbJhe4DUHiShD8QENiMoQQIDGZQq7wPxMxIjiw+I3wItd0R20WMgPk+iQYZA7IDutfVAkyeQYgrQJwXQ2KV+FnlHRviAwHNYZDAO89xPDQAQYAC8zTagKPdHCQAAAABJRU5ErkJggg=="/>
<img style="margin-right: 5px;" v-if="iindex==1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNDMDRCMDJDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNDMDRCMDFDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PmkBcLEAAADwSURBVHjaYvz//z8DNQATA5UA1QxiARGzZs36CaTYyDTjV1paGjsLlPMdxCHHFKAjPsBdhCZhCKSCgPgeEC8CWvCXaK8hGaILpJYAcQcQ2wGxGRBnAsWDgXQsFv19WA0CAn8g7ge6YjFQ81Ig+wpUfB8Q38Vi0E1cBt0BGQY0ZB7UNa+h4oJArIDFoOe4DALZ6gvEL6Cal0DFFYHYAYtBD3AZ1A7E7kD8FJrGJgBdZw306l4gey+OWMNqECgtLUXicwCxAFBxDJAuwWJOAZwFymszZ878AKLJwTC91M0iIBrofHKLga8ggnH4FiMAAQYAZvR1GACV0mMAAAAASUVORK5CYII="/>
<img style="margin-right: 5px;" v-if="iindex==2" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpkNmE3MjUyMi1mNmY3LWFlNGYtOTJlOS1kOTUwZjVjNDkxOTIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjNENUU3MTJDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjNENUU3MTFDRTNDMTFFOTk1MTdBMTE1MkRFRUFEMjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MGQ4MTBjN2ItZThlNC00ZDRiLTlkZDYtNjUzZDNhYTI4YjdjIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmQ2YTcyNTIyLWY2ZjctYWU0Zi05MmU5LWQ5NTBmNWM0OTE5MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhIc0EUAAAFvSURBVHjarJM9SwNBEIYv0UQUP5ImnQiW2qWzsEhjY3eF1lfk/oK/wb+QFFebIpWVTcDGLmBjI6hIMJAmKgQ1Rs5n4Y2ZO67zBh52bm/m3dnZ3UIcx14etpyeaLVabi6AU6hDFcbQhwuIwjCcpfMKtiJE9hi6UHMJ0IORvhtawH37iN1lCknkBq6gSeBrRrUVhjYcwYEVK5rtdCVyAj8med1ozfTfxXWVt6iIiSb+OezCVD3ZhyG4ynbgXf42fMADnFFV+68iNTbSdsrCVVLSgZQ1LsGK4iLleVaorsZa24At+ZvGn1tPeYnjr+o0PK3u7Nok3Rq/pHGkvITQWEfsqUfOjmEgkUP5q2zrXv9ryksI9XVPLs3KL/Asf4DAU2prDeUleuRubKB7MtWpvME3fMJXxn0KlJcQirTntkQqVPAIE9dkxqERKShupLyFkN6OrxvbgbV5AP+mqUo6ivPtm8v/reX6+v9jRS8n+xVgAORemfNTP4ZNAAAAAElFTkSuQmCC"/>
{{iitem.name}}
</span>
<span class="more-set">+更多配置</span>
</div>
</div>
<nuxt-link :to="item.link" class="flex-aic">
<button class="buttonDetails">租车详情<img style="position: absolute;" src="../assets/images/r.png"/></button>
</nuxt-link>
</nuxt-link> </nuxt-link>
</li> </li>
</ul> </ul>
......
pages/vehicleList/_id.vue
View file @ e66dcdde
...@@ -11,14 +11,14 @@ ...@@ -11,14 +11,14 @@
<div style="display: flex;padding: 20px;background: #fff;height: 536px;"> <div style="display: flex;padding: 20px;background: #fff;height: 536px;">
<div style="width:540px;" class="tc"> <div style="width:540px;" class="tc">
<div class="gallery-top-box" style="width:100%"> <div class="gallery-top-box" style="width:100%">
<div class="swiper-container gallery-top" style="width: 100%" ref="mySwiper"> <div class="swiper-container gallery-top" style="width: 540px;height: 388px;border:1px solid #eee;" ref="mySwiper">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in detail.pictureList" :key="item"> <div class="swiper-slide flex-fdc-jcc" v-for="item in detail.pictureList" :key="item">
<img :src="item"> <img :src="item">
</div> </div>
</div> </div>
</div> </div>
<div class="gallery-thumbs-box"> <div class="gallery-thumbs-box" style="margin-top: 10px;">
<div class="swiper-container gallery-thumbs"> <div class="swiper-container gallery-thumbs">
<div class="swiper-wrapper swiper-wrapper-thu"> <div class="swiper-wrapper swiper-wrapper-thu">
<div class="swiper-slide" v-for="(item,index) in detail.pictureList" :key="index" @click="changeImgIndex(index,detail.pictureList.length)"> <div class="swiper-slide" v-for="(item,index) in detail.pictureList" :key="index" @click="changeImgIndex(index,detail.pictureList.length)">
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
<span class="ft-20">预定用车</span> <span class="ft-20">预定用车</span>
<div v-if="isShowScan" class="scan"> <div v-if="isShowScan" class="scan">
<img src="../../assets/images/dfcapp.png" style="width: 90px;"/> <img src="../../assets/images/dfcapp.png" style="width: 90px;"/>
<div style="color: #FFB74B;font-size: 14px;">滴房车App</div> <div style="color: #FFB74B;font-size: 14px;">滴房车APP</div>
</div> </div>
<div v-if="isShowScan" class="scan-notice"> <div v-if="isShowScan" class="scan-notice">
<div>安卓用户微信扫码</div> <div>安卓用户微信扫码</div>
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
</div> </div>
</div> </div>
<div class="flex-jcb"> <div class="flex-jcb">
<div style="width: 800px;background: #fff;margin: 20px 0;padding: 20px;"> <div style="width: 800px;background: #fff;margin: 20px 0;padding: 0 20px 20px 20px;">
<h3 class="content-t content-t-l" style="text-align: left;">房车详情</h3> <h3 class="content-t content-t-l" style="text-align: left;">房车详情</h3>
<div class="models-details" v-html="detail.modelsDetails"></div> <div class="models-details" v-html="detail.modelsDetails"></div>
<h3 class="content-t">租车须知</h3> <h3 class="content-t">租车须知</h3>
...@@ -81,7 +81,7 @@ ...@@ -81,7 +81,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="content-r-link" style="width: 300px;background: #fff;margin: 20px 0;padding: 20px;"> <div class="content-r-link" style="width: 300px;background: #fff;margin: 20px 0;padding: 0 20px 20px 20px;">
<h3 class="content-t hot-t-r">热门车型</h3> <h3 class="content-t hot-t-r">热门车型</h3>
<div class="content-detail tc" v-for="item in hotList" :key="item.id"> <div class="content-detail tc" v-for="item in hotList" :key="item.id">
<img :src="item.coverPic" :alt="item.name" style="width: 161px;height: 116px;"/> <img :src="item.coverPic" :alt="item.name" style="width: 161px;height: 116px;"/>
...@@ -122,7 +122,7 @@ ...@@ -122,7 +122,7 @@
async asyncData({ env, params, route, error}) { async asyncData({ env, params, route, error}) {
const { data } = await axios.get('/api/uccn/vehicleModel/app/unauth/detail/'+route.query.name); const { data } = await axios.get('/api/uccn/vehicleModel/app/unauth/detail/'+route.query.name);
let user = data.data; let user = data.data;
data.data.modelsDetails = data.data.modelsDetails.replace(/<img/g,"<img style='width:100%'"); data.data.modelsDetails = data.data.modelsDetails.replace(/<img/g,"<img style='width:90%'");
data.data.modelParam = JSON.parse(data.data.modelParam ); data.data.modelParam = JSON.parse(data.data.modelParam );
let pic = data.data.picture.split(","); let pic = data.data.picture.split(",");
user.pictureList = pic; user.pictureList = pic;
...@@ -217,7 +217,8 @@ ...@@ -217,7 +217,8 @@
left: 200px; left: 200px;
top: 0px; top: 0px;
padding: 10px; padding: 10px;
box-shadow: 0 0 5px #FFB74B; /*box-shadow: 0 0 5px #FFB74B;*/
border:2px solid #ffb74b;
background: #FFF5E6; background: #FFF5E6;
cursor: auto; cursor: auto;
} }
...@@ -297,7 +298,7 @@ ...@@ -297,7 +298,7 @@
} }
.buttonDetails { .buttonDetails {
width: 180px; width: 180px;
padding: 10px 0; padding: 17px 0;
background: #1bbb9f; background: #1bbb9f;
cursor: pointer; cursor: pointer;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
...@@ -321,7 +322,7 @@ ...@@ -321,7 +322,7 @@
.vehicle-container .swiper-wrapper-thu img{ .vehicle-container .swiper-wrapper-thu img{
width: 103px !important; width: 103px !important;
height: 64px !important; height: 64px !important;
border: 2px solid #fff; border: 1px solid #eee;
} }
.vehicle-container .swiper-wrapper-thu img.active{ .vehicle-container .swiper-wrapper-thu img.active{
border: 2px solid #1bbb9f; border: 2px solid #1bbb9f;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment