caoliancun/LSM_OIL_SITE
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

改版油站信息与设计图一致

Browse Source
This commit is contained in:
xk_guohonglei
2020-09-10 11:59:40 +08:00
parent f87b163385
commit b2c52517ce
3 changed files with 65 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
components/PriceList/PriceList.vue
View File

@@ -1,58 +1,22 @@
<template>
<view class="flex price-list">
<view class="basis-xs">
</view>
<view class="solid-right basis-xs" v-for="(item,index) in price" :key="index">
<view class="text-center">
<view class="flex price-list padding-top-sm ">
<view class="flex-sub" v-for="(item,index) in price" :key="index" :class="index<price.length-1?'solid-right':''">
<view class="text-left" :class="item.name==='市场价'?'text-right':''">
<view class="text-center padding-sm">
<view class="strong text-lg" :class="'text-'+item.color">
￥{{item.price|numberFliter}}
</view>
<view class="strong font-16 oil-main-color">
￥{{item.price|numberFliter}}
</view>
<view class="radius text-center oil-card-price main-color-border">
<text class="oil-free">
省
</text>
<text class="free-money">
{{item.free|numberFliter}}
</text>
</view>
<view class="">
星油油价
<view class="text-sm padding-sm">
{{item.name}}
</view>
</view>
</view>
</view>
<!-- <view class="flex-treble text-center solid-right">
<view class="strong font-16 color-wjy">
￥5.81
</view>
<view class="radius text-center oil-card-price main-color-border border-wjy">
<text class="oil-free bg-wjy">
省
</text>
<text class="free-money color-wjy">
￥5.81
</text>
</view>
<view class="">
万金油价
</view>
<view class="flex-sub">
</view>
<view class="flex-treble text-center " :class="isLast?'':'solid-right'">
<view class="strong font-16 color-lv ">
￥5.81
</view>
<view class="radius oil-card-price border-lv">
<text class="oil-free bg-lv">
省
</text>
<text class="free-money color-lv">
七毛
</text>
</view>
<view class="">
老吕油价
</view>
</view> -->
</view>
</template>

18
components/oil-menu-item.vue
View File

@@ -1,7 +1,7 @@
<template>
<view class="radius padding-xs padding-bottom padding-top margin-top bg-white shadow solid-bottom">
<view class="radius padding-xs padding-top solid-top solid-bottom" >
<view class="item-title ">
<text class="margin color-000 text-bold">{{oilItem.oilName}}</text>
<text class="margin color-000 text-xl text-bold">{{oilItem.oilName}}</text>
<text class="fr padding-right text-sm text-grey">市场价：￥{{ oilItem.standardPrice|numberFliter}}</text>
<PriceList :price="price" />
</view>
@@ -44,11 +44,10 @@
if (this.oilItem.xkPrice) {
this.price.push({
price: this.oilItem.xkPrice,
color: '#ff0000',
color: 'red',
name: '星油油价',
className1: 'red',
className2: 'btn-red',
free: this.oilItem.standardPrice - this.oilItem.xkPrice
})
}
if (this.oilItem.wjyPrice) {
@@ -58,7 +57,6 @@
name: '万金油价',
className1: 'yellow',
className2: 'btn-yellow',
free: this.oilItem.standardPrice - this.oilItem.wjyPrice
})
}
if (this.oilItem.lvPrice) {
@@ -68,7 +66,15 @@
name: '老吕油价',
className1: 'laolv',
className2: 'btn-laolv',
free: this.oilItem.standardPrice - this.oilItem.lvPrice
})
}
if (this.oilItem.standardPrice) {
this.price.push({
price: this.oilItem.standardPrice,
color: 'black',
name: '市场价',
className1: 'laolv',
className2: 'btn-laolv',
})
}
}

50
pages/station-info/station-info.vue
View File

@@ -1,21 +1,17 @@
<template>
<view class="content my-bg">
<view class="page-content bg-white">
<cu-custom class="main-topbar bg-main-oil" isBack bgColor="bg-main-oil">
<block slot="content" class="padding-top">油站信息</block>
<block slot="backText">返回</block>
</cu-custom>
<view class="bg-main-oil bg-view">
</view>
<view class="main-money bg-white margin radius">
<view class="main-money bg-white margin margin-bottom-0 radius">
<view class="cu-card case no-card ">
<view class="cu-item bg-white shadow">
<view class="image">
<image :src="mainURL+'default-station-bg.png'" mode="widthFix"></image>
<!-- <view class="cu-tag bg-blue">史诗</view> -->
<!-- <view class="cu-bar bg-shadeBottom"> <text class="text-cut">我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。我已天理为凭，踏入这片荒芜，不再受凡人的枷锁遏制。</text></view> -->
</view>
<view class="cu-list bg-white position-re">
<view class="cu-list bg-white position-re move-top">
<view class="cu-item bg-white padding-sm ">
<view class="text-bold color-333 text-xl">
{{site.oilSiteName}}
@@ -23,19 +19,23 @@
<view class="color-999">
{{site.address}}
</view>
<view class="color-333 padding-top-xs">
<view class="color-333 padding-top-sm padding-bottom-sm text-sm ">
联系方式：<text v-if="site.linkMan">{{site.linkMan}}</text>
<text v-else>暂无</text>
<text v-if="site.phone">（{{site.phone}}）</text>
<text v-if="site.phone" @tap="makeCall(site.phone)">（{{site.phone}}）</text>
<text v-else>（暂无）</text>
</view>
<view class=" position-call text-xxl" @tap="makeCall(site.phone)">
<text class="cuIcon-phone text-red"></text>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="margin margin-bottom-0 padding-bottom my-bg">
<view class="padding-bottom ">
<OilMenuItem :oilItem="item" v-for="(item,index) in oilList" :key="index" />
</view>
</view>
@@ -110,6 +110,19 @@
})
}
})
},
makeCall(phone) {
if (phone) {
uni.makePhoneCall({
phoneNumber: phone
})
} else {
uni.showToast({
title: '暂无油站联系方式',
icon:'none'
});
}
}
}
};
@@ -134,5 +147,22 @@
image {
vertical-align: bottom;
background-color: rgba(113, 11, 233, 0.5)
}
.image {
border-radius: initial;
vertical-align: bottom;
background-color: rgba(11, 11, 251, 0.7)
}
.move-top {
margin-top: -2px;
}
.position-call {
position: absolute;
right: 30upx;
bottom: 30upx;
}
</style>