星油云站
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

731 lines
20 KiB

<template>
<view class="content my-bg">
<cu-custom class="main-topbar bg-main-oil" @showLists='showLists' :isChange='true' bgColor="bg-main-oil">
<block slot="changeChannel">切换</block>
<block slot="content">{{'星油云站'}}</block>
</cu-custom>
<view class="main-money bg-main-oil">
<view class="padding-left-lg">当前油站为<text>{{accountName}}</text></view>
<view class="padding-xs flex align-center">
<view class="flex-sub text-center padding-top-lg">
<view class="txet-xxs">
<text class="text-white">今日收款</text>
</view>
<!-- <view class="" @tap='changess'>butns</view> -->
<view class=" text-sl padding padding-top-xs"><text class="text-white">{{userAccount.totalMoney|numberFilter}}</text></view>
</view>
</view>
</view>
<view class="bg-main-oil bg-main-color main-money">
</view>
<view class="bg-white radius margin-left margin-right to-top">
<view class=" flex ">
<view class="padding text-center flex-sub"
@tap="routerTo('/packageOrders/pages/orderList/dailyOrder/dailyOrder')">
<text>今日收款笔数</text>
<view class="padding-sm">
<text class="oil-main-color">{{userAccount.totalCount}}</text>
</view>
<!-- <button class="cu-btn bg-main-oil text-white text-sm ">
查看明细
</button> -->
</view>
<view class="padding text-center flex-sub">
<text>账户余额</text>
<view class="padding-sm">
<text class="oil-main-color">{{userAccount.balance|numberFilter}}</text>
</view>
<!-- <button class="cu-btn bg-main-oil text-white text-sm ">
查看明细
</button> -->
</view>
</view>
</view>
<view class="showMainBox cu-list bg-white margin radius " style='z-index: 0;'>
<view class="foldOrExpand" v-if='SiteOliInfo.length>2'>
<view class="fold checkF" v-if='checkForE' @click='showOrNo(false) '>折叠 <image src="../../static/img/zdU.png" mode="" class="showMainBox_item_top_img"></image></view>
<view class="Expand checkF" v-if='!checkForE' @click='showOrNo(true) '>展开 <image src="../../static/img/zdD.png" mode="" class="showMainBox_item_top_img"></image></view>
</view>
<view class="showMainBox_main" :style="{ height: showHeight}" >
<view class="showMainBox_item" v-for='(item,i) in SiteOliInfo' :key='i' v-if='SiteOliInfo.length'>
<view class="showMainBox_item_left">
<view class="showMainBox_item_left_title">{{item.oilProductCode}} 油</view>
<view class="showMainBox_item_left_tag">
<view class="showMainBox_item_left_tag_money">
发改委价: <text class='color-red'>&yen;{{item.marketPrice}} </text>
</view>
<view class="showMainBox_item_left_tag_money">
油站价: <text class='color-red'>&yen;{{item.sitePrice}}</text>
</view>
</view>
</view>
<view class="showMainBox_item_right" v-if="sitInfo.phone" @click="markerPhone">
<image src="../../static/img/kfrx.png" mode="" class="showMainBox_item_right_img"></image>
</view>
</view>
</view>
</view>
<view class="cu-list grid col-3 no-border listBox margin radius " style='z-index: 0;'>
<view class="cu-item" @tap="routerTo('/pages/station-info/station-info')">
<view :class="['cuIcon-' + cuIconList[0].cuIcon, 'text-' + cuIconList[0].color]" class="text-sl">
<view class="cu-tag badge" v-if="cuIconList[0].badge != 0">
<block v-if="cuIconList[0].badge != 1">
{{ cuIconList[0].badge > 99 ? '99+' : cuIconList[0].badge }}</block>
</view>
</view>
<text>{{ cuIconList[0].name }}</text>
</view>
<view class="cu-item" v-for="(item,index) in menusList" :key="index" @tap="routerTo(item.path)" v-if=' item.name != "星油云站超级管理员"' >
<view :class="['cuIcon-' + item.cuIcon, 'text-' + cuIconList[index+1].color]" class="text-sl">
<view class="cu-tag badge" v-if="item.badge != 0">
<block v-if="item.badge != 1">{{ item.badge > 99 ? '99+' : item.badge }}</block>
</view>
</view>
<text>{{ item.name }}</text>
</view>
<view class="cu-item" @tap="routerTo('/pages/station-price/station-price')">
<view :class="['cuIcon-' + cuIconList[1].cuIcon, 'text-' + cuIconList[1].color]" class="text-sl">
<view class="cu-tag badge" v-if="cuIconList[1].badge != 0">
<block v-if="cuIconList[1].badge != 1">
{{ cuIconList[1].badge > 99 ? '99+' : cuIconList[1].badge }}</block>
</view>
</view>
<text>{{ cuIconList[1].name }}</text>
</view>
<view style="height: 180rpx;display: flex;justify-content: flex-end;" class="cu-item" @tap="routerTo('/pages/escalation/escalation')">
<!-- <view :class="['cuIcon-' + cuIconList[2].cuIcon, 'text-' + cuIconList[2].color]" class="text-sl">
<view class="cu-tag badge" v-if="cuIconList[2].badge != 0">
<block v-if="cuIconList[2].badge != 1">
{{ cuIconList[2].badge > 99 ? '99+' : cuIconList[2].badge }}</block>
</view>
</view> -->
<view>
<image style="width: 50rpx;height: 50rpx;" src="/static/img/dzsb.png"></image>
</view>
<text>{{ cuIconList[2].name }}</text>
</view>
<!-- <view class="cu-item" @tap="routerTo('/pages/TransactionStatistics/TransactionStatistics')">
<view :class="['cuIcon-' + 'new', 'text-' + cuIconList[0].color]" class="text-sl">
<view class="cu-tag badge" v-if="cuIconList[0].badge != 0">
<block v-if="cuIconList[0].badge != 1">
{{ cuIconList[0].badge > 99 ? '99+' : cuIconList[0].badge }}</block>
</view>
</view>
<text>交易统计</text>
</view> -->
<!-- <view class="cu-item" @tap="scanQr">
<view class="text-sl cuIcon-scan text-yellow">
</view>
<text>扫星油云</text>
</view> -->
<!-- <view class="cu-item" @tap="showLists">
<view :class="['cuIcon-' + cuIconList[0].cuIcon, 'text-' + cuIconList[0].color]" class="text-sl">
<view class="cu-tag badge" >
</view>
</view>
<text>切换油站</text>
</view> -->
<view class="padding-bottom-xl">
</view>
</view>
<view class="cu-modal" :class="checkList">
<view class="cu-dialog">
<view class="cu-bar bg-red justify-end">
<view class="content ">
{{'选择登录油站'}}
</view>
<view class="action" @tap="hidecheckList">
<text class="cuIcon-close text-white"></text>
</view>
</view>
<view class="text-left padding-xl padding-bottom padding-top bg-white">
<view class="flex align-center justify-between margin-bottom-sm " v-for="(list,i) in oliList" :key='list'>
<view class=""> {{list.otherSiteName}}</view>
<view class="">
<view class=" bg-red cu-btn text-white text-center btn-radius-10 text-sm" @tap="checkLists(list)">
进入
</view>
</view>
</view>
</view>
</view>
</view>
<view class="cu-modal" :class="[checkFirst ? 'show':'']" >
<view class="cu-dialog">
<view class="cu-bar bg-red justify-end">
<view class="content ">
{{'选择登录油站'}}
</view>
<view class="action" @tap="hidecheckList">
<text class="cuIcon-close text-white"></text>
</view>
</view>
<view class="text-left padding-xl padding-bottom padding-top bg-white">
<view class="flex align-center justify-between margin-bottom-sm " v-for="(list,i) in oliList" :key='list'>
<view class=""> {{list.otherSiteName}}</view>
<view class="">
<view class=" bg-red cu-btn text-white text-center btn-radius-10 text-sm" @tap="checkLists(list)">
进入
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import cloudSiteApi from '@/api/cloud-site.js'
import oliUserApi from '@/api/oli-user.js'
import oilIdentityApi from '@/api/oil-identity.js'
import oliSiteApi from '@/api/oli-site.js'
export default {
props: {
site: {
type: Object,
default () {}
},
// menusList:{
// type:Array,
// default(){}
// },
checkUser:{
type:Boolean,
default(){}
}
},
data() {
return {
showHeight:'340rpx',
checkForE:false,
sitInfo:{},
SiteOliInfo:[],
accountName:uni.getStorageSync('siteOli'),
userAccount:uni.getStorageSync('ueserList'),
checkList:'',
scanUrl: '',
menusList:uni.getStorageSync('menusChangeList'),
oliList:uni.getStorageSync('oliList'),
userMenu: uni.getStorageSync('userMenu'),
loginUser: uni.getStorageSync('loginUser'),
checkFirst:uni.getStorageSync('checkFirst'),
title: 'Hello',
changeChannel:{
username:'',
channelId:'',
unionId:''
},
cuIconList: [{
cuIcon: 'location',
path: '/pages/station-info/station-info',
color: 'red',
badge: 0,
name: '油站信息'
},
{
cuIcon: 'moneybag',
path: '/pages/station-info/station-info',
color: 'yellow',
badge: 0,
name: '促销优惠'
},
{
cuIcon: 'new',
path: '/packageChart/operation-analysis/operation-analysis',
color: 'orange',
badge: 0,
name: '对账上报'
},
{
cuIcon: 'new',
path: '/packageChart/operation-analysis/operation-analysis',
color: 'orange',
badge: 0,
name: '经营分析'
}, {
cuIcon: 'form',
color: 'yellow',
path: '/packageOrders/pages/orderList/orderList',
badge: 0,
name: '加油订单'
},
{
cuIcon: 'scan',
path: '/pages/stationDetail/stationDetail',
color: 'olive',
badge: 0,
name: '扫码加油'
},
{
cuIcon: 'qr_code',
color: 'cyan',
badge: 0,
path: '/packageQr/pages/qrsite/QrCode_xy',
name: '油站二维码'
},
{
cuIcon: 'punch',
path: '/packageQr/pages/partnership/partnership',
color: 'blue',
badge: 0,
name: '合作企业'
}, {
cuIcon: 'expressman',
color: 'mauve',
// color: 'pink',
path: '暂无',
badge: 0,
name: '员工管理'
}, {
cuIcon: 'expressman',
color: 'mauve',
// color: 'pink',
path: '暂无',
badge: 0,
name: '交易统计'
},
]
};
},
onLoad() {
//console.log('这里是home')
const Menus = uni.getStorageSync('userMenu')
this.fistCheck()
},
filters: {
numberFilter(value) {
if (value) {
value = value - 1 + 1
return value.toFixed(2)
} else {
return '0.00'
}
}
},
methods: {
showOrNo(type){
this.checkForE = type
},
markerPhone(){
if (this.sitInfo.phone) {
uni.makePhoneCall({
phoneNumber:'4008-56-5355'
})
} else {
uni.showToast({
title: '暂无油站联系方式',
icon: 'none'
});
}
},
changess(){
oliUserApi.initCouldUser().then(res=>{
//console.log(res)
})
},
changeMenuList(data){ //这里是切换处 更新权限menus处
const Menus =data
console.log(data,'1111111111111111111111111111111111111111')
console.log('这里是接收menus处',Menus)
let menusList = []
Menus.forEach((item,index,Menus)=>{
if(item.roleName != 'ROOT' ){
// this.Splicing(item)
menusList.push(this.Splicing(item)) //根据menus做处理
}
})
uni.setStorageSync('menusChangeList',menusList)
this.menusList =uni.getStorageSync('menusChangeList')
// this.$emit('changMenus',menusList)
//console.log('这里是切换处',menusList)
},
Splicing(list){
let obj = {
cuIcon: '',
path: '',
color: '',
badge: 0,
name:''
}
if(list.roleName == '扫码加油'){
obj.cuIcon = 'scan',
obj.path= '/pages/station-info/scan-camera/scan-camera',
obj.color= 'olive',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '经营分析'){
obj.cuIcon = 'new',
obj.path= '',
obj.color= 'orange',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '加油订单'){
obj.cuIcon = 'form',
obj.path= '/packageOrders/pages/orderList/orderList',
obj.color= 'yellow',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '油站二维码'){
obj.cuIcon = 'qr_code',
obj.path= '/packageQr/pages/qrsite/QrCode_xy',
obj.color= 'cyan',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '员工管理'){
obj.cuIcon = 'expressman',
obj.path= '/packageStaff/pages/staff/List/List',
obj.color= 'mauve',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '油站信息'){
obj.cuIcon = 'punch',
obj.path= '/packageQr/pages/partnership/partnership',
obj.color= 'blue',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '交易统计'){
obj.cuIcon = 'punch',
obj.path= '/pages/TransactionStatistics/TransactionStatistics',
obj.color= 'blue',
obj.badge= 0,
obj.name=list.roleName
}else if(list.roleName == '星油云站超级管理员'){
obj.cuIcon = 'punch',
obj.path= ' ',
obj.color= 'blue',
obj.badge= 0,
obj.name=list.roleName
}
return obj
},
checkInfo(){
let id = uni.getStorageSync('channelId')
if(id){
this.getUserInfo(id)
//console.log(this.menusList)
this.getSiteInfo(id)
}
},
// 获取油站信息
getSiteInfo(channelId) {
console.log('获取油站信息')
oliSiteApi.getSiteDetail(channelId).then(res => {
// //console.log(res)
if (res.code === 20000) {
console.log(res.data.oil)
this.sitInfo= res.data.site
this.SiteOliInfo = res.data.oil
if(res.data.oil.length <3){
this.showHeight = ' auto'
}else{
this.showHeight = '340rpx'
}
uni.setStorageSync('oilSitePriceId',res.data.site.id)
}
})
},
hidecheckList(){
//console.log('')
this.checkList = ''
this.checkFirst = false
},
checkLists(items){
// //console.log(items)
let id = items.channelId
this.changeChannel.channelId = items.channelId
this.changeChannel.unionId = uni.getStorageSync('unionId')
this.changeChannel.username = this.loginUser.userPhone
uni.setStorageSync('channelId',items.channelId)
oilIdentityApi.changeChannelLogin(this.changeChannel).then((res)=>{
// //console.log(res)
if(res.code == 20000){
uni.setStorageSync('siteOli',items.otherSiteName)
this.accountName = items.otherSiteName
this.checkList = ''
this.checkFirst = false
uni.setStorageSync('checkFirst',false)
uni.setStorageSync('Authorization',res.data.authTokenDTO.accessToken)
this.checkForE =false
uni.setStorageSync('userMenu', res.data.authTokenDTO.loginUser.roleMenus)
uni.setStorageSync('loginUser', {
id: res.data.authTokenDTO.loginUser.id,
name: res.data.authTokenDTO.loginUser.name,
userPhone: res.data.authTokenDTO.loginUser.userPhone
})
//console.log(res.data.authTokenDTO.loginUser.channelId)
this.getSiteInfo(res.data.authTokenDTO.loginUser.channelId)
this.getUserInfo(id)
this.changeMenuList(res.data.authTokenDTO.loginUser.roleMenus)
}else if(res.code == 40000){
uni.navigateTo({
url:'/pages/login/boforeLogin/boforeLogin'
})
}
})
},
//获取油站基本资料
getUserInfo(id) {
console.log('获取油站基本资料')
// 获取云站当前登录用户的基础资料
oliSiteApi.getSiteBasicData(id).then(res => {
//console.log('用户资料', res)
uni.stopPullDownRefresh();
if (res.code === 20000) {
uni.setStorageSync('ueserList',res.data)
this.userAccount = res.data
}
})
},
showLists(){
let phoneNumber = this.loginUser.userPhone ,
_that =this
oliUserApi.getByPhone(phoneNumber).then((res)=>{
//console.log('调用')
//console.log('这里是切换',res)
if(res.code == 20000){
//console.log(res.data.length)
if(res.data.length < 2){
uni.showToast({
title:'当前只有一个油站不可切换',
icon:'none'
})
return
}
_that.checkList = 'show'
_that.oliList = res.data
_that.changeChannel.username = _that.loginUser.userPhone
_that.changeChannel.unionId = uni.getStorageSync('unionId')
}else{
uni.showToast({
title:'请求失败,请稍后再试',
icon:'none'
})
}
})
//console.log(this.loginUser)
},
scanQr() {
var scanUrl
scanUrl = '/pages/station-info/scan-camera/scan-camera'
uni.navigateTo({
url: scanUrl,
fail: (err) => {
// //console.log(err)
},
success: (res) => {
// //console.log('chengg', res)
},
})
},
// 方便开发
// scanQr() {
// uni.setStorageSync('qrCode', 'XM&1299257961238990848')
// uni.navigateTo({
// url: '/pages/stationDetail/stationDetail',
// fail: (err) => {
// //console.log(err)
// },
// success: (res) => {
// //console.log('chengg', res)
// }
// })
// },
routerTo(url, name) {
//console.log(url,name)
console.log(url)
if(url == ''){
uni.showToast({
title:'暂时无法使用...',
icon:'none'
})
return
}
if (name === '扫码加油') {
this.scanUrl = url
this.scanQr()
} else {
uni.navigateTo({
url: url
})
}
}
}
,onShow() {
//console.log('这里是show')
},
watch:{
checkForE(newValue,oldValue){
console.log(newValue)
console.log(oldValue)
if(newValue && this.SiteOliInfo.length>2){
this.showHeight = ' auto'
}else if(!newValue && this.SiteOliInfo.length>2){
this.showHeight = '340rpx'
}else if (this.SiteOliInfo.length==2 || this.SiteOliInfo.length<2 ){
this.showHeight = ' auto'
}
}
},
created(){
// 此页面onshow无法执行生命周期需要,需要走created
//console.log('这里是created')
//console.log(this.menusList)
this.checkInfo()
}
};
</script>
<style scoped>
.showMainBox_main{
width: 100%;
}
.showMainBox_item_top_img{
width: 40rpx;
height: 40rpx;
margin-left: 2%;
}
.foldOrExpand{
width: 100%;
padding: 2% 3%;
border-bottom: 1px solid #eeee;
}
.foldOrExpand .checkF{
display: flex;
justify-content: flex-end;
align-items: center;
transition: all linear .3s;
}
.color-red{
color: #f70e0e;
font-weight: 700;
font-size: 35rpx;
margin-left: 3%;
}
.showMainBox_item_right_img{
width: 70rpx;
height: 70rpx;
}
.showMainBox_item_left_tag_money{
font-size: 25rpx;
width: 47%;
}
.showMainBox_item{
display: flex;
justify-content: space-between;
align-items: flex-end;
width: 100%;
padding: 5% 6%;
box-sizing: border-box;
border-bottom: 2rpx solid #eee;
}
.showMainBox_item_left_tag{
display: flex;
justify-content: space-between;
align-items: center;
width: 90%;
margin-top:2%;
}
.showMainBox_item_left_title{
color: #333;
font-size:36rpx;
}
.showMainBox_item_left{
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
width: 90%;
flex: 0 0 auto;
}
.showMainBox{
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
}
.content {
height: 100%;
}
.listBox{
display: flex;
justify-content: flex-start;
align-items: center;
}
.bottom-bar {
position: relative;
padding-top: 50px;
margin-bottom: 0;
margin-top: 0;
}
.main-topbar>>>.cu-bar {
height: 380rpx !important;
z-index: 0 !important;
}
.main-topbar>>>.cu-bar .content {
padding-bottom: 300rpx;
}
.bottom-bar-fixed {
position: fixed;
bottom: 0;
padding-top: 70rpx;
width: 100%;
}
.main-money {
position: relative;
z-index: 1;
}
.van-tag {
display: inline-block;
padding: 0.3rem 0.4rem;
position: absolute;
right: 1px;
font-size: 12px;
top: 25%;
background-color: #b9ffca;
border-radius: 10rem 0 0 10rem;
border-color: transparent;
}
.bg-main-color {
min-height: 160rpx;
}
.to-top {
position: relative;
top: -140rpx;
z-index: 1;
}
.cu-list {
position: relative;
top: -140rpx;
z-index: 1;
}
.cu-list.grid>.cu-item [class*=cuIcon] {
font-size: 75rpx;
}
</style>