Skip to content

H
hls-xcmg-vue-app
Commit fe0e16d1 authored by 李晓兵's avatar 李晓兵
Browse files
Options

Merge branch 'develop' of https://hel.hand-china.com/xugong/hls-xcmg-vue-app into develop

parents d12d1dff 95428dd6
Show whitespace changes
Inline Side-by-side
Showing with 236 additions and 4 deletions
src/pages/productQuery/product-detailed.vue
View file @ fe0e16d1
<!--
* @Descrip: 查询首页
* @Author: your name
* @Date: 2019-10-15 14:30:00
* @LastEditTime: 2019-10-16 09:26:38
* @LastEditors: Please set LastEditors
-->
<template>
<h-view id="query" class="public-style" title="产品查询">
<h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>产品明细</span>
</div>
</h-header>
<Tab @getTabNum="getTabNum" />
<h-content/>
</h-view>
</template>
<script>
import Tab from './tab'
export default {
name: 'ProDetailed',
components: {
Tab,
},
data () {
return {
tabNum: 0,
}
},
computed: {},
watch: {},
methods:
{
getTabNum (i) {
console.log(i)
this.tabNum = i
},
},
}
</script>
<style lang='less' scoped>
#query {
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 4px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
font-size: 17px;
letter-spacing: 0.61px;
line-height: 24px;
}
}
.hinput {
position: relative;
z-index: 50;
width: 100%;
height: 50px;
//border-bottom: 1px solid #cccccc70;
display: flex;
justify-content: center;
align-items: center;
background: #fff;
.search-box {
width: 93.6%;
height: 36px;
font-size: 14px;
color: #B4B4B5;
letter-spacing: 0;
font-family: PingFangSC-Regular;
border: 1px solid rgba(56, 63, 69, 0.60);
border-radius: 4px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
input {
width: 90%;
height: 100%;
opacity: 0.4;
border: none;
line-height: 34px;
}
}
}
.box {
position: relative;
width: 100%;
height: 79px;
background: #fff;
border-top: 1px solid #cccccc70;
margin-bottom: 8px;
.first {
height: 20px;
width: 100%;
display: flex;
flex-direction: row;
margin-top: 16px;
img {
width: 16px;
height: 16px;
margin-left: 16px;
}
.product-class {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56,63,69,0.60);
margin-left: 8px;
}
.product {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #383F45;
margin-left: 16px
}
}
.second {
height: 20px;
width: 100%;
display: flex;
flex-direction: row;
margin-top: 7px;
.product-class {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56,63,69,0.60);
margin-left: 54px;
}
.product {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #383F45;
margin-left: 16px
}
img {
width: 16px;
height: 16px;
margin-left: 9px;
}
}
.arrow {
position: absolute;
top: 50%;
margin-top: -8px;
right: 20px;
height: 16px;
width: 16px;
}
}
}
</style>
src/pages/productQuery/query-home.vue
View file @ fe0e16d1
......@@ -2,7 +2,7 @@
* @Descrip: 查询首页
* @Author: your name
* @Date: 2019-10-15 14:30:00
* @LastEditTime: 2019-10-15 15:54:08
* @LastEditTime: 2019-10-16 09:30:10
* @LastEditors: Please set LastEditors
-->
<template>
......@@ -20,7 +20,7 @@
<img src="@/assets/distributorSign/search.png" alt="">
</div>
</div>
<div class="box">
<div class="box" @click="goDetailed">
<div class="first">
<img src="@/assets/productQuery/product-query.png" alt="">
<p class="product-class">产品类别</p>
......@@ -77,7 +77,11 @@ export default {
watch: {},
methods:
{
goDetailed () {
this.$router.push({
name: 'ProDetailed',
})
},
},
}
</script>
......
src/pages/productQuery/tab.vue 0 → 100644
View file @ fe0e16d1
<!--
* @Description: 详情tab
* @Author: your name
* @Date: 2019-09-25 19:47:59
* @LastEditTime: 2019-10-16 09:29:53
* @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>
</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'
export default {
data () {
return {
tabNum: 0,
check1: check1,
check2: check2,
check3: check3,
uncheck1: uncheck1,
uncheck2: uncheck2,
uncheck3: uncheck3,
}
},
methods: {
sendTabNum () {
this.$emit('getTabNum', this.tabNum)
},
},
}
</script>
<style lang="less" scoped>
.tab-style{
position: relative;
z-index: 50;
background-color: #fff;
display:flex;
justify-content: center;
padding-top:12px;
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;
}
img{
width:112px;
height: 32px;
margin-right:5.7px;
}
span:nth-of-type(2){
margin:0 10px;
}
}
</style>
src/router/index.js
View file @ fe0e16d1
......@@ -2,7 +2,7 @@
* @Description: In User Settings Edit
* @Author: your name
* @Date: 2019-09-24 12:34:06
* @LastEditTime: 2019-10-15 14:37:42
* @LastEditTime: 2019-10-16 09:29:11
* @LastEditors: Please set LastEditors
*/
import Vue from 'vue'
......@@ -60,6 +60,7 @@ import MarginFirstPay from '../pages/pay/marginPay/first-pay'
import MarginPayEntry from '../pages/pay/marginPay/pay-entry'
// 产品查询
import QueryHome from '@/pages/productQuery/query-home'
import ProDetailed from '@/pages/productQuery/product-detailed'
Vue.use(Router)
export default new Router({
......@@ -168,6 +169,7 @@ export default new Router({
{path: '/margin-pay-entry', component: MarginPayEntry, name: 'MarginPayEntry', meta: {keepAlive: true}},
// 产品查询
{path: '/query-home', component: QueryHome, name: 'QueryHome', meta: {keepAlive: true}},
{path: '/product-detailed', component: ProDetailed, name: 'ProDetailed', meta: {keepAlive: true}},
],
scrollBehavior (to, from, savedPosition) {
if (to.hash) {
......
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