Commit 4f737c16 authored by zhanglw's avatar zhanglw

首页产品二级分类

parent cd803054
...@@ -461,7 +461,7 @@ export const HttpReq = { ...@@ -461,7 +461,7 @@ export const HttpReq = {
// 产品-硬件查询列表 // 产品-硬件查询列表
productGetHardwareList: function(params) { productGetHardwareList: function(params) {
return request({ return request({
url: '/api/bsw/bigScreen/highQualityProducts/productList?' + qs.stringify(params, { indices: false }), url: '/api/bsw/bigScreen/highQualityProducts?' + qs.stringify(params, { indices: false }),
method: 'get' method: 'get'
}) })
}, },
......
...@@ -62,7 +62,8 @@ export const constantRouterMap = [ ...@@ -62,7 +62,8 @@ export const constantRouterMap = [
hidden: true hidden: true
}, },
{ {
path: '/product/hardware/:type', path: '/product/hardware',
name: 'hardware',
meta: { title: '硬件产品', noCache: true }, meta: { title: '硬件产品', noCache: true },
component: (resolve) => { component: (resolve) => {
return require(['@/views/homepage/product/hardware'], resolve) return require(['@/views/homepage/product/hardware'], resolve)
......
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="app-container"> <div class="app-container">
<!--工具栏--> <!--工具栏-->
<div class="head-container"> <div class="head-container">
<!-- <el-select v-model="query.productType" clearable placeholder="请选择产品类型" style="width: 150px">--> <!-- <el-select v-model="query.productType" clearable placeholder="请选择产品类型" style="width: 150px">-->
<!-- <el-option v-for="item in dict.product_type" :key="item.value" :label="item.label" :value="item.value" />--> <!-- <el-option v-for="item in dict.product_type" :key="item.value" :label="item.label" :value="item.value" />-->
<!-- </el-select>--> <!-- </el-select>-->
<el-select v-model="query.status" clearable placeholder="请选择状态" style="width: 120px"> <el-select v-model="query.status" clearable placeholder="请选择状态" style="width: 120px">
<el-option v-for="item in dict.issue_status" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in dict.issue_status" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
<div class="content"> <div class="content">
<el-table id="dataTable" ref="dataTable" v-loading="loading" :data="tableData" tooltip-effect="dark" style="width:auto;min-height: 70vh"> <el-table id="dataTable" ref="dataTable" v-loading="loading" :data="tableData" tooltip-effect="dark" style="width:auto;min-height: 70vh">
<el-table-column type="index" width="55" label="序号" :index="indexMethod" /> <el-table-column type="index" width="55" label="序号" :index="indexMethod" />
<el-table-column prop="productType" label="产品类型名称"/> <el-table-column prop="productType" label="产品类型名称" />
<el-table-column label="状态" width="100"> <el-table-column label="状态" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<div :style="'color:'+textColors[scope.row.status]">{{ dict.label.issue_status[scope.row.status] }}</div> <div :style="'color:'+textColors[scope.row.status]">{{ dict.label.issue_status[scope.row.status] }}</div>
......
...@@ -16,7 +16,21 @@ ...@@ -16,7 +16,21 @@
<div class="btn-o" style="padding: 10px" @click="goToDetails(null, '/publish/buyInfo/all')">我要采购</div> <div class="btn-o" style="padding: 10px" @click="goToDetails(null, '/publish/buyInfo/all')">我要采购</div>
</div> </div>
<div class="line-btn" style="padding-top: 30px"> <div class="line-btn" style="padding-top: 30px">
<div v-for="(item,index) in dict.product_type" :key="index" class="btn-b" :class="currentProductTypeObj===item?'active':''" @mouseenter="changeProductPush(item)">{{ item.label }}</div> <div v-for="(item,index) in dict.product_type" :key="index" @mouseenter="changeProductPush(item)">
<div v-if="index<4">
<el-dropdown placement="bottom">
<div class="btn-b" :class="currentProductTypeObj===item?'active':''">{{ item.label }}</div>
<el-dropdown-menu slot="dropdown" style="width: 170px;text-align: center;">
<router-link v-for="(t,i) in subTypeOpts" :key="'st_'+i" :to="{'name':'hardware',params:{'type':currentProductTypeObj.value,'subType':t.value}}">
<el-dropdown-item style="font-size: 16px;padding: 5px;font-weight: bold;">
{{ t.label }}
</el-dropdown-item>
</router-link>
</el-dropdown-menu>
</el-dropdown>
</div>
<div v-else class="btn-b" :class="currentProductTypeObj===item?'active':''">{{ item.label }}</div>
</div>
</div> </div>
<div class="content-box"> <div class="content-box">
<div class="showcase"> <div class="showcase">
...@@ -172,7 +186,7 @@ import { HttpReq } from '@/api/common' ...@@ -172,7 +186,7 @@ import { HttpReq } from '@/api/common'
export default { export default {
components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter, inquiryView }, components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter, inquiryView },
dicts: ['product_type', 'area_province'], dicts: ['product_type', 'product_type_1', 'product_type_2', 'product_type_3', 'product_type_4', 'product_type_5', 'product_type_6', 'product_type_7', 'area_province'],
data() { data() {
return { return {
color: ['#C1232B', '#27727B', '#FCCE10', '#E87C25', '#B5C334', '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD', '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'], color: ['#C1232B', '#27727B', '#FCCE10', '#E87C25', '#B5C334', '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD', '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'],
...@@ -181,96 +195,8 @@ export default { ...@@ -181,96 +195,8 @@ export default {
imgSrcStart: process.env.VUE_APP_BASE_API, imgSrcStart: process.env.VUE_APP_BASE_API,
query: {}, query: {},
currentProductTypeObj: null, currentProductTypeObj: null,
showcaseProducts: [ subTypeOpts: [],
{ showcaseProducts: [],
isGood: true,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: true,
isHot: true,
isStore: true,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: true,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: true,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: true,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: true,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
}
],
showcaseSuppliers: [], showcaseSuppliers: [],
topAreas: [], topAreas: [],
topSuppliers: [], topSuppliers: [],
...@@ -317,6 +243,7 @@ export default { ...@@ -317,6 +243,7 @@ export default {
methods: { methods: {
onDictReady(dict) { onDictReady(dict) {
this.currentProductTypeObj = dict.product_type[0] this.currentProductTypeObj = dict.product_type[0]
this.subTypeOpts = this.dict['product_type_' + this.currentProductTypeObj.value]
HttpReq.webClientApi.homePageGetProduct({ HttpReq.webClientApi.homePageGetProduct({
preview: false, preview: false,
productType: this.currentProductTypeObj.value productType: this.currentProductTypeObj.value
...@@ -331,13 +258,14 @@ export default { ...@@ -331,13 +258,14 @@ export default {
if (this.currentProductTypeObj === item) { if (this.currentProductTypeObj === item) {
return return
} }
this.currentProductTypeObj = item
this.subTypeOpts = this.dict['product_type_' + this.currentProductTypeObj.value]
HttpReq.webClientApi.homePageGetProduct({ HttpReq.webClientApi.homePageGetProduct({
preview: false, preview: false,
productType: this.currentProductTypeObj.value productType: this.currentProductTypeObj.value
}).then((res) => { }).then((res) => {
this.showcaseProducts = res.data.showcaseProducts this.showcaseProducts = res.data.showcaseProducts
}) })
this.currentProductTypeObj = item
}, this.throttleTime) }, this.throttleTime)
}, },
// 点击询价 // 点击询价
...@@ -382,7 +310,13 @@ export default { ...@@ -382,7 +310,13 @@ export default {
this.$router.push({ path: `/course` }) this.$router.push({ path: `/course` })
break break
default: default:
this.$router.push({ path: `/product/hardware/${this.currentProductTypeObj.value}` }) this.$router.push({
name: 'hardware',
params: {
type: this.currentProductTypeObj.value,
subType: ''
}
})
} }
} }
}, },
......
...@@ -21,7 +21,13 @@ ...@@ -21,7 +21,13 @@
<!--查询面板--> <!--查询面板-->
<div class="search-box"> <div class="search-box">
<el-row style="padding-top: 16px"> <el-row style="padding-top: 16px">
<el-col :span="2"><div class="area-title">地区选择</div></el-col> <el-col :span="2"><div class="area-title">分类</div></el-col>
<el-col :span="22" style="border: 1px solid rgba(0,0,0,0.12);">
<div v-for="(item,index) in subTypeOpts" :key="'st_'+index" class="area_item touch" :class="query.subType===item.value?'active':''" @click="query.subType=item.value">{{ item.label }}</div>
</el-col>
</el-row>
<el-row>
<el-col :span="2"><div class="area-title" style="height: 62px;line-height: 60px;">地区选择</div></el-col>
<el-col :span="22" style="border: 1px solid rgba(0,0,0,0.12);"> <el-col :span="22" style="border: 1px solid rgba(0,0,0,0.12);">
<div v-for="(item,index) in areaOpts" :key="'a_'+index" class="area_item touch" :class="query.area===item.value?'active':''" @click="query.area=item.value">{{ item.label }}</div> <div v-for="(item,index) in areaOpts" :key="'a_'+index" class="area_item touch" :class="query.area===item.value?'active':''" @click="query.area=item.value">{{ item.label }}</div>
</el-col> </el-col>
...@@ -140,7 +146,7 @@ import floatBtn from '../components/floatBtn' ...@@ -140,7 +146,7 @@ import floatBtn from '../components/floatBtn'
export default { export default {
components: { titleMenus, userLogin, languageSetting, homeFooter, inquiryView, floatBtn }, components: { titleMenus, userLogin, languageSetting, homeFooter, inquiryView, floatBtn },
dicts: ['product_type', 'area_province'], dicts: ['product_type', 'product_type_1', 'product_type_2', 'product_type_3', 'product_type_4', 'product_type_5', 'product_type_6', 'product_type_7', 'area_province'],
data() { data() {
return { return {
defaultImgProduct: default_product, defaultImgProduct: default_product,
...@@ -153,9 +159,11 @@ export default { ...@@ -153,9 +159,11 @@ export default {
keyword: '', keyword: '',
area: '', area: '',
type: '', type: '',
subType: '',
sort: false sort: false
}, },
areaOpts: [], areaOpts: [],
subTypeOpts: [],
keywords: ['曲线记录仪', '液位控制器', '双金属温度计', '位移传感器'], keywords: ['曲线记录仪', '液位控制器', '双金属温度计', '位移传感器'],
hardwareList: [ hardwareList: [
{ {
...@@ -286,13 +294,14 @@ export default { ...@@ -286,13 +294,14 @@ export default {
}, },
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
this.query = Object.assign(this.query, this.$route.params)
}) })
}, },
methods: { methods: {
onDictReady(dict) { onDictReady(dict) {
this.areaOpts = [{ value: '', label: '全部' }, ...dict.area_province] this.areaOpts = [{ value: '', label: '全部' }, ...dict.area_province]
this.title = dict.product_type[this.$route.params.type - 1].label this.title = dict.product_type[this.$route.params.type - 1].label
this.subTypeOpts = [{ value: '', label: '全部' }, ...dict['product_type_' + this.query.type]]
}, },
keywordClick(item, type) { keywordClick(item, type) {
this.query.keyword = item this.query.keyword = item
...@@ -579,11 +588,11 @@ export default { ...@@ -579,11 +588,11 @@ export default {
} }
} }
.area-title { .area-title {
height: 62px;
background: #F7F7F7; background: #F7F7F7;
border: 1px solid rgba(0,0,0,0.12); border: 1px solid rgba(0,0,0,0.12);
text-align: center; text-align: center;
line-height: 60px; height: 32px;
line-height: 32px;
} }
.area_item { .area_item {
height: 30px; height: 30px;
......
This diff is collapsed.
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