Files
LSM_OIL_SITE/pages/station-info/station-info.vue
2022-08-08 09:15:09 +08:00

181 lines
3.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="page-content bg-white">
<cu-custom class="bg-main-oil" :isBack="true" bgColor="bg-main-oil">
<block slot="backText">返回</block>
</cu-custom>
<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>
<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.siteName}}
</view>
<view class="color-999">
{{site.address}}
</view>
<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" @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="padding-bottom ">
<OilMenuItem :oilItem="item" v-for="(item,index) in oilList" :key="index" />
</view>
<!-- <view class="margin padding">
<view class="">
<button class="bg-main-oil" @tap="loginOut">
退出登录
</button>
</view>
</view> -->
</view>
</template>
<script>
import cloudSiteApi from '@/api/cloud-site.js'
import OilMenuItem from '@/components/oil-menu-item.vue'
import oliSiteApi from '@/api/oli-site.js'
export default {
components: {
OilMenuItem
},
data() {
return {
mainURL: this.global.mainURL,
title: 'Hello',
site: {},
channelId:uni.getStorageSync('channelId'),
cuIconList: [{
cuIcon: 'location',
color: 'red',
badge: 120,
name: '加油信息'
},
{
cuIcon: 'form',
color: 'orange',
badge: 0,
name: '加油订单'
},
{
cuIcon: 'new',
color: 'yellow',
badge: 0,
name: '经营分析'
},
{
cuIcon: 'scan',
color: 'olive',
badge: 0,
name: '扫码加油'
},
{
cuIcon: 'qr_code',
color: 'cyan',
badge: 0,
name: '油站二维码'
},
{
cuIcon: 'expressman',
color: 'red',
badge: 0,
name: '员工管理'
},
],
oilList: []
}
},
onLoad() {
this.getSiteInfo()
uni.showShareMenu()
},
methods: {
loginOut() {
uni.clearStorage()
uni.reLaunch({
url: '/pages/login/boforeLogin/boforeLogin'
})
},
getSiteInfo() {
oliSiteApi.getSiteDetail(this.channelId).then(res => {
if (res.code === 20000) {
this.site = res.data.site
this.oilList = res.data.oil
console.log(this.oilList,'油站信息列表')
uni.setStorage({
key: 'oilSiteName',
data: res.data.site.oilSiteName
})
}
})
},
makeCall(phone) {
if (phone) {
uni.makePhoneCall({
phoneNumber: phone
})
} else {
uni.showToast({
title: '暂无油站联系方式',
icon: 'none'
});
}
}
}
};
</script>
<style scopeds>
.cu-card.case.no-card .image {
margin: 0;
}
.bg-view {
height: 300rpx;
min-width: 100%;
position: absolute;
}
.position-re {}
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>