Hooke / hager

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
ade17e49 1 parent 7ef88cf7

hover效果优化

Inline Side-by-side
Showing 5 changed files with 25 additions and 6 deletions
<!--
* @Date: 2024-08-27 10:06:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-11-01 17:31:10
* @LastEditTime: 2024-11-04 17:41:28
* @FilePath: /hager/src/views/index.vue
* @Description: 首页
-->
......@@ -533,12 +533,15 @@ export default {
.news-item-more {
border: 0.08rem solid #F56400;
color: #F56400;
background-color: #FFF;
padding: 0.5rem 1rem;
width: 5rem;
text-align: center;
font-size: 0.8rem;
transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out;
&:hover {
color: #FFF;
background-color: #F56400;
cursor: pointer;
}
}
......
<!--
* @Date: 2024-10-18 12:05:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-31 12:59:24
* @LastEditTime: 2024-11-04 17:42:55
* @FilePath: /hager/src/views/news/index.vue
* @Description: 文件描述
-->
......@@ -175,11 +175,15 @@ export default {
.news-item-more {
border: 0.08rem solid #F56400;
color: #F56400;
background-color: #FFF;
padding: 0.5rem 1rem;
width: 5rem;
text-align: center;
font-size: 0.8rem;
transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out;
&:hover {
color: #FFF;
background-color: #F56400;
cursor: pointer;
// background-color: #F56400;
// color: #FFF;
......
<!--
* @Date: 2024-09-29 14:26:41
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-11-04 16:48:49
* @LastEditTime: 2024-11-04 17:13:32
* @FilePath: /hager/src/views/product/detail.vue
* @Description: 文件描述
-->
......@@ -55,7 +55,7 @@
</div>
</div>
</hager-box>
<hager-box v-if="is_enable" class="box-n">
<hager-box v-if="is_enable && !is_file" class="box-n">
<hager-h1 title="产品资料" sub="Product Information"></hager-h1>
<div class="product-info">
<div class="info-control">
......@@ -159,6 +159,7 @@ export default {
checked_items: [],
is_login: false,
is_enable: true, // 产品是否有效
is_file: false, // 是否有产品资料
}
},
computed: {
......@@ -231,6 +232,9 @@ export default {
if (this.info.file?.img) {
this.info_images = this.info.file.img.map(item => item.value);
}
// if (!this.info_images.length) { // 没有图片
// this.info_images.push('https://cdn.ipadbiz.cn/hager/img/no-product-img.png');
// }
// 产品优势
this.product_advantages = this.splitIntoEqualChunks(this.info.product_advantages);
// 产品资料数据结构
......@@ -250,6 +254,8 @@ export default {
break;
}
}
// 判断是否有产品资料
this.is_file = this.download_list.filter(item => item.list.length).length === 0;
// 设置页面标题
document.title = this.info.product_name + ' | Hager China';
}
......
<!--
* @Date: 2024-09-27 16:53:09
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-11-04 16:48:01
* @LastEditTime: 2024-11-04 17:34:49
* @FilePath: /hager/src/views/product/index.vue
* @Description: 文件描述
-->
......@@ -119,6 +119,7 @@ export default {
this.category_name = info.category_name;
this.category_name_en = info.category_name_en;
this.product_list = info.list;
console.warn(info.list);
this.search_keyword = '';
// 获取当前类别的内容
this.cate_id = info.category_parent ? info.category_parent : info.id; // 同一个值，在不同层级下名字不一样
......@@ -141,6 +142,7 @@ export default {
if (this.search_keyword) { // 产品有值时操作
const { code, data } = await getProductSearchAPI({ keyword: this.search_keyword });
if (code) {
console.warn(data);
this.product_list = data;
this.is_search = true;
this.keyword = this.search_keyword;
......
......@@ -352,8 +352,12 @@ export default {
color: #F56400;
padding: 0.5rem 2rem;
border: 1px solid #F56400;
background-color: #FFF;
margin: 1rem 0;
transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out;
&:hover {
color: #FFF;
background-color: #F56400;
cursor: pointer;
}
}
......