parent
c55eb888ee
commit
c588892b12
16 changed files with 1116 additions and 405 deletions
@ -0,0 +1,91 @@ |
||||
<template> |
||||
<!-- <u-action-sheet :actions="sheetActions" cancelText="取消" round="8" :show="show" @select="handleSelect" |
||||
@close="handleClose"></u-action-sheet> --> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'map-navigation', |
||||
data() { |
||||
return { |
||||
show: false, |
||||
actions: [{ |
||||
name: '高德地图', |
||||
packageName: 'com.autonavi.minimap', |
||||
isTrue: false, |
||||
getAppUrl: (name, latitude, longitude) => { |
||||
return `androidamap://viewMap?sourceApplication=隐患排查&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0` |
||||
} |
||||
}, { |
||||
name: '百度地图', |
||||
packageName: 'com.baidu.BaiduMap', |
||||
isTrue: false, |
||||
getAppUrl: (name, latitude, longitude) => { |
||||
return `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=andr.baidu.openAPIdemo&coord_type=gcj02` |
||||
} |
||||
}, { |
||||
name: '腾讯地图', |
||||
packageName: 'com.tencent.map', |
||||
isTrue: false, |
||||
getAppUrl: (name, latitude, longitude, referer) => { |
||||
return `qqmap://map/geocoder?coord=${latitude},${longitude}&title${name}&addr=${name}=&referer=${referer}` |
||||
} |
||||
}], |
||||
} |
||||
}, |
||||
computed: { |
||||
sheetActions() { |
||||
return this.actions.filter(item => item.isTrue).map(item => item.name) |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getAppList() |
||||
}, |
||||
methods: { |
||||
open({ |
||||
name, |
||||
latitude, |
||||
longitude |
||||
}) { |
||||
if (!this.sheetActions.length) { |
||||
this.$.toast('您当前未安装地图APP') |
||||
} else { |
||||
uni.showActionSheet({ |
||||
itemList: this.sheetActions, |
||||
success: ({ |
||||
tapIndex |
||||
}) => { |
||||
const appList = this.actions.filter(item => item.isTrue) |
||||
const url = encodeURI(appList[tapIndex].getAppUrl(name, latitude, |
||||
longitude)) |
||||
plus.runtime.openURL(url, (err) => { |
||||
console.log(err) |
||||
}) |
||||
} |
||||
}) |
||||
} |
||||
|
||||
}, |
||||
handleSelect(index) { |
||||
console.log(index) |
||||
}, |
||||
handleClose() { |
||||
this.show = false |
||||
}, |
||||
getAppList() { |
||||
this.actions = this.actions.map(item => ({ |
||||
...item, |
||||
isTrue: plus.runtime.isApplicationExist({ |
||||
pname: item.packageName |
||||
}) |
||||
})) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.u-popup { |
||||
flex: 0 !important; |
||||
} |
||||
</style> |
@ -0,0 +1,650 @@ |
||||
<template> |
||||
<view class="index-pers"> |
||||
<view class="index-pers-content"> |
||||
<view class="index-pers-title font-family-TMB"> |
||||
洞察隐患 智能守护 |
||||
</view> |
||||
<view class="index-pers-desc font-family-SR"> |
||||
科技之眼照亮安全之路 |
||||
</view> |
||||
<view class="index-pers-pc index-pers-content" v-if="curLogin === 1"> |
||||
<view class="left-content" @click="handleToTab('Investigated')"> |
||||
<view class="left-content-label font-family-SM"> |
||||
待排查 |
||||
</view> |
||||
<view class="left-content-value font-family-ASB"> |
||||
{{pageData.Investigated || 0}} |
||||
</view> |
||||
<view class="left-content-bg"> |
||||
|
||||
</view> |
||||
</view> |
||||
<view class="right-content"> |
||||
<view class="right-content-item"> |
||||
<view class="right-content-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="right-content-item-value cq-color font-family-ASB"> |
||||
{{pageData.PcDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item"> |
||||
<view class="right-content-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="right-content-item-value lq-color font-family-ASB"> |
||||
{{pageData.PcDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="index-pers-zl index-pers-content" v-if="curLogin === 2"> |
||||
<view class="left-content" @click="handleToTab('Government')"> |
||||
<view class="left-content-label font-family-SM"> |
||||
待治理 |
||||
</view> |
||||
<view class="left-content-value font-family-ASB"> |
||||
{{pageData.Government || 0}} |
||||
</view> |
||||
<view class="left-content-bg"> |
||||
|
||||
</view> |
||||
</view> |
||||
<view class="right-content"> |
||||
<view class="right-content-item"> |
||||
<view class="right-content-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="right-content-item-value cq-color font-family-ASB"> |
||||
{{pageData.ZlDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item"> |
||||
<view class="right-content-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="right-content-item-value lq-color font-family-ASB"> |
||||
{{pageData.ZlDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="index-pers-pczl index-pers-content" v-if="curLogin === 3"> |
||||
<view class="left-content basic-content" @click="handleToTab('Investigated')"> |
||||
<view class="left-content-bg basic-content-bg"> |
||||
|
||||
</view> |
||||
<view class="basic-content-top"> |
||||
<view class="basic-content-top-label font-family-SM"> |
||||
待排查 |
||||
</view> |
||||
<view class="basic-content-top-value font-family-ASB"> |
||||
{{pageData.Investigated || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="basic-content-bottom"> |
||||
<view class="basic-content-bottom-item"> |
||||
<view class="basic-content-bottom-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="basic-content-bottom-item-value cq-color font-family-ASB"> |
||||
{{pageData.PcDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="basic-content-bottom-item"> |
||||
<view class="basic-content-bottom-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="basic-content-bottom-item-value lq-color font-family-ASB"> |
||||
{{pageData.PcDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="right-content basic-content" @click="handleToTab('Government')"> |
||||
<view class="right-content-bg basic-content-bg"> |
||||
|
||||
</view> |
||||
<view class="basic-content-top"> |
||||
<view class="basic-content-top-label font-family-SM"> |
||||
待治理 |
||||
</view> |
||||
<view class="basic-content-top-value font-family-ASB"> |
||||
{{pageData.Government || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="basic-content-bottom"> |
||||
<view class="basic-content-bottom-item"> |
||||
<view class="basic-content-bottom-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="basic-content-bottom-item-value cq-color font-family-ASB"> |
||||
{{pageData.ZlDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="basic-content-bottom-item"> |
||||
<view class="basic-content-bottom-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="basic-content-bottom-item-value lq-color font-family-ASB"> |
||||
{{pageData.ZlDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="index-pers-sp index-pers-content" v-if="curLogin === 4"> |
||||
<view class="left-content" @click="handleToTab('Approve')"> |
||||
<view class="left-content-bg"> |
||||
|
||||
</view> |
||||
<view class="left-content-label font-family-SM"> |
||||
待审批 |
||||
</view> |
||||
<view class="left-content-value font-family-ASB"> |
||||
{{pageData.Approve || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content"> |
||||
<view class="right-content-item" @click="handleToTab('Investigated')"> |
||||
<view class="right-content-item-top"> |
||||
<view class="right-content-item-top-label font-family-SM"> |
||||
待排查 |
||||
</view> |
||||
<view class="right-content-item-top-value font-family-ASB"> |
||||
{{pageData.Investigated || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item-bottom"> |
||||
<view class="right-content-item-bottom-item"> |
||||
<view class="right-content-item-bottom-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="right-content-item-bottom-item-value cq-color font-family-ASB"> |
||||
{{pageData.PcDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item-bottom-item"> |
||||
<view class="right-content-item-bottom-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="right-content-item-bottom-item-value lq-color font-family-ASB"> |
||||
{{pageData.PcDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item" @click="handleToTab('Government')"> |
||||
<view class="right-content-item-top"> |
||||
<view class="right-content-item-top-label font-family-SM"> |
||||
待治理 |
||||
</view> |
||||
<view class="right-content-item-top-value font-family-ASB"> |
||||
{{pageData.Government || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item-bottom"> |
||||
<view class="right-content-item-bottom-item"> |
||||
<view class="right-content-item-bottom-item-label font-family-SM"> |
||||
超期 |
||||
</view> |
||||
<view class="right-content-item-bottom-item-value cq-color font-family-ASB"> |
||||
{{pageData.ZlDelay || 0}} |
||||
</view> |
||||
</view> |
||||
<view class="right-content-item-bottom-item"> |
||||
<view class="right-content-item-bottom-item-label font-family-SM"> |
||||
临期 |
||||
</view> |
||||
<view class="right-content-item-bottom-item-value lq-color font-family-ASB"> |
||||
{{pageData.ZlDying || 0}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
|
||||
|
||||
<view class="con" @click="konw"> |
||||
<image class="bg" src="/static/know.png" /> |
||||
<view class="con-box"> |
||||
<text class="font-family-SM" style="color: #363F4D;font-weight: 500;">交通隐患排查知识库</text> |
||||
<view class="icon"> |
||||
<uni-icons type="right" size="18" color="#fff" /> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'index-pers', |
||||
props: { |
||||
|
||||
}, |
||||
data() { |
||||
return { |
||||
pageData: [] |
||||
} |
||||
}, |
||||
computed: { |
||||
curLogin() { |
||||
const myRoles = this.$.getData('userInfo').role || [] |
||||
if (myRoles.includes('领导')) { |
||||
return 4 |
||||
} |
||||
if (myRoles.includes('排查人员') && myRoles.includes('治理人员')) { |
||||
return 3 |
||||
} |
||||
if (myRoles.includes('治理人员')) { |
||||
return 2 |
||||
} |
||||
if (myRoles.includes('排查人员')) { |
||||
return 1 |
||||
} |
||||
return 0 |
||||
} |
||||
}, |
||||
created() { |
||||
const data = this.$.getData('token') |
||||
this.$request.globalRequest('/hiddenDanger/highDanger/getHighDangerStatusNum', { |
||||
nuserid: data |
||||
}, 'GET').then(res => { |
||||
if (res.code === 200) { |
||||
this.pageData = res.result.reduce((obj, item) => { |
||||
const { |
||||
status, |
||||
count = 0 |
||||
} = item |
||||
obj[status] = count |
||||
return obj |
||||
}, {}) |
||||
} else { |
||||
this.$.toast(res.message) |
||||
} |
||||
}) |
||||
}, |
||||
methods: { |
||||
konw() { |
||||
this.$.open('/pages/knowledge/index') |
||||
}, |
||||
handleToTab(routeKey) { |
||||
console.log(routeKey) |
||||
if (routeKey === 'Investigated') { |
||||
uni.setStorageSync('MyPCtabIndex', 1) |
||||
this.$.openTab('/pages/investigation/index') |
||||
} |
||||
if (routeKey === 'Government') { |
||||
uni.setStorageSync('MyZLtabIndex', 1) |
||||
this.$.openTab('/pages/governance/index') |
||||
} |
||||
if (routeKey === 'Approve') { |
||||
uni.setStorageSync('MySPtabIndex', 1) |
||||
this.$.openTab('/pages/approve/index') |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.index-pers { |
||||
position: relative; |
||||
color: #fff; |
||||
padding: calc(var(--status-bar-height) + 40rpx) 20rpx 0rpx; |
||||
|
||||
.cq-color { |
||||
color: rgba(204, 41, 54, 1); |
||||
} |
||||
|
||||
.lq-color { |
||||
color: rgba(230, 138, 11, 1) |
||||
} |
||||
|
||||
&::after { |
||||
content: ''; |
||||
position: absolute; |
||||
height: 100%; |
||||
width: 100%; |
||||
left: 0; |
||||
top: 0; |
||||
z-index: 1; |
||||
background: url("../../static/home_bg.png") no-repeat; |
||||
background-size: 100% 100%; |
||||
} |
||||
|
||||
&-content { |
||||
position: relative; |
||||
z-index: 2; |
||||
} |
||||
|
||||
&-title { |
||||
// font-weight: bold; |
||||
font-size: 24px; |
||||
line-height: 28px; |
||||
letter-spacing: 2px; |
||||
text-shadow: 0px 4px 0px rgba(255, 255, 255, 0.16); |
||||
text-align: left; |
||||
font-style: normal; |
||||
text-transform: none; |
||||
color: #fff; |
||||
} |
||||
|
||||
&-desc { |
||||
margin-top: 20rpx; |
||||
letter-spacing: 11rpx; |
||||
color: #fff; |
||||
} |
||||
|
||||
&-content { |
||||
margin-top: 20px; |
||||
font-weight: 500; |
||||
color: rgba(54, 63, 77, 1); |
||||
} |
||||
|
||||
&-pc, |
||||
&-zl { |
||||
display: flex; |
||||
align-items: center; |
||||
height: 190rpx; |
||||
|
||||
.left-content { |
||||
position: relative; |
||||
height: 100%; |
||||
width: 53%; |
||||
background: linear-gradient(180deg, #80CBFF 0%, #F0F5FA 100%); |
||||
border-radius: 9px 9px 9px 9px; |
||||
|
||||
&-bg { |
||||
height: 160rpx; |
||||
width: 160rpx; |
||||
background: url("/static/index/pc.png") no-repeat; |
||||
background-size: 100% 100%; |
||||
position: absolute; |
||||
right: 15rpx; |
||||
top: 15rpx; |
||||
} |
||||
|
||||
&-label { |
||||
font-size: 18px; |
||||
padding: 18px 0 0 15px; |
||||
} |
||||
|
||||
&-value { |
||||
font-size: 26px; |
||||
padding: 3px 0 0 15px; |
||||
} |
||||
} |
||||
|
||||
.right-content { |
||||
flex: 1; |
||||
margin-left: 12px; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
|
||||
|
||||
&-item { |
||||
height: 46%; |
||||
width: calc(100% - 40px); |
||||
padding: 0 20px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
background: rgba(255, 255, 255, .3); |
||||
border-radius: 9px 9px 9px 9px; |
||||
backdrop-filter: blur(4px); |
||||
|
||||
&-value { |
||||
font-size: 20px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
&-zl { |
||||
.left-content { |
||||
background: linear-gradient(180deg, #F0D9B4 0%, #F6F6F6 100%); |
||||
|
||||
&-bg { |
||||
background: url("/static/index/zl.png") no-repeat; |
||||
background-size: 100% 100%; |
||||
width: 90px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
&-pczl { |
||||
display: flex; |
||||
align-items: center; |
||||
height: 280rpx; |
||||
|
||||
.basic-content { |
||||
flex: 1; |
||||
position: relative; |
||||
height: 100%; |
||||
color: rgba(54, 63, 77, 1); |
||||
|
||||
&-bg { |
||||
position: absolute; |
||||
top: 16rpx; |
||||
right: 0rpx; |
||||
width: 90px; |
||||
height: 90px; |
||||
z-index: 1; |
||||
} |
||||
|
||||
&-top { |
||||
height: 54px; |
||||
padding: 18px 15px; |
||||
|
||||
&-label { |
||||
font-size: 18px; |
||||
} |
||||
|
||||
&-value { |
||||
font-size: 26px; |
||||
color: rgba(54, 63, 77, 1); |
||||
} |
||||
} |
||||
|
||||
&-bottom { |
||||
height: 50px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 0 15px; |
||||
background: rgba(255, 255, 255, 0.1); |
||||
border-radius: 9px 9px 9px 9px; |
||||
position: relative; |
||||
z-index: 2; |
||||
backdrop-filter: blur(4px); |
||||
|
||||
&-item { |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
&-label { |
||||
margin-right: 5px; |
||||
} |
||||
|
||||
&-value { |
||||
font-size: 18px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.left-content { |
||||
background: linear-gradient(180deg, #80CBFF 0%, #EBF1F7 100%); |
||||
border-radius: 9px 9px 9px 9px; |
||||
margin-right: 12px; |
||||
|
||||
&-bg { |
||||
background: url("/static/index/pc.png") no-repeat; |
||||
background-size: 100% 100%; |
||||
} |
||||
} |
||||
|
||||
.right-content { |
||||
background: linear-gradient(180deg, #F0D9B4 0%, #F6F6F6 100%); |
||||
border-radius: 9px 9px 9px 9px; |
||||
|
||||
&-bg { |
||||
background: url("/static/index/zl.png") no-repeat; |
||||
background-size: 100% 100%; |
||||
width: 100px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
&-sp { |
||||
color: rgba(54, 63, 77, 1); |
||||
height: 370rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
.left-content { |
||||
position: relative; |
||||
height: 100%; |
||||
width: 42%; |
||||
background: linear-gradient(180deg, #F0D9B4 0%, #FFFEFC 100%); |
||||
border-radius: 9px 9px 9px 9px; |
||||
|
||||
&-label { |
||||
padding: 18px 0 0 15px; |
||||
} |
||||
|
||||
&-value { |
||||
padding: 0 0 0 15px; |
||||
font-size: 30px; |
||||
} |
||||
|
||||
&-bg { |
||||
width: 160px; |
||||
height: 95px; |
||||
position: absolute; |
||||
right: 0; |
||||
bottom: 0; |
||||
background: url('/static/index/sp.png') no-repeat; |
||||
background-size: 100% 100%; |
||||
} |
||||
} |
||||
|
||||
.right-content { |
||||
margin-left: 12px; |
||||
flex: 1; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
|
||||
&-item { |
||||
height: 47%; |
||||
width: 100%; |
||||
background: rgba(255, 255, 255, .4); |
||||
border-radius: 9px 9px 9px 9px; |
||||
backdrop-filter: blur(4px); |
||||
display: flex; |
||||
flex-direction: column; |
||||
|
||||
&-top { |
||||
height: 45px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 0 15px; |
||||
width: calc(100% - 30px); |
||||
|
||||
&-value { |
||||
font-size: 20px; |
||||
} |
||||
} |
||||
|
||||
&-bottom { |
||||
flex: 1; |
||||
height: 35px; |
||||
background-color: rgba(255, 255, 255, 0.2); |
||||
backdrop-filter: blur(4px); |
||||
border-radius: 0px 0px 9px 9px; |
||||
padding: 0 15px; |
||||
width: calc(100% - 30px); |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
|
||||
&-item { |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
&-label { |
||||
margin-right: 14rpx; |
||||
} |
||||
|
||||
&-value { |
||||
font-size: 18px; |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
.con { |
||||
width: 100%; |
||||
height: 240rpx; |
||||
padding: 16rpx 0; |
||||
box-sizing: border-box; |
||||
position: relative; |
||||
z-index: 999; |
||||
background-size: 100% 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
background: transparent; |
||||
|
||||
.bg { |
||||
position: absolute; |
||||
top: 0; |
||||
right: 0; |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
|
||||
.con-box { |
||||
width: 100%; |
||||
padding: 0 50rpx; |
||||
box-sizing: border-box; |
||||
height: 80%; |
||||
background: linear-gradient(to right, #8FB4F2 0%, #BCD2F2 100%); |
||||
z-index: -1; |
||||
position: relative; |
||||
border-radius: 8rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
.icon { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
background: rgba(255, 255, 255, 0.3); |
||||
color: #fff; |
||||
border-radius: 10%; |
||||
width: 40rpx; |
||||
height: 40rpx; |
||||
margin-left: 20rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
After Width: | Height: | Size: 27 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 2.6 KiB |
Loading…
Reference in new issue