Skip to content

S
sensorConsult
Commit b64f8888 authored by zhanglw's avatar zhanglw
Browse files
Options

页面调整

parent ced437c2
Show whitespace changes
Inline Side-by-side
Showing with 35 additions and 22 deletions
src/views/homepage/components/homeFooter.vue
View file @ b64f8888
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="footer-content"> <div class="footer-content">
<el-row :gutter="30"> <el-row :gutter="30">
<el-col v-for="(item,index) in dataList" :key="index" :span="4"> <el-col v-for="(item,index) in dataList" :key="index" :span="4">
<div class="title">{{ item.name }}</div> <div class="title-s">{{ item.name }}</div>
<div v-for="(t,i) in item.list" :key="'lb_'+i" class="label" :title="t.name"> <div v-for="(t,i) in item.list" :key="'lb_'+i" class="label" :title="t.name">
<a :href="t.url||'http://www.minestar.cn'" target="_blank"> <a :href="t.url||'http://www.minestar.cn'" target="_blank">
{{ t.name }} {{ t.name }}
...@@ -85,7 +85,7 @@ export default { ...@@ -85,7 +85,7 @@ export default {
color: #E8E6E6; color: #E8E6E6;
user-select: none; user-select: none;
z-index: 99; z-index: 99;
.title { .title-s {
margin: 30px 0; margin: 30px 0;
font-size: 26px; font-size: 26px;
} }
......
src/views/homepage/components/searchPanel.vue
View file @ b64f8888
...@@ -14,13 +14,13 @@ ...@@ -14,13 +14,13 @@
<span v-for="(item, index) in keywords" :key="index" class="label" @click="keywordClick(item, 'keyword')">{{ item }}</span> <span v-for="(item, index) in keywords" :key="index" class="label" @click="keywordClick(item, 'keyword')">{{ item }}</span>
</div> </div>
<div class="search-keyword-title"> <div class="search-keyword-title">
<div class="title">品牌</div> <div class="title-s">品牌</div>
</div> </div>
<div class="search-keyword-label"> <div class="search-keyword-label">
<span v-for="(item, index) in brands" :key="index" class="label" @click="keywordClick(item, 'brand')">{{ item }}</span> <span v-for="(item, index) in brands" :key="index" class="label" @click="keywordClick(item, 'brand')">{{ item }}</span>
</div> </div>
<div class="search-keyword-title"> <div class="search-keyword-title">
<div class="title">供应商</div> <div class="title-s">供应商</div>
</div> </div>
<div class="search-keyword-label"> <div class="search-keyword-label">
<span v-for="(item, index) in suppliers" :key="index" class="label" @click="keywordClick(item, 'supplier')">{{ item }}</span> <span v-for="(item, index) in suppliers" :key="index" class="label" @click="keywordClick(item, 'supplier')">{{ item }}</span>
...@@ -109,11 +109,12 @@ export default { ...@@ -109,11 +109,12 @@ export default {
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
color: #FFFFFF; color: #FFFFFF;
.title { .title-s {
width: 126px; width: 126px;
padding: 7px; padding: 7px;
border: 1px solid rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 20px; border-radius: 20px;
color: #FFFFFF;
} }
} }
.search-keyword-label { .search-keyword-label {
......
src/views/homepage/components/titleMenus.vue
View file @ b64f8888
<template> <template>
<div class="menus-box"> <div class="menus-box">
<span v-for="(item, index) in menus" :key="index" class="menus-item" :class="currentMenuObj===item?'active':''" @click="menuClick(item)">{{ item.name }}</span> <span v-for="(item, index) in menus" :key="index" class="menus-item" :class="(currentMenuObj===item?'active':'')+(index===menus.length-1?'tc-orange':'')" @click="menuClick(item)">
{{ item.name }}
</span>
</div> </div>
</template> </template>
<script> <script>
...@@ -28,6 +30,9 @@ export default { ...@@ -28,6 +30,9 @@ export default {
} }
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>
.tc-orange {
color: #F7601A !important;
}
.menus-box { .menus-box {
.menus-item { .menus-item {
padding: 1px 15px 1px; padding: 1px 15px 1px;
......
src/views/homepage/components/titleMenusV2.vue
View file @ b64f8888
<template> <template>
<div class="menus-box"> <div class="menus-box">
<div v-for="(item, index) in menus" :key="index" class="menus-item" :class="currentMenuObj===item?'active':''" @click="menuClick(item)"> <div v-for="(item, index) in menus" :key="index" class="menus-item" :class="(currentMenuObj===item?'active':'')+(index===menus.length-1?'tc-orange':'')" @click="menuClick(item)">
{{ item.name }} {{ item.name }}
<div v-if="currentMenuObj===item" class="menus-line"><div /></div> <div v-if="currentMenuObj===item" class="menus-line"><div /></div>
</div> </div>
...@@ -37,6 +37,9 @@ export default { ...@@ -37,6 +37,9 @@ export default {
} }
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>
.tc-orange {
color: #F7601A !important;
}
.menus-box { .menus-box {
.menus-item { .menus-item {
position: relative; position: relative;
......
src/views/homepage/index.vue
View file @ b64f8888
...@@ -37,8 +37,8 @@ ...@@ -37,8 +37,8 @@
<div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div> <div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" @click="storeShowcase(item, 'product')"> <img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" title="点击取消收藏" @click="storeShowcase(item, 'product')">
<img v-else class="touch" src="@/assets/home_images/to_like.png" @click="storeShowcase(item, 'product')"> <img v-else class="touch" src="@/assets/home_images/to_like.png" title="点击收藏" @click="storeShowcase(item, 'product')">
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
...@@ -81,8 +81,8 @@ ...@@ -81,8 +81,8 @@
<div class="title touch" :title="item.title" @click="goToDetails(item, 'supplier')">{{ item.title }}</div> <div class="title touch" :title="item.title" @click="goToDetails(item, 'supplier')">{{ item.title }}</div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" @click="storeShowcase(item, 'supplier')"> <img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" title="点击取消收藏" @click="storeShowcase(item, 'supplier')">
<img v-else class="touch" src="@/assets/home_images/to_like.png" @click="storeShowcase(item, 'supplier')"> <img v-else class="touch" src="@/assets/home_images/to_like.png" title="点击收藏" @click="storeShowcase(item, 'supplier')">
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
...@@ -109,7 +109,7 @@ ...@@ -109,7 +109,7 @@
<el-row :gutter="20" style="padding-top: 20px"> <el-row :gutter="20" style="padding-top: 20px">
<el-col :span="8"><div class="top_area" /></el-col> <el-col :span="8"><div class="top_area" /></el-col>
<el-col :span="8"><div class="box-toplist"> <el-col :span="8"><div class="box-toplist">
<div class="title">供应商TOP</div> <div class="title">供应商TOP8</div>
<ul class="contact-list"> <ul class="contact-list">
<li v-for="(item, index) in topSuppliers" :key="'ts_'+index" class="contact-item"> <li v-for="(item, index) in topSuppliers" :key="'ts_'+index" class="contact-item">
<img src="@/assets/home_images/to_like_b.png"> <img src="@/assets/home_images/to_like_b.png">
...@@ -118,7 +118,7 @@ ...@@ -118,7 +118,7 @@
</ul> </ul>
</div></el-col> </div></el-col>
<el-col :span="8"><div class="box-toplist"> <el-col :span="8"><div class="box-toplist">
<div class="title">产品TOP</div> <div class="title">产品TOP8</div>
<ul class="contact-list"> <ul class="contact-list">
<li v-for="(item, index) in topProducts" :key="'tp_'+index" class="contact-item"> <li v-for="(item, index) in topProducts" :key="'tp_'+index" class="contact-item">
<img src="@/assets/home_images/to_like_a.png"> <img src="@/assets/home_images/to_like_a.png">
...@@ -160,6 +160,7 @@ import languageSetting from './components/languageSetting' ...@@ -160,6 +160,7 @@ import languageSetting from './components/languageSetting'
import searchPanel from './components/searchPanel' import searchPanel from './components/searchPanel'
import homeFooter from './components/homeFooter' import homeFooter from './components/homeFooter'
import inquiryView from './components/inquiryView' import inquiryView from './components/inquiryView'
import NProgress from 'nprogress'
export default { export default {
components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter, inquiryView }, components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter, inquiryView },
...@@ -359,8 +360,6 @@ export default { ...@@ -359,8 +360,6 @@ export default {
{ name: '中山市三角镇凌创传感器厂', id: 123 }, { name: '中山市三角镇凌创传感器厂', id: 123 },
{ name: '中山市三角镇凌创传感器厂', id: 123 }, { name: '中山市三角镇凌创传感器厂', id: 123 },
{ name: '中山市三角镇凌创传感器厂', id: 123 }, { name: '中山市三角镇凌创传感器厂', id: 123 },
{ name: '中山市三角镇凌创传感器厂', id: 123 },
{ name: '中山市三角镇凌创传感器厂', id: 123 },
{ name: '中山市三角镇凌创传感器厂', id: 123 } { name: '中山市三角镇凌创传感器厂', id: 123 }
], ],
topProducts: [ topProducts: [
...@@ -371,8 +370,6 @@ export default { ...@@ -371,8 +370,6 @@ export default {
{ name: 'wiwo1002热能工程压力变送器', id: 123 }, { name: 'wiwo1002热能工程压力变送器', id: 123 },
{ name: 'wiwo1002热能工程压力变送器', id: 123 }, { name: 'wiwo1002热能工程压力变送器', id: 123 },
{ name: 'wiwo1002热能工程压力变送器', id: 123 }, { name: 'wiwo1002热能工程压力变送器', id: 123 },
{ name: 'wiwo1002热能工程压力变送器', id: 123 },
{ name: 'wiwo1002热能工程压力变送器', id: 123 },
{ name: 'wiwo1002热能工程压力变送器', id: 123 } { name: 'wiwo1002热能工程压力变送器', id: 123 }
], ],
partners: [ partners: [
...@@ -416,6 +413,9 @@ export default { ...@@ -416,6 +413,9 @@ export default {
// 点击收藏 // 点击收藏
storeShowcase(item, type) { storeShowcase(item, type) {
item.isStore = !item.isStore item.isStore = !item.isStore
this.$message.warning({
message: `您${item.isStore ? '' : '已取消'}收藏了该产品！`
})
console.log(item, type) console.log(item, type)
}, },
// 跳转到详情 // 跳转到详情
...@@ -547,7 +547,7 @@ export default { ...@@ -547,7 +547,7 @@ export default {
} }
.top_area { .top_area {
width: 100%; width: 100%;
height: 552px; height: 492px;
background: url("../../assets/home_images/top_area.png") no-repeat; background: url("../../assets/home_images/top_area.png") no-repeat;
background-size:100% 100%; background-size:100% 100%;
} }
...@@ -566,9 +566,9 @@ export default { ...@@ -566,9 +566,9 @@ export default {
font-weight: 600; font-weight: 600;
} }
.contact-list { .contact-list {
padding: 0 0 20px; padding: 15px 0;
margin: 0; margin: 0;
height: 500px; height: 440px;
overflow: hidden; overflow: hidden;
.contact-item { .contact-item {
display: inherit; display: inherit;
......
src/views/homepage/product/index.vue
View file @ b64f8888
...@@ -96,8 +96,8 @@ ...@@ -96,8 +96,8 @@
<div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div> <div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" @click="storeShowcase(item, 'product')"> <img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" title="点击取消收藏" @click="storeShowcase(item, 'product')">
<img v-else class="touch" src="@/assets/home_images/to_like.png" @click="storeShowcase(item, 'product')"> <img v-else class="touch" src="@/assets/home_images/to_like.png" title="点击收藏" @click="storeShowcase(item, 'product')">
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
...@@ -187,6 +187,7 @@ import languageSetting from '../components/languageSettingV2' ...@@ -187,6 +187,7 @@ import languageSetting from '../components/languageSettingV2'
import breadcrumb from '../components/breadcrumb' import breadcrumb from '../components/breadcrumb'
import homeFooter from '../components/homeFooter' import homeFooter from '../components/homeFooter'
import inquiryView from '../components/inquiryView' import inquiryView from '../components/inquiryView'
import NProgress from 'nprogress'
export default { export default {
components: { titleMenus, userLogin, languageSetting, breadcrumb, homeFooter, inquiryView }, components: { titleMenus, userLogin, languageSetting, breadcrumb, homeFooter, inquiryView },
...@@ -368,6 +369,9 @@ export default { ...@@ -368,6 +369,9 @@ export default {
// 点击收藏 // 点击收藏
storeShowcase(item, type) { storeShowcase(item, type) {
item.isStore = !item.isStore item.isStore = !item.isStore
this.$message.warning({
message: `您${item.isStore ? '' : '已取消'}收藏了该产品！`
})
console.log(item, type) console.log(item, type)
}, },
// 跳转到详情 // 跳转到详情
......
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