update
This commit is contained in:
parent
59998f36cb
commit
a906aecc95
BIN
ahyd_DIB.zip
BIN
ahyd_DIB.zip
Binary file not shown.
@ -46,11 +46,11 @@
|
||||
<div class="header" :style="{height:menu.height + 'px',top:menu.top+'px'}">
|
||||
<image class="backArrow" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg" @click="handleBack"/>
|
||||
<div class="timeSelect">
|
||||
<img class="selectIcon" src="/static/images/newCommercial/selectDateIcon.svg"/>
|
||||
<img class="selectIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/selectDateIcon.svg"/>
|
||||
<picker mode="date" :value="searchText" :end="lastDay" @change="changeAllProvinceSearch" >
|
||||
<view class="time">
|
||||
<view class="text">{{ searchText }}</view>
|
||||
<image class="icon" src="/static/images/newCommercial/arrow_bottom.svg"></image>
|
||||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/arrow_bottom.svg"></image>
|
||||
</view>
|
||||
</picker>
|
||||
</div>
|
||||
@ -173,11 +173,11 @@
|
||||
<div class="itemTop">
|
||||
<div class="itemLeft">
|
||||
<div style="display: flex;align-items: center">
|
||||
<img class="itemFixed" src="/static/images/newCommercial/fixedIcon.svg"/>
|
||||
<img class="itemFixed" src="https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/fixedIcon.svg"/>
|
||||
<span class="serverName">{{item.name.split('管理中心')[0]}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<img class="itemRight" :style="{transform:item.showChild?'':'rotate(-90deg)'}" src="/static/images/newCommercial/arrow_bottom.svg"/>
|
||||
<img class="itemRight" :style="{transform:item.showChild?'':'rotate(-90deg)'}" src="https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/arrow_bottom.svg"/>
|
||||
</div>
|
||||
<div class="itemDetail">
|
||||
<div class="message" style="width: 30%">
|
||||
@ -188,12 +188,13 @@
|
||||
<span class="value">{{item.flow}}</span>
|
||||
<span class="label">断面流量</span>
|
||||
</div>
|
||||
<div class="message" style="flex-direction: initial;width: 40%">
|
||||
<div style="width: 40px;height: 40px;background: red"></div>
|
||||
<div class="message" style="flex-direction: initial;width: 40%;justify-content: flex-start">
|
||||
<!-- <div style="width: 40px;height: 40px;background: red"></div>-->
|
||||
<!-- <EntryRate :data="item.entryList" style="width: 40px;height: 40px"/>-->
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<canvas class="cirRate" :canvas-id=index />
|
||||
<div style="display: flex;flex-direction: column;">
|
||||
<span class="value" style="color: red">{{item.flowRate}}</span>
|
||||
<span class="label">入区流量</span>
|
||||
<span class="label">入区率</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -204,7 +205,7 @@
|
||||
<div class="childTop">
|
||||
<div class="topLeft">
|
||||
<div class="imgBox">
|
||||
<image class="topIcon" src="/static/images/newCommercial/mapIcon.svg"/>
|
||||
<image class="topIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/mapIcon.svg"/>
|
||||
</div>
|
||||
<span class="serviceName">{{subItem.name}}</span>
|
||||
</div>
|
||||
@ -212,7 +213,7 @@
|
||||
</div>
|
||||
<div class="childDetail" v-for="(thirdItem,thirdIndex) in subItem.regionList" :key="thirdIndex">
|
||||
<div class="thirdItem">
|
||||
<span class="serviceFixed">{{thirdItem.name}}区</span>
|
||||
<div class="serviceFixed">{{thirdItem.name}}区</div>
|
||||
<div class="itemType">
|
||||
<div class="typeValue">{{thirdItem.LargeVehicle_Count}}/{{thirdItem.MediumVehicle_Count}}/{{thirdItem.MinVehicle_Count}}</div>
|
||||
<div class="typeLabel">大/中/小型车</div>
|
||||
@ -221,8 +222,8 @@
|
||||
<div class="typeValue">{{thirdItem.Vehicle_Count}}/{{thirdItem.SectionFlow_Count}}</div>
|
||||
<div class="typeLabel">入区/断面</div>
|
||||
</div>
|
||||
<div class="itemType">
|
||||
<div class="typeValue" style="color: #E83944">{{thirdItem.entryRate}}%</div>
|
||||
<div class="itemType" :style="{width: 'calc((100% - 40px)*0.2)'}">
|
||||
<div class="typeValue" :style="{color:thirdItem.entryRate>30 || thirdItem.entryRate<5?'red':''}">{{thirdItem.entryRate!==0 && thirdItem.Vehicle_Count< thirdItem.SectionFlow_Count ? `${thirdItem.entryRate}%`:'-'}}</div>
|
||||
<div class="typeLabel">入区率</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -478,6 +479,42 @@ export default {
|
||||
this.searchText=''
|
||||
},
|
||||
methods:{
|
||||
showScoreAnimation1(copyRightItems,id) {
|
||||
/*
|
||||
cxt_arc.arc(x, y, r, sAngle, eAngle, counterclockwise);
|
||||
x Number 圆的x坐标
|
||||
y Number 圆的y坐标
|
||||
r Number 圆的半径
|
||||
sAngle Number 起始弧度，单位弧度（在3点钟方向）
|
||||
eAngle Number 终止弧度
|
||||
counterclockwise Boolean 可选。指定弧度的方向是逆时针还是顺时针。默认是false，即顺时针。
|
||||
*/
|
||||
let that = this
|
||||
// 页面渲染完成
|
||||
// 这部分是灰色底层
|
||||
let cxt_arc = wx.createCanvasContext(id) //创建并返回绘图上下文context对象。
|
||||
cxt_arc.setLineWidth(6) //绘线的宽度
|
||||
cxt_arc.setStrokeStyle('#C5D6FF') //绘线的颜色，底色
|
||||
cxt_arc.setLineCap('round') //线条端点样式
|
||||
cxt_arc.beginPath() //开始一个新的路径
|
||||
cxt_arc.arc(20, 20, 16, 0, 2 * Math.PI, false) //设置一个原点(53,53)，半径为50的圆的路径到当前路径
|
||||
cxt_arc.stroke() //对当前路径进行描边
|
||||
//这部分是绿色部分
|
||||
cxt_arc.setLineWidth(6)
|
||||
cxt_arc.setStrokeStyle('#1A5FFF')//可修改所需颜色
|
||||
cxt_arc.setLineCap('round')
|
||||
cxt_arc.beginPath() //开始一个新的路径
|
||||
cxt_arc.arc(
|
||||
20,
|
||||
20,
|
||||
16,
|
||||
(-Math.PI * 1) / 2,
|
||||
2 * Math.PI * (copyRightItems / 100) - (Math.PI * 1) / 2,
|
||||
false
|
||||
)
|
||||
cxt_arc.stroke() //对当前路径进行描边
|
||||
cxt_arc.draw()
|
||||
},
|
||||
handleNoneChild(obj){
|
||||
this.regionList.forEach(item=>{
|
||||
if (item.name === obj.name){
|
||||
@ -527,16 +564,15 @@ export default {
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
item.entry = entryNum
|
||||
item.flow = flowNum
|
||||
item.flowRate = ((entryNumNoZero / flowNumNoZero)*100).toFixed(2) + '%'
|
||||
item.flowRate =flowNumNoZero? ((entryNumNoZero / flowNumNoZero)*100).toFixed(2) + '%':'-'
|
||||
item.showChild = true
|
||||
item.entryList = [{name:'已入区',value:Number(item.flowRate.split('%')[0])},{name:'未入区',value:100 - item.flowRate.split('%')[0]}]
|
||||
item.bg = item.name.indexOf('皖中')!==-1?'/static/images/newCommercial/Middle.png':item.name.indexOf('皖西')!==-1?'/static/images/newCommercial/west.png':item.name.indexOf('皖东')!==-1?'/static/images/newCommercial/east.png':item.name.indexOf('皖南')!==-1?'/static/images/newCommercial/south.png':item.name.indexOf('皖北')!==-1?'/static/images/newCommercial/north.png':''
|
||||
item.bg = item.name.indexOf('皖中')!==-1?'https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/Middle.png':item.name.indexOf('皖西')!==-1?'https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/west.png':item.name.indexOf('皖东')!==-1?'https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/east.png':item.name.indexOf('皖南')!==-1?'https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/south.png':item.name.indexOf('皖北')!==-1?'https://eshangtech.com/ShopICO/ahyd-BID/newCommercial/north.png':''
|
||||
})
|
||||
console.log('bayonetPie',bayonetPie)
|
||||
for (let i=0;i<=bayonetPie.length-1;i++){
|
||||
for (let j=0;j<=bayonetPie.length - i - 1;j++){
|
||||
if (bayonetPie[j] && bayonetPie[j + 1] && bayonetPie[j].entry && bayonetPie[j+1].entry){
|
||||
@ -550,19 +586,23 @@ export default {
|
||||
}
|
||||
bayonetPie.forEach(item=>{
|
||||
console.log('item',item)
|
||||
// for (let i=0;i<=item.spList.length-1;i++){
|
||||
// for (let j=0;j<=item.spList.length - i - 1;j++){
|
||||
// if (item.spList[j] && item.spList[j + 1] && item.spList[j].Vehicle_Count && item.spList[j+1].Vehicle_Count){
|
||||
// if (item.spList[j].Vehicle_Count < item.spList[j+1].Vehicle_Count){
|
||||
// let temp = item.spList[j]
|
||||
// item.spList[j] = item.spList[j + 1]
|
||||
// item.spList[j + 1] = temp
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
for (let i=0;i<=item.spList.length-1;i++){
|
||||
for (let j=0;j<=item.spList.length - i - 1;j++){
|
||||
if (item.spList[j] && item.spList[j + 1] && item.spList[j].Vehicle_Count && item.spList[j+1].Vehicle_Count){
|
||||
if (item.spList[j].Vehicle_Count < item.spList[j+1].Vehicle_Count){
|
||||
let temp = item.spList[j]
|
||||
item.spList[j] = item.spList[j + 1]
|
||||
item.spList[j + 1] = temp
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
this.regionList = bayonetPie
|
||||
this.regionList.forEach((item,index)=>{
|
||||
const number = Number(item.flowRate.split('%')[0])
|
||||
this.showScoreAnimation1(number,index)
|
||||
})
|
||||
console.log('this.regionList',this.regionList)
|
||||
uni.hideLoading()
|
||||
},
|
||||
@ -1764,6 +1804,10 @@ export default {
|
||||
.message{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.cirRate{
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
.label{
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
@ -1829,17 +1873,24 @@ export default {
|
||||
.childDetail{
|
||||
.thirdItem{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
.serviceFixed{
|
||||
display: inline-block;
|
||||
width: 40px;
|
||||
box-sizing: border-box;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #160002;
|
||||
line-height: 20px;
|
||||
line-height: 18px;
|
||||
}
|
||||
.itemType{
|
||||
display: inline-block;
|
||||
width: calc((100% - 40px)*0.4);
|
||||
white-space: nowrap;
|
||||
.typeValue{
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB |
@ -1,13 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>图标/更多@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.800000012">
|
||||
<g id="车流分析0706" transform="translate(-202.000000, -1661.000000)" fill="#576EFF">
|
||||
<g id="图标/更多" transform="translate(202.000000, 1661.000000)">
|
||||
<g id="图标/更多" transform="translate(8.000000, 8.000000) rotate(-270.000000) translate(-8.000000, -8.000000) ">
|
||||
<path d="M6.10744349,2.10744349 L11.2928932,7.29289322 L11.2928932,7.29289322 C11.6834175,7.68341751 11.6834175,8.31658249 11.2928932,8.70710678 L6.10744349,13.8925565 C5.7169192,14.2830808 5.08375422,14.2830808 4.69322993,13.8925565 C4.30270564,13.5020322 4.30270564,12.8688672 4.69322993,12.4783429 L9.17133671,7.99955027 L4.69322993,3.52165705 C4.30270564,3.13113276 4.30270564,2.49796778 4.69322993,2.10744349 C5.08375422,1.7169192 5.7169192,1.7169192 6.10744349,2.10744349 Z" id="形状结合"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
@ -1,12 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="车流分析0706" transform="translate(-140.000000, -1661.000000)">
|
||||
<g id="编组" transform="translate(140.000000, 1661.000000)">
|
||||
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
|
||||
<path d="M8,1 C11.3137085,1 14,3.6862915 14,7 C14,9.209139 12,11.8758057 8,15 C4,11.8758057 2,9.209139 2,7 C2,3.6862915 4.6862915,1 8,1 Z M8,4.5 C6.61928813,4.5 5.5,5.61928813 5.5,7 C5.5,8.38071187 6.61928813,9.5 8,9.5 C9.38071187,9.5 10.5,8.38071187 10.5,7 C10.5,5.61928813 9.38071187,4.5 8,4.5 Z" id="形状结合" fill="#1A5FFF" opacity="0.5"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 948 B |
@ -1,32 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>服务区@2x</title>
|
||||
<defs>
|
||||
<circle id="path-1" cx="14.3492424" cy="14" r="14"></circle>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="车流分析0706" transform="translate(-298.000000, -1661.000000)">
|
||||
<g id="服务区" transform="translate(297.000000, 1661.000000)">
|
||||
<g id="编组" transform="translate(1.000000, 0.000000)">
|
||||
<g id="服务区/地址备份-2" transform="translate(-1.000000, 0.000000)">
|
||||
<g id="编组-88" transform="translate(0.650758, 0.000000)">
|
||||
<mask id="mask-2" fill="white">
|
||||
<use xlink:href="#path-1"></use>
|
||||
</mask>
|
||||
<use id="蒙版" fill="#EFEFEF" xlink:href="#path-1"></use>
|
||||
<path d="M1.37741911,9.5 C3.0745178,12.6945387 5.90785113,15.527872 9.87741911,18 L25.3774191,3.5 L15.8774191,-4 C5.87741911,0 1.04408578,2 1.37741911,2 C1.87741911,2 -1.16822891,4.70819195 1.37741911,9.5 Z" id="路径-10" fill="#A3C8FF" mask="url(#mask-2)"></path>
|
||||
<polygon id="路径-12" fill="#AFE881" mask="url(#mask-2)" points="4.3492424 22.5 11.8492424 16 20.3492424 21 24.8492424 27.5 12.8492424 30.5 0.349242405 26.5"></polygon>
|
||||
<path d="M3.94974747,25.1066017 L1.82842712,22.9852814 L6.778,18.0350779 L-1,10.2573593 L1.12132034,8.13603897 L8.899,15.9140779 L23.0416306,1.77207794 L25.1629509,3.89339828 L21.627,7.42807794 L31.5269119,17.3284271 L29.4055916,19.4497475 L19.506,9.55007794 L15.263,13.7920779 L25.8700577,24.3994949 L23.7487373,26.5208153 L13.142,15.9140779 L11.0208153,18.0355339 L3.94974747,25.1066017 Z" id="形状结合" fill="#FFFFFF" mask="url(#mask-2)"></path>
|
||||
</g>
|
||||
<g id="map-pin-line" transform="translate(8.000000, 6.000000)">
|
||||
<polygon id="路径" points="0 0 14 0 14 14 0 14"></polygon>
|
||||
<path d="M3.28766667,9.85016667 C1.23743261,7.7999075 1.23744618,4.47580305 3.28769698,2.42556062 C5.33794777,0.375318191 8.66205223,0.375318191 10.712303,2.42556062 C12.7625538,4.47580305 12.7625674,7.7999075 10.7123333,9.85016667 L7,13.5625 L3.28766667,9.85016667 Z" id="形状" fill="#007AEB" fill-rule="nonzero"></path>
|
||||
<path d="M7,8.47116667 C5.71133558,8.47116667 4.66666667,7.42649775 4.66666667,6.13783333 C4.66666667,4.84916892 5.71133558,3.8045 7,3.8045 C8.28866442,3.8045 9.33333333,4.84916892 9.33333333,6.13783333 C9.33333333,7.42649775 8.28866442,8.47116667 7,8.47116667 Z" id="形状结合" fill="#FFFFFF" fill-rule="nonzero"></path>
|
||||
</g>
|
||||
<circle id="椭圆形备份-8" stroke="#FFFFFF" cx="15" cy="14" r="13.5"></circle>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 502 B |
@ -1,24 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>首页图标/时间选择1备份_2@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="车流分析0706" transform="translate(-234.000000, -1661.000000)">
|
||||
<g id="编组" transform="translate(234.000000, 1661.000000)">
|
||||
<rect id="矩形" fill="#CEE0FF" x="0" y="2" width="16" height="14" rx="1"></rect>
|
||||
<rect id="矩形" fill="#4078FF" x="3" y="0.5" width="2" height="3.5" rx="1"></rect>
|
||||
<rect id="矩形备份" fill="#4078FF" x="11" y="0.5" width="2" height="3.5" rx="1"></rect>
|
||||
<path d="M1,2 L15,2 C15.5522847,2 16,2.44771525 16,3 L16,5 L16,5 L0,5 L0,3 C-6.76353751e-17,2.44771525 0.44771525,2 1,2 Z" id="矩形" fill="#4078FF"></path>
|
||||
<rect id="矩形" fill="#F8F9FB" x="2.5" y="7" width="3" height="3"></rect>
|
||||
<rect id="矩形备份-4" fill="#F8F9FB" x="2.5" y="11" width="3" height="3"></rect>
|
||||
<rect id="矩形备份-2" fill="#F8F9FB" x="6.5" y="7" width="3" height="3"></rect>
|
||||
<rect id="矩形备份-5" fill="#F8F9FB" x="6.5" y="11" width="3" height="3"></rect>
|
||||
<rect id="矩形备份-3" fill="#F8F9FB" x="10.5" y="7" width="3" height="3"></rect>
|
||||
<rect id="矩形备份-6" fill="#F8F9FB" x="10.5" y="11" width="3" height="3"></rect>
|
||||
<g transform="translate(8.500000, 8.000000) rotate(-45.000000) translate(-8.500000, -8.000000) translate(7.000000, 7.000000)" fill="#3980FE" id="矩形">
|
||||
<rect x="0" y="0" width="1" height="2"></rect>
|
||||
<rect x="0" y="1" width="3" height="1"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 182 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Loading…
x
Reference in New Issue
Block a user