Skip to content

H
hls-xcmg-vue-app
Commit d9553176 authored by 786817560's avatar 786817560
Browse files
Options

'产品查询'

parent a6da5565
Hide whitespace changes
Inline Side-by-side
Showing with 131 additions and 42 deletions
src/pages/productQuery/product-list.vue
View file @ d9553176
......@@ -18,7 +18,7 @@
<img src="@/assets/distributorSign/search.png" alt="">
</div>
</div>
<list-item v-for="item in lists" :item-height="102" :key="item.product_id">
<list-item v-for="item in lists" :key="item.product_id">
<item>
<div slot="name" class="item-pic">
<img src="@/assets/homePage/WechatIMG2 Copy@2x.png" alt="">
......@@ -135,7 +135,7 @@ export default {
.arrow {
width: 16px;
height: 16px;
margin-left: 30px;
// margin-left: 30px;
margin-top: 16px;
}
.item-pic {
......@@ -147,19 +147,21 @@ export default {
}
}
.item-content {
height: 102px;
// width: 100%;
// height: 102px;
width: 100%;
margin-left: 20px;
.center:nth-of-type(1) {
margin-top: 16px;
}
.center:nth-of-type(2) {
margin-top: 10px;
margin-top: 6px;
}
.center:nth-of-type(3) {
margin-top: 10px;
margin-top: 6px;
}
.center {
// margin-top: 6px;
// white-space: nowrap;
font-family: PingFangSC-Semibold;
font-size: 13px;
color: rgba(56,63,69,0.60);
......@@ -172,10 +174,13 @@ export default {
color: rgba(56,63,69,0.60);
}
.seconds {
margin-left: 20px;
margin-left: 16px;
font-family: PingFangSC-Regular;
font-size: 13px;
color: #383F45;
// white-space: nowrap;
// overflow: hidden;
// text-overflow: ellipsis;
}
}
}
......
src/pages/productQuery/query-home.vue
View file @ d9553176
......@@ -2,7 +2,7 @@
* @Descrip: 查询首页
* @Author: your name
* @Date: 2019-10-15 14:30:00
* @LastEditTime: 2019-10-16 15:55:05
* @LastEditTime: 2019-10-17 13:33:48
* @LastEditors: Please set LastEditors
-->
<template>
......@@ -20,9 +20,9 @@
<img src="@/assets/distributorSign/search.png" alt="">
</div>
</div>
<div v-for="item in prolists" :key="item.factory_bp_id" class="wrap">
<div v-for="(item,index) in prolists" :key="index" class="wrap">
<div class="box" @click="goLists(item.division)">
<div class="box">
<div class="first">
<img src="@/assets/productQuery/product-query.png" alt="">
<p class="product-class">产品类别</p>
......@@ -30,10 +30,17 @@
</div>
<div class="second">
<p class="product-class">产品线</p>
<p class="product">{{ item.division_n }}</p>
<img src="@/assets/productQuery/pull.png" alt="">
<div class="product">
<p>{{ item.division_n }}</p>
<div v-for="items in divisionList" v-if="list_flag&&item.factory_bp_id === factory_bp_id " :key="items.division" class="division-lists">
<div>
<p @click="checkDivision(items.product_line,items.division,index)">{{ items.product_line }}</p>
</div>
</div>
</div>
<img src="@/assets/productQuery/pull.png" alt="" @click="queryDivision(item.factory_bp_id)">
</div>
<img class="arrow" src="@/assets/productQuery/getIn.png" alt="">
<img class="arrow" src="@/assets/productQuery/getIn.png" alt="" @click="goLists(item.division)">
</div>
</div>
</h-content>
......@@ -46,6 +53,9 @@ export default {
data () {
return {
prolists: [],
divisionList: [],
list_flag: false,
factory_bp_id: '',
}
},
computed: {},
......@@ -84,6 +94,28 @@ export default {
},
})
},
queryDivision (val) {
let vm = this
let url = $config.basePath + 'prd_product_division_list'
let param = {
factory_bp_id: val,
}
vm.$post(url, param).then(function (res) {
console.log(res)
if (res.result === 'S') {
vm.divisionList = res.lists
vm.list_flag = !vm.list_flag
vm.factory_bp_id = val
} else {
hlsPopup.showLongCenter(res.message)
}
})
},
checkDivision (val, division, index) {
this.prolists[index].division_n = val
this.prolists[index].division = division
this.list_flag = !this.list_flag
},
},
}
</script>
......@@ -184,7 +216,28 @@ export default {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #383F45;
margin-left: 16px
margin-left: 16px;
.division-lists {
width: 100%;
height: auto;
position: relative;
z-index: 1000;
border: 1px solid #ccc;
border-bottom: none;
// margin-top: 4px;
div {
background: #fff;
//border: 1px solid #ccc;
p {
width: 100%;
height: 24px;
line-height: 24px;
border-bottom: 1px solid #ccc;
// text-align: center
}
}
}
}
img {
width: 16px;
......
src/pages/productQuery/tab.vue
View file @ d9553176
......@@ -2,33 +2,36 @@
* @Description: 详情tab
* @Author: your name
* @Date: 2019-09-25 19:47:59
* @LastEditTime: 2019-10-16 09:29:53
* @LastEditTime: 2019-10-17 10:55:24
* @LastEditors: Please set LastEditors
-->
<template>
<div class="tab-style">
<span @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?check1:uncheck1"></span>
<span @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?check2:uncheck2" ></span>
<span @click="tabNum = 2;sendTabNum()"><img :src="tabNum == 2?check3:uncheck3"></span>
<div :class="{'tab-content-bg':tabNum == 0}" class="tab-content" @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?baseInfo:unBaseInfo"><span
:class="{'colored':tabNum == 0}">基本信息</span></div>
<div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?detail:unDetail"><span
:class="{'colored':tabNum == 1}">商品详情</span></div>
<div :class="{'tab-content-bg':tabNum == 2}" class="tab-content" @click="tabNum = 2;sendTabNum()"><img :src="tabNum == 2?config:unConfig"><span
:class="{'colored':tabNum == 2}">产品配置</span></div>
</div>
</template>
<script>
import check1 from '@/assets/distributorSign/check1.png'
import check2 from '@/assets/distributorSign/check2.png'
import check3 from '@/assets/distributorSign/guaranteed.png'
import uncheck1 from '@/assets/distributorSign/uncheck1.png'
import uncheck2 from '@/assets/distributorSign/uncheck2.png'
import uncheck3 from '@/assets/distributorSign/guarantee.png'
import baseInfo from '@/assets/productQuery/baseInfo.png'
import unBaseInfo from '@/assets/productQuery/unBaseInfo.png'
import detail from '@/assets/productQuery/detail.png'
import unDetail from '@/assets/productQuery/unDetail.png'
import config from '@/assets/productQuery/config.png'
import unConfig from '@/assets/productQuery/unConfig.png'
export default {
data () {
return {
tabNum: 0,
check1: check1,
check2: check2,
check3: check3,
uncheck1: uncheck1,
uncheck2: uncheck2,
uncheck3: uncheck3,
baseInfo: baseInfo,
unBaseInfo: unBaseInfo,
detail: detail,
unDetail: unDetail,
config: config,
unConfig: unConfig,
}
},
methods: {
......@@ -49,19 +52,47 @@ export default {
padding-bottom: 8px;
align-items: center;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
span{
display: block;
width:112px;
height: 32px;
border-radius:16px;
.tab-content {
display: block;
width: 33%;
height: 32px;
background: rgba(220, 220, 221, 0.26);
border-radius: 16px;
display: flex;
justify-content: center;
align-items: center;
span {
margin-left: 2%;
font-size: 14px;
color: #383F45;
font-weight: 600;
font-family: PingFangSC-Semibold;
}
.colored {
color: #00469C
}
}
img{
width:112px;
height: 32px;
margin-right:5.7px;
.tab-content-bg{
background: rgba(0,70,156,0.10);
}
span:nth-of-type(2){
margin:0 10px;
.tab-content:nth-of-type(1) {
margin-left: 12px
}
img {
height: 16px;
// margin-right:5.7px;
}
.tab-content:nth-of-type(2) {
margin-left: 8px;
}
.tab-content:nth-of-type(3) {
margin-left: 8px;
margin-right: 4px;
}
}
</style>
src/router/index.js
View file @ d9553176
......@@ -2,7 +2,7 @@
* @Description: In User Settings Edit
* @Author: your name
* @Date: 2019-09-24 12:34:06
* @LastEditTime: 2019-10-16 19:08:10
* @LastEditTime: 2019-10-17 11:02:08
* @LastEditors: Please set LastEditors
*/
import Vue from 'vue'
......
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