星油云站

pages/station-info/station-info.vue

@@ -0,0 +1,180 @@
+<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>