Skip to content

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

'主页静态页面'

parent 86410f0d
Show whitespace changes
Inline Side-by-side
Showing with 289 additions and 55 deletions
src/pages/home/home-page.vue
View file @ 0fbcf793
<!--
* @Descrip""/>User Settings Edit
* @Descrip: 主页
* @Author: your name
* @Date: 2019-10-10 14:25:15
* @LastEditTime: 2019-10-10 17:30:37
* @LastEditTime: 2019-10-11 14:45:17
* @LastEditors: Please set LastEditors
-->
<template>
......@@ -10,7 +10,8 @@
<h-header class="bar-custom">
<div slot="left" class="h-header-btn">
<!-- <i class="ion-ios-arrow-back" /> -->
<span>徐州</span>
<img class="locations" src="@/assets/homePage/location.png" alt="">
<span @click="location">徐州</span>
</div>
<div slot="center">徐工租赁</div>
</h-header>
......@@ -48,9 +49,9 @@
</div>
<div slot="content" class="item-content">
<div class="top">***起重机 <span class="hot">热门</span></div>
<div class="center">经销商 <span class="seconds">xxx代理商</span></div>
<div class="center">参数项 <span class="seconds">GTZ226</span></div>
<div class="center">地址 <span class="seconds">江苏省徐州市云龙区</span></div>
<div class="center"> <span class="firsts">经销商</span> <span class="seconds">xxx代理商</span></div>
<div class="center"> <span class="firsts">参数项</span> <span class="seconds">GTZ226</span></div>
<div class="center"> <span class="firsts">地址</span> <span class="seconds">江苏省徐州市云龙区</span></div>
</div>
</item>
<item>
......@@ -59,12 +60,13 @@
</div>
<div slot="content" class="item-content">
<div class="top">***起重机 <span class="hot">热门</span></div>
<div class="center">经销商 <span class="seconds">xxx代理商</span></div>
<div class="center">参数项 <span class="seconds">GTZ226</span></div>
<div class="center">地址 <span class="seconds">江苏省徐州市云龙区</span></div>
<div class="center"> <span class="firsts">经销商</span> <span class="seconds">xxx代理商</span></div>
<div class="center"> <span class="firsts">参数项</span> <span class="seconds">GTZ226</span></div>
<div class="center"> <span class="firsts">地址</span> <span class="seconds">江苏省徐州市云龙区</span></div>
</div>
</item>
</list-item>
<div class="bank" style="height: 60px;width: 100%"/>
</h-content>
</h-view>
</template>
......@@ -75,30 +77,25 @@ export default {
return {
functionList: [
{
functionIcon: require('@/assets/userBind/np.png'),
functionName: '用户绑定',
functionIcon: require('@/assets/homePage/product-select.png'),
functionName: '产品查询',
functionState: 'UserBind',
},
{
functionIcon: require('@/assets/intoApproval/introduce.png'),
functionName: '绑定查询',
functionIcon: require('@/assets/homePage/product-trial.png'),
functionName: '产品试算',
functionState: 'NaturePersonReadOnly',
},
{
functionIcon: require('@/assets/intoApproval/introduce.png'),
functionName: '进件审批',
functionIcon: require('@/assets/homePage/contract-query.png'),
functionName: '合同查询',
functionState: 'IntoList',
},
{
functionIcon: require('@/assets/intoApproval/introduce.png'),
functionName: '经销商签约',
functionIcon: require('@/assets/homePage/replay.png'),
functionName: '还款计划',
functionState: 'ContractList',
},
{
functionIcon: require('@/assets/intoApproval/introduce.png'),
functionName: '合同签约',
functionState: 'ContractSigning',
},
],
}
},
......@@ -106,43 +103,55 @@ export default {
watch: {},
methods:
{
goFunctionHome (data) {
if (data.functionState === 'NaturePersonReadOnly') {
if (this.user_bp_status === 'APPROVED' && this.user_bp_class === 'NP') {
this.$router.push({
name: 'NaturePersonReadOnly',
params: {
'bp_id': this.bp_id,
},
})
} else if (this.user_bp_status === 'APPROVED' && this.user_bp_class === 'ORG') {
this.$router.push({
name: 'EnterpriseReadOnly',
params: {
'bp_id': this.bp_id,
},
})
} else {
this.hlsPopup.showLongCenter('您的绑定申请还在流程中')
}
} else {
// goFunctionHome (data) {
// if (data.functionState === 'NaturePersonReadOnly') {
// if (this.user_bp_status === 'APPROVED' && this.user_bp_class === 'NP') {
// this.$router.push({
// name: 'NaturePersonReadOnly',
// params: {
// 'bp_id': this.bp_id,
// },
// })
// } else if (this.user_bp_status === 'APPROVED' && this.user_bp_class === 'ORG') {
// this.$router.push({
// name: 'EnterpriseReadOnly',
// params: {
// 'bp_id': this.bp_id,
// },
// })
// } else {
// this.hlsPopup.showLongCenter('您的绑定申请还在流程中')
// }
// } else {
// this.$router.push({
// name: data.functionState,
// })
// }
// },
location () {
this.$router.push({
name: data.functionState,
name: 'location',
})
}
},
},
}
</script>
<style lang='less' scoped>
#homePage {
.h-header .h-header-left .h-header-btn:first-of-type {
padding-left: 0.2rem;
}
.locations {
height: 24px;
width: 24px;
}
.hls-swipe {
height: 208px;
// height: 208px;
width: 100vw;
// overflow: hidden;
img {
width: 100vw;
height: 100%;
// height: 100%;
}
}
.function{
......@@ -170,15 +179,18 @@ export default {
}
}
.center-pic {
// position: relative;
width: 100%;
height: 228px;
// height: 228px;
// overflow: hidden;
display: flex;
flex-direction: row;
.left-pic {
width: 41.6%;
margin-left: 4px;
img {
width: 100%;
max-width: 100%;
height: auto;
}
}
.right-pic {
......@@ -187,7 +199,8 @@ export default {
flex-direction: column;
margin-left: 4px;
img {
width: 100%;
max-width: 100%;
height: auto;
}
img:nth-of-type(2) {
margin-top: 4px;
......@@ -226,12 +239,17 @@ export default {
font-weight: 600;
margin-top: 10px;
.hot {
display: inline-block;
height: 14px;
line-height: 14px;
// width: 32px;
border: 1px solid #FF8214;
border-radius: 2px;
font-family: PingFangSC-Semibold;
font-size: 11px;
color: #FF8214;
letter-spacing: 0.46px;
margin-left: 6px;
}
}
.center {
......@@ -240,6 +258,10 @@ export default {
font-size: 13px;
color: rgba(56,63,69,0.60);
letter-spacing: 0.5px;
.firsts {
display: inline-block;
width: 44px;
}
.seconds {
margin-left: 16px;
font-weight: 600;
......@@ -248,9 +270,6 @@ export default {
color: #383F45;
letter-spacing: 0.5px;
}
// .seconds:nth-of-type(3) {
// margin-left: 24px;
// }
}
}
}
......
src/pages/home/location.vue 0 → 100644
View file @ 0fbcf793
<!--
* @Descrip""/>User Settings Edit
* @Author: your name
* @Date: 2019-10-11 09:39:51
* @LastEditTime: 2019-10-11 14:02:18
* @LastEditors: Please set LastEditors
-->
<template>
<h-view id="location" 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>
<h-content>
<div class="current-location">
<div class="img-box">
<img src="@/assets/homePage/location.png" alt="">
</div>
<p>当前位置</p>
</div>
<list-item>
<item>
<section slot="name" class="place">{{ places }}</section>
<section slot="content" class="relocation">
<div>
<img src="@/assets/homePage/relocation.png" alt="">
<p>重新定位</p>
</div>
</section>
</item>
</list-item>
<div class="current-location">
<p class="select-location" @click="switchCity">选择位置</p>
</div>
<div class="provinces">
<p :class="{styles:!flag}" @click="changeStyle(1)">{{ province }}</p>
<p :class="{styles:flag}" @click="changeStyle(2)">请选择市</p>
</div>
<list-item v-if="province_flag" :item-height="40">
<item v-for="(item,index) in lists" :key="index">
<section slot="name" @click="selectProvince(item)">{{ item }}</section>
</item>
</list-item>
<list-item v-if="!province_flag" :item-height="40">
<item v-for="(item,index) in cityList" :key="index">
<section slot="name" @click="selectCity(item)">{{ item }}</section>
</item>
</list-item>
</h-content>
</h-view>
</template>
<script>
export default {
name: 'Location',
data () {
return {
flag: false,
province_flag: true,
province: '请选择省',
places: '江苏省-徐州市',
lists: ['北京省', '浙江省', '四川省'],
cityList: ['北京', '成都', '上海', '广州'],
}
},
computed: {},
watch: {},
methods:
{
switchCity () {
},
changeStyle (val) {
console.log(val)
if (val === 1) {
this.flag = false
} else {
this.flag = true
}
},
selectProvince (val) {
this.province = val
this.flag = !this.flag
this.province_flag = false
},
selectCity (val) {
this.hlsPopup.showConfirm({
title: '提示',
content: `是否切换到${val}城市？`,
onConfirm: (data) => {
console.log(data)
if (data) {
this.places = this.province + '-' + val
}
},
})
},
},
}
</script>
<style lang='less' scoped>
#location {
.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;
}
}
.current-location {
height: 34px;
width: 100%;
display: flex;
flex-direction: rwo;
align-items: center;
background: rgba(0, 70, 156, 0.1);
.img-box {
width: 16px;
height: 16px;
margin-left: 17px;
background: rgba(0, 70, 156, 0.1);
img {
width: 100%;
height: 100%;
}
}
.select-location {
margin-left: 17px
}
p {
// width: 56px;
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #00469C;
letter-spacing: 0;
margin-left: 6px;
font-weight: 700
}
}
.place {
font-family: PingFangSC-Semibold;
font-weight: 600;
font-size: 14px;
color: #383F45;
letter-spacing: 0;
}
.relocation {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #00469C;
letter-spacing: 0;
div {
display: flex;
flex-direction: row;
align-items: center;
img {
width: 16px;
height: 16px;
margin-right: 6px
}
}
}
.hls-list-item {
margin-bottom: 0
}
.provinces {
background: #fff;
width: 100%;
height: 40px;
display: flex;
flex-direction: row;
border-bottom: 1px solid #fafafa;
p {
height: 40px;
line-height: 40px;
margin-left: 15px;
font-family: PingFangSC-Semibold;
font-size: 14px;
color: rgba(56,63,69,0.60);
letter-spacing: 0.5px;
}
.styles {
font-family: PingFangSC-Semibold;
border-bottom: 2px solid blue;
color: #383F45;
font-weight: 600;
}
}
}
</style>
src/router/index.js
View file @ 0fbcf793
......@@ -2,7 +2,7 @@
* @Description: In User Settings Edit
* @Author: your name
* @Date: 2019-09-24 12:34:06
* @LastEditTime: 2019-10-10 14:35:58
* @LastEditTime: 2019-10-11 09:47:23
* @LastEditors: Please set LastEditors
*/
import Vue from 'vue'
......@@ -16,6 +16,8 @@ import FingerLogin from '@/pages/finger-login'
import Home from '@/pages/home'
import Tab from '@/pages/tab'
import HomePage from '@/pages/home/home-page'
// 定位
import Location from '@/pages/home/location'
// 我的
import MyInfo from '@/pages/myInfo/my-info'
......@@ -86,6 +88,12 @@ export default new Router({
name: 'HomePage',
meta: {keepAlive: true},
},
{
path: '/location',
component: Location,
name: 'Location',
meta: {keepAlive: false},
},
{
path: '/guide',
......
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