update
@ -298,11 +298,11 @@ h4 {
|
||||
}
|
||||
|
||||
.ico-ptrs:before {
|
||||
background-image: url('/static/images/expense/ptrs.png');
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/expense/ptrs.png');
|
||||
}
|
||||
|
||||
.ico-jbry:before {
|
||||
background-image: url('/static/images/expense/jbry.png');
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/expense/jbry.png');
|
||||
}
|
||||
|
||||
.ico-je:before {
|
||||
|
||||
@ -1,8 +1,15 @@
|
||||
*{ box-sizing: border-box;}
|
||||
.ml10 {margin-left: 8rpx;}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.ml10 {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
.pb20 {
|
||||
padding-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.content-title {
|
||||
|
||||
width: 78%;
|
||||
@ -14,6 +21,7 @@
|
||||
font-weight: bold;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.box-top {
|
||||
margin-left: 40rpx;
|
||||
margin-right: 40rpx;
|
||||
@ -23,22 +31,26 @@
|
||||
font-size: 26rpx;
|
||||
padding: 16rpx 0 8rpx 0;
|
||||
}
|
||||
|
||||
.main-card {
|
||||
/* border: 1rpx solid #eee; */
|
||||
border-radius: 8rpx;
|
||||
/* box-shadow: 0px 2rpx 8rpx 0.4rpx #e2e2e2; */
|
||||
box-shadow: 0px 4rpx 10rpx 0px rgba(201,201,201,0.52);
|
||||
box-shadow: 0px 4rpx 10rpx 0px rgba(201, 201, 201, 0.52);
|
||||
margin-left: 30rpx;
|
||||
margin-right: 30rpx;
|
||||
background-color: #fff;
|
||||
padding: 16rpx 0;
|
||||
}
|
||||
.main-card +.main-card {
|
||||
|
||||
.main-card+.main-card {
|
||||
margin-top: 26rpx;
|
||||
}
|
||||
|
||||
.uni-collapse-content .main-card:nth-last-child(1) {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -53,18 +65,24 @@
|
||||
align-items: center;
|
||||
padding: 0 16rpx 12rpx 16rpx;
|
||||
}
|
||||
.base-body > div, .base-body > p{
|
||||
|
||||
.base-body>div,
|
||||
.base-body>p {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.base-body > div span, .base-body > p span{
|
||||
|
||||
.base-body>div span,
|
||||
.base-body>p span {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.base-body i.ico {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: #888;
|
||||
min-width: 120rpx;
|
||||
@ -83,47 +101,59 @@
|
||||
/* font-weight: bold; */
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.base-body.bb {
|
||||
border-top: 1rpx dashed #eee;
|
||||
padding-top: 16rpx;
|
||||
}
|
||||
|
||||
.detail-other.bb {
|
||||
border-top: 12rpx solid #eee;
|
||||
padding-top: 16rpx;
|
||||
}
|
||||
|
||||
.detail-other {
|
||||
padding: 0 16rpx 16rpx;
|
||||
}
|
||||
|
||||
.detail-sign {
|
||||
font-size: 28rpx;
|
||||
padding: 16rpx 32rpx 8rpx 32rpx;
|
||||
}
|
||||
|
||||
.detail-other p {
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.detail-cont {
|
||||
font-size: 26rpx;
|
||||
/* margin-top: 8rpx; */
|
||||
padding-left: 40rpx;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.main-card.detail-other {
|
||||
padding-top: 16rpx;
|
||||
}
|
||||
|
||||
.base-info {
|
||||
background-color: #fff;
|
||||
}
|
||||
.base-info + .base-info {
|
||||
|
||||
.base-info+.base-info {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.text-b9 {
|
||||
color: #b9b9b9
|
||||
}
|
||||
|
||||
.process-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -135,9 +165,11 @@
|
||||
.uni-list-cell:after {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.button-hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.button-box {
|
||||
padding-top: 36rpx;
|
||||
display: flex;
|
||||
@ -145,10 +177,12 @@
|
||||
justify-content: space-around;
|
||||
padding-bottom: 6rpx;
|
||||
}
|
||||
|
||||
.button-box image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.button-box span {
|
||||
font-size: 24rpx;
|
||||
display: flex;
|
||||
@ -156,6 +190,7 @@
|
||||
/* background-color: #fff; */
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button-box span i:before {
|
||||
height: 90rpx;
|
||||
width: 90rpx;
|
||||
@ -164,56 +199,70 @@
|
||||
box-shadow: 0rpx 2rpx 4rpx #cbcbcb;
|
||||
color: #999;
|
||||
}
|
||||
.imgBox{
|
||||
|
||||
.imgBox {
|
||||
box-sizing: border-box;
|
||||
font-size: 24rpx;
|
||||
margin-top: 20rpx;
|
||||
width: 100%;
|
||||
padding-left: 32rpx;
|
||||
}
|
||||
|
||||
/* .ico-wjxz:before{
|
||||
background-image: url('/static/images/tender/wjxz.png');
|
||||
} */
|
||||
.ico-ndbz:before{
|
||||
.ico-ndbz:before {
|
||||
background-image: url('/static/images/tender/je.png');
|
||||
}
|
||||
.ico-user:before{
|
||||
|
||||
.ico-user:before {
|
||||
background-image: url('/static/images/tender/lxr.png');
|
||||
}
|
||||
.ico-shijian:before{
|
||||
|
||||
.ico-shijian:before {
|
||||
background-image: url('/static/images/tender/sj.png');
|
||||
}
|
||||
.ico-bgw:before{
|
||||
background-image: url('/static/images/tender/bgw.png');
|
||||
}
|
||||
.ico-zbr:before{
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/zbr.png');
|
||||
}
|
||||
.ico-jdr:before{
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/jdr.png');
|
||||
}
|
||||
.ico-fdhfqk:before{
|
||||
background-image: url('/static/images/tender/fdhfqk.png');
|
||||
}
|
||||
.ico-bm:before{
|
||||
background-image: url('/static/images/tender/bm.png');
|
||||
}
|
||||
.ico-lxfs:before{
|
||||
background-image: url('/static/images/tender/lxfs.png');
|
||||
}
|
||||
.ico-pwh:before{
|
||||
background-image: url('/static/images/tender/pwh.png');
|
||||
}
|
||||
.ico-xmgk:before{
|
||||
background-image: url('/static/images/tender/xmgk.png');
|
||||
}
|
||||
.ico-xmgm:before{
|
||||
background-image: url('/static/images/tender/xmgm.png');
|
||||
}
|
||||
.ico-zbfs:before{
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/zbfs.png');
|
||||
}
|
||||
.ico-qtyq:before{
|
||||
background-image: url('/static/images/tender/yj.png');
|
||||
|
||||
.ico-bgw:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/bgw.png');
|
||||
}
|
||||
|
||||
.ico-zbr:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/zbr.png');
|
||||
}
|
||||
|
||||
.ico-jdr:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/jdr.png');
|
||||
}
|
||||
|
||||
.ico-fdhfqk:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/fdhfqk.png');
|
||||
}
|
||||
|
||||
.ico-bm:before {
|
||||
background-image: url('/static/images/tender/bm.png');
|
||||
}
|
||||
|
||||
.ico-lxfs:before {
|
||||
background-image: url('/static/images/tender/lxfs.png');
|
||||
}
|
||||
|
||||
.ico-pwh:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/pwh.png');
|
||||
}
|
||||
|
||||
.ico-xmgk:before {
|
||||
background-image: url('/static/images/tender/xmgk.png');
|
||||
}
|
||||
|
||||
.ico-xmgm:before {
|
||||
background-image: url('/static/images/tender/xmgm.png');
|
||||
}
|
||||
|
||||
.ico-zbfs:before {
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/tender/zbfs.png');
|
||||
}
|
||||
|
||||
.ico-qtyq:before {
|
||||
background-image: url('/static/images/tender/yj.png');
|
||||
}
|
||||
@ -123,7 +123,7 @@ export default {
|
||||
}
|
||||
|
||||
.ico-pdf:before {
|
||||
background-image: url('../../static/images/fileType/pdf.png');
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/fileType/pdf.png');
|
||||
}
|
||||
|
||||
.ico-ppt:before {
|
||||
|
||||
@ -3,9 +3,10 @@
|
||||
<view>
|
||||
<view class="block-title">请选择请假审批流程</view>
|
||||
<view class="uni-flex uni-row leave-box">
|
||||
<view class="leave-type uni-flex uni-column" :class="{'active':selectType==item.Prodef_Id}" @tap="choeseSelect(item.Prodef_Id)" v-for="(item,i) in prodeList" :key="i">
|
||||
<view class="leave-type uni-flex uni-column" :class="{ 'active': selectType == item.Prodef_Id }"
|
||||
@tap="choeseSelect(item.Prodef_Id)" v-for="(item, i) in prodeList" :key="i">
|
||||
<image :src="item.imgPath" mode="aspectFit" style="width: 67upx;height: 61upx;"></image>
|
||||
<text class="type-title">{{item.Prodef_Name}}</text>
|
||||
<text class="type-title">{{ item.Prodef_Name }}</text>
|
||||
<text>请假审批流程</text>
|
||||
</view>
|
||||
<!-- <view class="leave-type uni-flex uni-column" :class="{'active':selectType==461}" @tap="choeseSelect(461)">
|
||||
@ -26,9 +27,11 @@
|
||||
<text>服务区</text>
|
||||
<text class="text-red">*</text>
|
||||
<view class=" uni-flex uni-row" style="flex: 1;margin-left: 32upx;align-items: center;">
|
||||
<picker mode="selector" @change="pickerChange" :value="pickerIndex" range-key="SERVERPART_NAME" :range="severpartList" style="flex: 1;" >
|
||||
<picker mode="selector" @change="pickerChange" :value="pickerIndex" range-key="SERVERPART_NAME"
|
||||
:range="severpartList" style="flex: 1;">
|
||||
|
||||
<input disabled="true" type="text" :value="severpartList[pickerIndex].SERVERPART_NAME" placeholder="请选择" placeholder-style="color:#969EA4;"/>
|
||||
<input disabled="true" type="text" :value="severpartList[pickerIndex].SERVERPART_NAME"
|
||||
placeholder="请选择" placeholder-style="color:#969EA4;" />
|
||||
</picker>
|
||||
<i class="uni-icon uni-icon-arrowright"></i>
|
||||
</view>
|
||||
@ -40,8 +43,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex';
|
||||
export default {
|
||||
import { mapGetters } from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
prodeList: [
|
||||
@ -52,47 +55,47 @@
|
||||
],
|
||||
selectType: 456,
|
||||
severpartList: [],
|
||||
canselectList:{},
|
||||
canselectList: {},
|
||||
pickerIndex: 0,
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
...mapGetters({'users':'getUser'})
|
||||
computed: {
|
||||
...mapGetters({ 'users': 'getUser' })
|
||||
},
|
||||
methods: {
|
||||
choeseSelect(_id) {
|
||||
this.selectType = _id
|
||||
if(_id==462){
|
||||
if (_id == 462) {
|
||||
this.severpartList = this.canselectList.ListSpregion
|
||||
}else{
|
||||
} else {
|
||||
this.severpartList = this.canselectList.ListServer
|
||||
}
|
||||
this.$forceUpdate()
|
||||
|
||||
},
|
||||
pickerChange(e){
|
||||
pickerChange(e) {
|
||||
|
||||
this.pickerIndex = e.detail.value
|
||||
},
|
||||
getSeverpart(){
|
||||
getSeverpart() {
|
||||
let _this = this
|
||||
_this.$request.$get('GetStaffLeaveServerpart',{}).then(res=>{
|
||||
_this.$request.$get('GetStaffLeaveServerpart', {}).then(res => {
|
||||
_this.canselectList = res.Data
|
||||
_this.severpartList = res.Data.ListServer
|
||||
})
|
||||
},
|
||||
nextTap(){
|
||||
this.$util.toNextRoute('navigateTo', '/pages/askForLeave/newLeave2?prodefId='+this.selectType+'&sCode='+this.severpartList[this.pickerIndex].SERVERPART_CODE)
|
||||
nextTap() {
|
||||
this.$util.toNextRoute('navigateTo', '/pages/askForLeave/newLeave2?prodefId=' + this.selectType + '&sCode=' + this.severpartList[this.pickerIndex].SERVERPART_CODE)
|
||||
|
||||
},
|
||||
getProde(){
|
||||
let _this =this
|
||||
let img = ['https://eshangtech.com/ShopICO/ahyd-BID/leave/fwq-yg.png','https://eshangtech.com/ShopICO/ahyd-BID/leave/fwq-gl.png','https://eshangtech.com/ShopICO/ahyd-BID/leave/qy.png']
|
||||
this.$request.$get('GetProdefInfo',{}).then(res=>{
|
||||
if(res.ResultCode==100){
|
||||
getProde() {
|
||||
let _this = this
|
||||
let img = ['https://eshangtech.com/ShopICO/ahyd-BID/leave/fwq-yg.png', 'https://eshangtech.com/ShopICO/ahyd-BID/leave/fwq-gl.png', 'https://eshangtech.com/ShopICO/ahyd-BID/leave/qy.png']
|
||||
this.$request.$get('GetProdefInfo', {}).then(res => {
|
||||
if (res.ResultCode == 100) {
|
||||
_this.selectType = res.Data.List[0].Prodef_Id
|
||||
res.Data.List.map((n,i)=>{
|
||||
n.Prodef_Name = n.Prodef_Name.replace('请假审批流程','')
|
||||
res.Data.List.map((n, i) => {
|
||||
n.Prodef_Name = n.Prodef_Name.replace('请假审批流程', '')
|
||||
n.imgPath = img[i]
|
||||
|
||||
})
|
||||
@ -109,25 +112,28 @@
|
||||
this.getProde()
|
||||
this.getSeverpart()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.content {
|
||||
.content {
|
||||
height: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.block-title {
|
||||
}
|
||||
|
||||
.block-title {
|
||||
color: #788691;
|
||||
font-size: 26upx;
|
||||
padding: 27upx 24upx;
|
||||
}
|
||||
.leave-box {
|
||||
}
|
||||
|
||||
.leave-box {
|
||||
justify-content: space-around;
|
||||
padding: 0 12upx;
|
||||
margin-bottom: 24upx;
|
||||
}
|
||||
.leave-type {
|
||||
}
|
||||
|
||||
.leave-type {
|
||||
width: 216upx;
|
||||
height: 222upx;
|
||||
background-color: #FFFFFF;
|
||||
@ -138,15 +144,17 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1upx solid #fff;
|
||||
}
|
||||
.leave-type.active {
|
||||
}
|
||||
|
||||
.leave-type.active {
|
||||
border-color: #5E8FEA;
|
||||
position: relative;
|
||||
}
|
||||
.active:after {
|
||||
}
|
||||
|
||||
.active:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-image: url('../../static/images/leave/type-active.png');
|
||||
background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/leave/type-active.png');
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
right: -2upx;
|
||||
@ -154,27 +162,33 @@
|
||||
height: 59upx;
|
||||
width: 61upx;
|
||||
|
||||
}
|
||||
.type-title{
|
||||
}
|
||||
|
||||
.type-title {
|
||||
margin-top: 24upx;
|
||||
line-height: 1;
|
||||
}
|
||||
.block-input {
|
||||
}
|
||||
|
||||
.block-input {
|
||||
height: 92upx;
|
||||
background-color: #fff;
|
||||
padding: 0 24upx;
|
||||
}
|
||||
.text-red {
|
||||
}
|
||||
|
||||
.text-red {
|
||||
color: #EA3020;
|
||||
}
|
||||
.tip-text {
|
||||
}
|
||||
|
||||
.tip-text {
|
||||
font-size: 24upx;
|
||||
margin-top: 24upx;
|
||||
}
|
||||
.uni-icon-arrowright{
|
||||
}
|
||||
|
||||
.uni-icon-arrowright {
|
||||
color: #969EA4;
|
||||
}
|
||||
.next-btn {
|
||||
}
|
||||
|
||||
.next-btn {
|
||||
background-color: #fff;
|
||||
width: 95%;
|
||||
border-radius: 0;
|
||||
@ -183,10 +197,11 @@
|
||||
height: 90upx;
|
||||
line-height: 89upx;
|
||||
margin-top: 60upx;
|
||||
}
|
||||
button:after {
|
||||
}
|
||||
|
||||
button:after {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
border-top: 2upx solid #E9EDF2;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="listBox" v-if="type==='year'">
|
||||
<div class="listBox" v-if="type === 'year'">
|
||||
<div class="thisMonth">
|
||||
<div class="titleTop">
|
||||
<p class="title">{{month}}月自营计划</p>
|
||||
<p class="title">{{ month }}月自营计划</p>
|
||||
<div class="question" @click="handleShowNotice">
|
||||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||||
<image src="https://eshangtech.com/ShopICO/ahyd-BID/index/noticeQuestion.svg"></image>
|
||||
</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{monthText}}</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{ monthText }}</div>
|
||||
<div v-if="showNotice" class="meng" @click="handleNoShowNotice"></div>
|
||||
</div>
|
||||
<view class="box">
|
||||
@ -18,71 +18,78 @@
|
||||
<view class="text">
|
||||
<view class="textTop">
|
||||
<view class="left">
|
||||
<p class="number">{{info.Budget_Degree?info.Budget_Degree + '%':'-'}}</p>
|
||||
<p v-if="info.Budget_Degree>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image></p>
|
||||
<p class="number">{{ info.Budget_Degree ? info.Budget_Degree + '%' : '-' }}</p>
|
||||
<p v-if="info.Budget_Degree >= 100" class="desc">
|
||||
<image class="success" src="/static/images/index/successMonth.svg"></image>
|
||||
</p>
|
||||
</view>
|
||||
<view class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<view class="box2">
|
||||
<image class="addIcon" :src="Number(info.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{info.Growth_Rate ?Math.abs(info.Growth_Rate) + '%':'-'}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(info.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ info.Growth_Rate ? Math.abs(info.Growth_Rate) + '%' : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="progressPlan">
|
||||
<div class="trans" :style="{width:info.Budget_Degree > 100 ? '100%' : info.Budget_Degree + '%'}"></div>
|
||||
<div class="trans" :style="{ width: info.Budget_Degree > 100 ? '100%' : info.Budget_Degree + '%' }">
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="success" style="margin-right: 39px">
|
||||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Revenue_Amount ?info.Revenue_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Revenue_Amount ? info.Revenue_Amount : '-' }}</p>
|
||||
</view>
|
||||
<view class="success">
|
||||
<p class="text">本月计划<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Budget_Amount ?info.Budget_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Budget_Amount ? info.Budget_Amount : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="list" v-for="(item,index) in dataList" :key="index" @click="handleDetail(item)">
|
||||
<div class="list" v-for="(item, index) in dataList" :key="index" @click="handleDetail(item)">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<p class="title" v-if="type==='year'"><text class="name">{{item.name}}</text>{{item.unit}}</p>
|
||||
<div class="value" >{{item.Budget_Degree}}%</div>
|
||||
<p class="title" v-if="type === 'year'"><text class="name">{{ item.name }}</text>{{ item.unit }}</p>
|
||||
<div class="value">{{ item.Budget_Degree }}%</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<div class="box2">
|
||||
<image class="addIcon" :src="Number(item.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{item.Growth_Rate?Math.abs(item.Growth_Rate) + '%':''}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(item.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ item.Growth_Rate ? Math.abs(item.Growth_Rate) + '%' : '' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="have" :style="{width:item.Budget_Degree + '%'}"></div>
|
||||
<div class="have" :style="{ width: item.Budget_Degree + '%' }"></div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="success">
|
||||
<text class="text">已完成:</text>
|
||||
<text class="money">{{item.Revenue_Amount}}</text>
|
||||
<text class="money">{{ item.Revenue_Amount }}</text>
|
||||
</div>
|
||||
<div class="success">
|
||||
<text class="text">计划: </text>
|
||||
<text class="money">{{item.Budget_Amount }}</text>
|
||||
<text class="money">{{ item.Budget_Amount }}</text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="listBox" v-if="type==='month'">
|
||||
<div class="listBox" v-if="type === 'month'">
|
||||
<div class="thisMonth">
|
||||
<div class="titleTop">
|
||||
<p class="title">{{item.Serverpart_Name}}自营计划</p>
|
||||
<p class="title">{{ item.Serverpart_Name }}自营计划</p>
|
||||
<div class="question" @click="handleShowNotice">
|
||||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||||
<image src="https://eshangtech.com/ShopICO/ahyd-BID/index/noticeQuestion.svg"></image>
|
||||
</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{itemText}}</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{ itemText }}</div>
|
||||
<div v-if="showNotice" class="meng" @click="handleNoShowNotice"></div>
|
||||
</div>
|
||||
<view class="box">
|
||||
@ -93,59 +100,66 @@
|
||||
<view class="text">
|
||||
<view class="textTop">
|
||||
<view class="left">
|
||||
<p class="number">{{info.Budget_Degree?info.Budget_Degree + '%':'-'}}</p>
|
||||
<p v-if="info.Budget_Degree>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image></p>
|
||||
<p class="number">{{ info.Budget_Degree ? info.Budget_Degree + '%' : '-' }}</p>
|
||||
<p v-if="info.Budget_Degree >= 100" class="desc">
|
||||
<image class="success" src="/static/images/index/successMonth.svg"></image>
|
||||
</p>
|
||||
</view>
|
||||
<view class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<view class="box2">
|
||||
<image class="addIcon" :src="Number(info.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{info.Growth_Rate ?Math.abs(info.Growth_Rate) + '%':'-'}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(info.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ info.Growth_Rate ? Math.abs(info.Growth_Rate) + '%' : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="progressPlan">
|
||||
<div class="trans" :style="{width:info.Budget_Degree > 100 ? '100%' : info.Budget_Degree + '%'}"></div>
|
||||
<div class="trans" :style="{ width: info.Budget_Degree > 100 ? '100%' : info.Budget_Degree + '%' }">
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="success" style="margin-right: 39px">
|
||||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Revenue_Amount ?info.Revenue_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Revenue_Amount ? info.Revenue_Amount : '-' }}</p>
|
||||
</view>
|
||||
<view class="success">
|
||||
<p class="text">本月计划<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Budget_Amount ?info.Budget_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Budget_Amount ? info.Budget_Amount : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="list" v-for="(item,index) in dataList" :key="index" @click="handleToServiceDetail(item)">
|
||||
<div class="list" v-for="(item, index) in dataList" :key="index" @click="handleToServiceDetail(item)">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<p class="title" ><text class="name">{{item.name}}</text>{{item.unit}}</p>
|
||||
<div class="value" >{{item.Budget_Degree}}%</div>
|
||||
<p class="title"><text class="name">{{ item.name }}</text>{{ item.unit }}</p>
|
||||
<div class="value">{{ item.Budget_Degree }}%</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<div class="box2">
|
||||
<image class="addIcon" :src="Number(item.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{item.Growth_Rate?Math.abs(item.Growth_Rate) + '%':''}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(item.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ item.Growth_Rate ? Math.abs(item.Growth_Rate) + '%' : '' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="have" :style="{width:item.Budget_Degree + '%'}"></div>
|
||||
<div class="have" :style="{ width: item.Budget_Degree + '%' }"></div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="success">
|
||||
<p class="text">已完成:</p>
|
||||
<text class="money">{{item.Revenue_Amount}}</text>
|
||||
<text class="money">{{ item.Revenue_Amount }}</text>
|
||||
</div>
|
||||
<div class="success">
|
||||
<p class="text">计划: </p>
|
||||
<text class="money">{{item.Budget_Amount }}</text>
|
||||
<text class="money">{{ item.Budget_Amount }}</text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -157,34 +171,34 @@
|
||||
import request from '@/util/index.js'
|
||||
export default {
|
||||
name: "planDetail",
|
||||
data(){
|
||||
return{
|
||||
date:'', //时间
|
||||
type:'', //类别
|
||||
dataList:[],
|
||||
id:'',
|
||||
showNotice:false,
|
||||
showNoticeYear:false,
|
||||
info:{},
|
||||
month:0,//传入的月份
|
||||
item:{},//月份的时候传入的整个片区信息
|
||||
itemText:'',//片区显示的文字
|
||||
monthText:'',//月份显示的文字
|
||||
lastDay:'',
|
||||
second:false
|
||||
data() {
|
||||
return {
|
||||
date: '', //时间
|
||||
type: '', //类别
|
||||
dataList: [],
|
||||
id: '',
|
||||
showNotice: false,
|
||||
showNoticeYear: false,
|
||||
info: {},
|
||||
month: 0,//传入的月份
|
||||
item: {},//月份的时候传入的整个片区信息
|
||||
itemText: '',//片区显示的文字
|
||||
monthText: '',//月份显示的文字
|
||||
lastDay: '',
|
||||
second: false
|
||||
}
|
||||
},
|
||||
onLoad(option){
|
||||
onLoad(option) {
|
||||
// 从缓存中拿到选中的时间
|
||||
this.lastDay = uni.getStorageSync('lastDay')
|
||||
// 判断是否是第二次进入页面,因为月份的片区 再点进去展示的月份的服务区 需要的参数会不一样
|
||||
if (option.second==='true'){
|
||||
if (option.second === 'true') {
|
||||
this.second = true
|
||||
}
|
||||
// 拿到上一个页面带来的参数
|
||||
this.type = option.type
|
||||
if (option.id){
|
||||
this.id =option.id
|
||||
if (option.id) {
|
||||
this.id = option.id
|
||||
}
|
||||
// 拿到传入的月份
|
||||
this.month = Number(option.month)
|
||||
@ -193,21 +207,21 @@ export default {
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
let d = date.getDate()
|
||||
if (m<10){
|
||||
m = '0'+m
|
||||
if (m < 10) {
|
||||
m = '0' + m
|
||||
}
|
||||
if (d<10){
|
||||
if (d < 10) {
|
||||
d = '0' + d
|
||||
}
|
||||
// 判断如果是当前月份的话 就拿到当前时间,不是当前月份的话 就拿那个月的最后一天
|
||||
if (option.month){
|
||||
if (Number(m) === Number(option.month)){
|
||||
if (option.month) {
|
||||
if (Number(m) === Number(option.month)) {
|
||||
this.date = `${y}-${m}-${d}`
|
||||
}else{
|
||||
} else {
|
||||
let month
|
||||
if (this.month<10){
|
||||
if (this.month < 10) {
|
||||
month = '0' + this.month
|
||||
}else{
|
||||
} else {
|
||||
month = this.month
|
||||
}
|
||||
//月份不是当前月
|
||||
@ -217,31 +231,31 @@ export default {
|
||||
}
|
||||
}
|
||||
// 直接把上一个页面点进的片区属性全部拿来
|
||||
if (option.item){
|
||||
if (option.item) {
|
||||
this.item = JSON.parse(option.item)
|
||||
}
|
||||
// 如果是第二次进入 那么调用的方法也不一样 做个判断 因为显示的列表类型会不一样
|
||||
if (option.second==='true'){
|
||||
if (option.second === 'true') {
|
||||
this.getDateSecond()
|
||||
}else{
|
||||
} else {
|
||||
this.getDateList()
|
||||
}
|
||||
// 拿到问号里面的文字
|
||||
this.handleNoticeText()
|
||||
},
|
||||
onShow(){
|
||||
onShow() {
|
||||
// 判断让小程序页面标题展示相应的名字
|
||||
if (this.second){
|
||||
if (this.second) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: `${this.month}月${this.item.Serverpart_Name}自营计划`,
|
||||
})
|
||||
}else{
|
||||
if (this.type==='year'){
|
||||
} else {
|
||||
if (this.type === 'year') {
|
||||
//每个月片区的列表
|
||||
uni.setNavigationBarTitle({
|
||||
title: `${this.month}月自营计划`,
|
||||
})
|
||||
}else{
|
||||
} else {
|
||||
//片区进来服务区的列表
|
||||
uni.setNavigationBarTitle({
|
||||
title: `${this.item.Serverpart_Name}本月自营计划`,
|
||||
@ -252,27 +266,27 @@ export default {
|
||||
onUnload() {
|
||||
this.$util.addUserBehavior()
|
||||
},
|
||||
methods:{
|
||||
methods: {
|
||||
// 跳转到服务区详情
|
||||
handleToServiceDetail(item){
|
||||
handleToServiceDetail(item) {
|
||||
uni.navigateTo({
|
||||
url:`/pages/commercialBI/serviceDetail?serviceInfo=${JSON.stringify(item)}&month=${this.month?this.month:''}&type=month&select=true`
|
||||
url: `/pages/commercialBI/serviceDetail?serviceInfo=${JSON.stringify(item)}&month=${this.month ? this.month : ''}&type=month&select=true`
|
||||
})
|
||||
},
|
||||
async getDateSecond(){
|
||||
async getDateSecond() {
|
||||
let req = {
|
||||
StatisticsDate:this.date,
|
||||
ProvinceCode:'340000',
|
||||
StatisticsType:4,
|
||||
SPRegionTypeID:this.id
|
||||
StatisticsDate: this.date,
|
||||
ProvinceCode: '340000',
|
||||
StatisticsType: 4,
|
||||
SPRegionTypeID: this.id
|
||||
}
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget',req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item=>{
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item => {
|
||||
let num = item.Serverpart_Name.indexOf('服务区')
|
||||
if (num!==-1){
|
||||
item.name = item.Serverpart_Name.slice(0,num)
|
||||
item.unit = item.Serverpart_Name.slice(num,100)
|
||||
}else{
|
||||
if (num !== -1) {
|
||||
item.name = item.Serverpart_Name.slice(0, num)
|
||||
item.unit = item.Serverpart_Name.slice(num, 100)
|
||||
} else {
|
||||
item.name = item.Serverpart_Name
|
||||
}
|
||||
item.Revenue_Amount = this.$util.fmoney(item.Revenue_Amount)
|
||||
@ -284,71 +298,71 @@ export default {
|
||||
this.dataList = data.Result_Data.RegionBudgetList
|
||||
},
|
||||
// 当从年份点进来的时候 片区列表的每一项都可以再次点击 进入到当月的 这个片区下的服务区的列表数据
|
||||
handleDetail(item){
|
||||
handleDetail(item) {
|
||||
uni.navigateTo({
|
||||
url:`/pages/commercialBI/planDetail?type=month&item=${JSON.stringify(item)}&id=${item.Serverpart_ID}&second=${true}&month=${this.month}`
|
||||
url: `/pages/commercialBI/planDetail?type=month&item=${JSON.stringify(item)}&id=${item.Serverpart_ID}&second=${true}&month=${this.month}`
|
||||
})
|
||||
},
|
||||
async handleNoticeText(){
|
||||
async handleNoticeText() {
|
||||
let date = new Date(this.lastDay)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
if(m<10){
|
||||
m = '0'+m
|
||||
if (m < 10) {
|
||||
m = '0' + m
|
||||
}
|
||||
let req = {}
|
||||
if (this.type==='year'){
|
||||
if (this.type === 'year') {
|
||||
req = {
|
||||
SearchParameter:{
|
||||
STATISTICS_DATE:`${m}`,
|
||||
ANALYSISINS_TYPE:'1012',
|
||||
ANALYSISINS_FORMAT:'3000'
|
||||
SearchParameter: {
|
||||
STATISTICS_DATE: `${m}`,
|
||||
ANALYSISINS_TYPE: '1012',
|
||||
ANALYSISINS_FORMAT: '3000'
|
||||
},
|
||||
PageIndex:1,
|
||||
PageSize:10
|
||||
PageIndex: 1,
|
||||
PageSize: 10
|
||||
}
|
||||
}else{
|
||||
} else {
|
||||
req = {
|
||||
SearchParameter:{
|
||||
STATISTICS_DATE:`${y}-${m}`,
|
||||
ANALYSISINS_TYPE:'1011',
|
||||
ANALYSISINS_FORMAT:'3000',
|
||||
SPREGIONTYPE_ID:this.item.Serverpart_ID
|
||||
SearchParameter: {
|
||||
STATISTICS_DATE: `${y}-${m}`,
|
||||
ANALYSISINS_TYPE: '1011',
|
||||
ANALYSISINS_FORMAT: '3000',
|
||||
SPREGIONTYPE_ID: this.item.Serverpart_ID
|
||||
},
|
||||
PageIndex:1,
|
||||
PageSize:10
|
||||
PageIndex: 1,
|
||||
PageSize: 10
|
||||
}
|
||||
}
|
||||
const data = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList',req)
|
||||
const data = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList', req)
|
||||
this.monthText = data.Result_Data.List[0].ANALYSIS_CONTENT
|
||||
this.itemText = data.Result_Data.List[0].ANALYSIS_CONTENT
|
||||
},
|
||||
handleShowNotice(){
|
||||
handleShowNotice() {
|
||||
this.showNotice = true
|
||||
},
|
||||
handleNoShowNotice(){
|
||||
handleNoShowNotice() {
|
||||
this.showNotice = false
|
||||
},
|
||||
handleShowNoticeYear(){
|
||||
handleShowNoticeYear() {
|
||||
this.showNoticeYear = true
|
||||
},
|
||||
handleNoShowNoticeYear(){
|
||||
handleNoShowNoticeYear() {
|
||||
this.showNoticeYear = false
|
||||
},
|
||||
async getDateList(){
|
||||
if (this.type==='year'){
|
||||
async getDateList() {
|
||||
if (this.type === 'year') {
|
||||
let req = {
|
||||
StatisticsDate:this.date,
|
||||
ProvinceCode:'340000',
|
||||
StatisticsType:1
|
||||
StatisticsDate: this.date,
|
||||
ProvinceCode: '340000',
|
||||
StatisticsType: 1
|
||||
}
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget',req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item=>{
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item => {
|
||||
let num = item.Serverpart_Name.indexOf('片区')
|
||||
if (num!==-1){
|
||||
item.name = item.Serverpart_Name.slice(0,num)
|
||||
item.unit = item.Serverpart_Name.slice(num,100)
|
||||
}else{
|
||||
if (num !== -1) {
|
||||
item.name = item.Serverpart_Name.slice(0, num)
|
||||
item.unit = item.Serverpart_Name.slice(num, 100)
|
||||
} else {
|
||||
item.name = item.Serverpart_Name
|
||||
}
|
||||
item.Revenue_Amount = this.$util.fmoney(item.Revenue_Amount)
|
||||
@ -358,21 +372,21 @@ export default {
|
||||
this.info.Budget_Amount = this.$util.fmoney(this.info.Budget_Amount)
|
||||
this.info.Revenue_Amount = this.$util.fmoney(this.info.Revenue_Amount)
|
||||
this.dataList = data.Result_Data.RegionBudgetList
|
||||
}else{
|
||||
} else {
|
||||
let time = uni.getStorageSync('lastDay')
|
||||
let req = {
|
||||
StatisticsDate:time,
|
||||
ProvinceCode:'340000',
|
||||
StatisticsType:4,
|
||||
SPRegionTypeID:this.id
|
||||
StatisticsDate: time,
|
||||
ProvinceCode: '340000',
|
||||
StatisticsType: 4,
|
||||
SPRegionTypeID: this.id
|
||||
}
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget',req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item=>{
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||||
data.Result_Data.RegionBudgetList.forEach(item => {
|
||||
let num = item.Serverpart_Name.indexOf('服务区')
|
||||
if (num!==-1){
|
||||
item.name = item.Serverpart_Name.slice(0,num)
|
||||
item.unit = item.Serverpart_Name.slice(num,100)
|
||||
}else{
|
||||
if (num !== -1) {
|
||||
item.name = item.Serverpart_Name.slice(0, num)
|
||||
item.unit = item.Serverpart_Name.slice(num, 100)
|
||||
} else {
|
||||
item.name = item.Serverpart_Name
|
||||
}
|
||||
item.Revenue_Amount = this.$util.fmoney(item.Revenue_Amount)
|
||||
@ -389,21 +403,25 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.main{
|
||||
.main {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 0 16px;
|
||||
.listBox{
|
||||
|
||||
.listBox {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: calc(8px + env(safe-area-inset-bottom)) ;
|
||||
.thisMonth{
|
||||
padding-bottom: calc(8px + env(safe-area-inset-bottom));
|
||||
|
||||
.thisMonth {
|
||||
margin-bottom: 12px;
|
||||
.titleTop{
|
||||
|
||||
.titleTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
@ -411,34 +429,40 @@ export default {
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.question{
|
||||
|
||||
.question {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.titleTopNotice{
|
||||
|
||||
.titleTopNotice {
|
||||
position: absolute;
|
||||
padding: 12px;
|
||||
left:35%;
|
||||
left: 35%;
|
||||
top: 0;
|
||||
width: 50vw;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 10px 10px 0 rgba(22,0,2,0.1);
|
||||
box-shadow: 0 10px 10px 0 rgba(22, 0, 2, 0.1);
|
||||
z-index: 9999;
|
||||
}
|
||||
.meng{
|
||||
|
||||
.meng {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;left: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
padding: 12px 16px;
|
||||
@ -446,9 +470,11 @@ export default {
|
||||
border-radius: 8px;
|
||||
background: #f5f2f2;
|
||||
margin-top: 12px;
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
.big {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
@ -459,21 +485,26 @@ export default {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 8px;
|
||||
|
||||
.icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
width: calc(100% - 60px);
|
||||
padding: 2px 0;
|
||||
.textTop{
|
||||
|
||||
.textTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.number {
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
@ -481,25 +512,29 @@ export default {
|
||||
color: #150002;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.desc{
|
||||
|
||||
.desc {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 8px;
|
||||
font-size: 14px;
|
||||
color: #FF7043;
|
||||
.success{
|
||||
|
||||
.success {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.comparePlan{
|
||||
|
||||
.comparePlan {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -507,10 +542,12 @@ export default {
|
||||
line-height: 36rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.box2{
|
||||
|
||||
.box2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
color: #150002;
|
||||
@ -518,6 +555,7 @@ export default {
|
||||
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.addIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
@ -527,7 +565,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.progressPlan{
|
||||
.progressPlan {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border-radius: 5px;
|
||||
@ -535,22 +573,27 @@ export default {
|
||||
margin-top: 8px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.trans{
|
||||
|
||||
.trans {
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 0;top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||||
}
|
||||
.transYear{
|
||||
|
||||
.transYear {
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 0;top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||||
}
|
||||
|
||||
//.img{
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
@ -570,10 +613,12 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
padding-left: 48px;
|
||||
|
||||
.success {
|
||||
.text {
|
||||
font-size: 28rpx;
|
||||
@ -582,6 +627,7 @@ export default {
|
||||
color: #786b6c;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 2px;
|
||||
|
||||
.unit {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
@ -591,6 +637,7 @@ export default {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.money {
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
@ -602,37 +649,44 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.list{
|
||||
|
||||
.list {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 12px;
|
||||
background: #F5F5F5;
|
||||
margin-bottom: 12px;
|
||||
border-radius: 8px;
|
||||
.top{
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.title{
|
||||
|
||||
.title {
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #a69e9f;
|
||||
line-height: 18px;
|
||||
.name{
|
||||
|
||||
.name {
|
||||
color: #150002;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.value{
|
||||
|
||||
.value {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
@ -641,10 +695,12 @@ export default {
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.comparePlan{
|
||||
|
||||
.comparePlan {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -652,10 +708,12 @@ export default {
|
||||
line-height: 36rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.box2{
|
||||
|
||||
.box2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
color: #150002;
|
||||
@ -663,6 +721,7 @@ export default {
|
||||
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.addIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
@ -672,7 +731,8 @@ export default {
|
||||
}
|
||||
|
||||
}
|
||||
.progress{
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
background: #fff;
|
||||
@ -680,29 +740,35 @@ export default {
|
||||
margin: 8px 0 16px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.have{
|
||||
|
||||
.have {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
top: 0;left: 0;
|
||||
background:#FF8E5B
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: #FF8E5B
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 16px;
|
||||
|
||||
.success {
|
||||
width: calc(50% - 4px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #a69e9f;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.money {
|
||||
margin-left: 8px;
|
||||
font-size: 14px;
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="thisMonth" v-if="type==='month'">
|
||||
<div class="thisMonth" v-if="type === 'month'">
|
||||
<div class="titleTop">
|
||||
<p class="title">本月自营计划</p>
|
||||
<div class="question" @click="handleShowNotice">
|
||||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||||
<image src="https://eshangtech.com/ShopICO/ahyd-BID/index/noticeQuestion.svg"></image>
|
||||
</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{monthNoticeText}}</div>
|
||||
<div v-if="showNotice" class="titleTopNotice">{{ monthNoticeText }}</div>
|
||||
<div v-if="showNotice" class="meng" @click="handleNoShowNotice"></div>
|
||||
</div>
|
||||
<view class="box">
|
||||
@ -17,41 +17,45 @@
|
||||
<view class="text">
|
||||
<view class="textTop">
|
||||
<view class="left">
|
||||
<p class="number">{{info.Budget_Degree?info.Budget_Degree + '%':'-'}}</p>
|
||||
<p v-if="info.Budget_Degree>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image></p>
|
||||
<p class="number">{{ info.Budget_Degree ? info.Budget_Degree + '%' : '-' }}</p>
|
||||
<p v-if="info.Budget_Degree >= 100" class="desc">
|
||||
<image class="success" src="/static/images/index/successMonth.svg"></image>
|
||||
</p>
|
||||
</view>
|
||||
<view class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<view class="box2">
|
||||
<image class="addIcon" :src="Number(info.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{info.Growth_Rate ?Math.abs(info.Growth_Rate) + '%':'-'}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(info.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ info.Growth_Rate ? Math.abs(info.Growth_Rate) + '%' : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="progressPlan">
|
||||
<div class="trans" :style="{width:info.Budget_Degree + '%'}"></div>
|
||||
<div class="trans" :style="{ width: info.Budget_Degree + '%' }"></div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="success" style="margin-right: 39px">
|
||||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Revenue_Amount ?info.Revenue_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Revenue_Amount ? info.Revenue_Amount : '-' }}</p>
|
||||
</view>
|
||||
<view class="success">
|
||||
<p class="text">本月计划<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Budget_Amount ?info.Budget_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Budget_Amount ? info.Budget_Amount : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="thisYear" style="margin-top: 0px" v-if="type==='year'">
|
||||
<div class="thisYear" style="margin-top: 0px" v-if="type === 'year'">
|
||||
<div class="titleTop">
|
||||
<p class="title">年度自营计划</p>
|
||||
<div class="question" @click="handleShowNoticeYear">
|
||||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||||
<image src="https://eshangtech.com/ShopICO/ahyd-BID/index/noticeQuestion.svg"></image>
|
||||
</div>
|
||||
<div v-if="showNoticeYear" class="titleTopNotice">{{yearNoticeText}}</div>
|
||||
<div v-if="showNoticeYear" class="titleTopNotice">{{ yearNoticeText }}</div>
|
||||
<div v-if="showNoticeYear" class="meng" @click="handleNoShowNoticeYear"></div>
|
||||
</div>
|
||||
<view class="box">
|
||||
@ -62,19 +66,24 @@
|
||||
<view class="text">
|
||||
<view class="textTop">
|
||||
<view class="left">
|
||||
<p class="number">{{info.Budget_Degree?info.Budget_Degree + '%':'-'}}</p>
|
||||
<p v-if="info.Budget_Degree>=100" class="desc" style="color: #4E68FF"><image class="success" src="/static/images/index/yearSuccess.svg"></image></p>
|
||||
<p class="number">{{ info.Budget_Degree ? info.Budget_Degree + '%' : '-' }}</p>
|
||||
<p v-if="info.Budget_Degree >= 100" class="desc" style="color: #4E68FF">
|
||||
<image class="success"
|
||||
src="https://eshangtech.com/ShopICO/ahyd-BID/index/yearSuccess.svg"></image>
|
||||
</p>
|
||||
</view>
|
||||
<view class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<div class="box2">
|
||||
<image class="addIcon" :src="Number(info.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{info.Growth_Rate?Math.abs(info.Growth_Rate) + '%':''}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(info.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ info.Growth_Rate ? Math.abs(info.Growth_Rate) + '%' : '' }}</p>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<div class="progressPlan">
|
||||
<div class="transYear" :style="{width:info.Budget_Degree + '%'}"></div>
|
||||
<div class="transYear" :style="{ width: info.Budget_Degree + '%' }"></div>
|
||||
<!-- <image class="img" :style="{width: plan.percentageYear + '%'}" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png"></image>-->
|
||||
<!-- <div class=pro :style="{width:(100 - plan.percentageYear)+ '%'}"></div>-->
|
||||
</div>
|
||||
@ -83,43 +92,50 @@
|
||||
<view class="bottom">
|
||||
<view class="success" style="margin-right: 39px">
|
||||
<p class="text">年度已完成<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Revenue_Amount ?info.Revenue_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Revenue_Amount ? info.Revenue_Amount : '-' }}</p>
|
||||
</view>
|
||||
<view class="success">
|
||||
<p class="text">年度计划<text class="unit">/元</text></p>
|
||||
<p class="money">{{info.Budget_Amount ?info.Budget_Amount :'-'}}</p>
|
||||
<p class="money">{{ info.Budget_Amount ? info.Budget_Amount : '-' }}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
|
||||
<div class="listBox">
|
||||
<div class="list" v-for="(item,index) in dataList" :key="index" @click="handleGoDetail(item)">
|
||||
<div class="list" v-for="(item, index) in dataList" :key="index" @click="handleGoDetail(item)">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<p class="title" v-if="type==='month'"><text class="name">{{item.name}}</text>{{item.unit}}</p>
|
||||
<p class="title" v-if="type==='year'"><text class="name">{{item.Statistics_Month}}</text>月</p>
|
||||
<div class="value" :style="{color:type==='year'?'#4962FF':''}">{{item.Budget_Degree}}%</div>
|
||||
<p class="title" v-if="type === 'month'"><text class="name">{{ item.name }}</text>{{ item.unit
|
||||
}}</p>
|
||||
<p class="title" v-if="type === 'year'"><text class="name">{{ item.Statistics_Month }}</text>月
|
||||
</p>
|
||||
<div class="value" :style="{ color: type === 'year' ? '#4962FF' : '' }">{{ item.Budget_Degree
|
||||
}}%</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<text class="comparePlan">比计划: </text>
|
||||
<div class="box2">
|
||||
<image class="addIcon" :src="Number(item.Growth_Rate)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||||
<p class="text">{{item.Growth_Rate?Math.abs(item.Growth_Rate) + '%':''}}</p>
|
||||
<image class="addIcon"
|
||||
:src="Number(item.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||||
</image>
|
||||
<p class="text">{{ item.Growth_Rate ? Math.abs(item.Growth_Rate) + '%' : '' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="have" :style="{width:item.Budget_Degree + '%',background: type==='month'?'#FF8E5B':'#778CFD'}"></div>
|
||||
<div class="have"
|
||||
:style="{ width: item.Budget_Degree + '%', background: type === 'month' ? '#FF8E5B' : '#778CFD' }">
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="success">
|
||||
<text class="text">已完成:</text>
|
||||
<text class="money">{{item.Revenue_Amount}}</text>
|
||||
<text class="money">{{ item.Revenue_Amount }}</text>
|
||||
</div>
|
||||
<div class="success">
|
||||
<text class="text">计划: </text>
|
||||
<text class="money">{{item.Budget_Amount }}</text>
|
||||
<text class="money">{{ item.Budget_Amount }}</text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -131,37 +147,37 @@
|
||||
import request from '@/util/index.js'
|
||||
export default {
|
||||
name: "planMonth",
|
||||
data(){
|
||||
data() {
|
||||
return {
|
||||
plan:{},
|
||||
monthAdd:'',
|
||||
yearAdd:'',
|
||||
lastDay:'',
|
||||
type:'month',
|
||||
showNotice:false,
|
||||
showNoticeYear:false,
|
||||
dataList:[],
|
||||
info:{
|
||||
Budget_Degree:0,
|
||||
Growth_Rate:0,
|
||||
Budget_Amount:'',
|
||||
Revenue_Amount:''
|
||||
plan: {},
|
||||
monthAdd: '',
|
||||
yearAdd: '',
|
||||
lastDay: '',
|
||||
type: 'month',
|
||||
showNotice: false,
|
||||
showNoticeYear: false,
|
||||
dataList: [],
|
||||
info: {
|
||||
Budget_Degree: 0,
|
||||
Growth_Rate: 0,
|
||||
Budget_Amount: '',
|
||||
Revenue_Amount: ''
|
||||
},
|
||||
monthNoticeText:'',
|
||||
yearNoticeText:''
|
||||
monthNoticeText: '',
|
||||
yearNoticeText: ''
|
||||
}
|
||||
},
|
||||
|
||||
onLoad(option){
|
||||
onLoad(option) {
|
||||
// 拿到点进来的时间
|
||||
this.lastDay = option.lastDay
|
||||
// 判断是从年份还是月份点进
|
||||
this.type = option.type
|
||||
if (this.type==='month'){
|
||||
if (this.type === 'month') {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '本月自营计划',
|
||||
})
|
||||
}else if(this.type==='year'){
|
||||
} else if (this.type === 'year') {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '年度自营计划',
|
||||
})
|
||||
@ -178,74 +194,74 @@ export default {
|
||||
onUnload() {
|
||||
this.$util.addUserBehavior()
|
||||
},
|
||||
methods:{
|
||||
async handleNoticeMonth(){
|
||||
methods: {
|
||||
async handleNoticeMonth() {
|
||||
let date = new Date(this.lastDay)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
if(m<10){
|
||||
m = '0'+m
|
||||
if (m < 10) {
|
||||
m = '0' + m
|
||||
}
|
||||
//本月的
|
||||
let req = {
|
||||
SearchParameter:{
|
||||
STATISTICS_DATE:`${y}-${m}`,
|
||||
ANALYSISINS_TYPE:'1011',
|
||||
ANALYSISINS_FORMAT:'3000'
|
||||
SearchParameter: {
|
||||
STATISTICS_DATE: `${y}-${m}`,
|
||||
ANALYSISINS_TYPE: '1011',
|
||||
ANALYSISINS_FORMAT: '3000'
|
||||
},
|
||||
PageIndex:1,
|
||||
PageSize:10
|
||||
PageIndex: 1,
|
||||
PageSize: 10
|
||||
}
|
||||
const data = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList',req)
|
||||
const data = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList', req)
|
||||
this.monthNoticeText = data.Result_Data.List[0].ANALYSIS_CONTENT
|
||||
},
|
||||
async handleNoticeYear(){
|
||||
async handleNoticeYear() {
|
||||
let date = new Date(this.lastDay)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
if(m<10){
|
||||
m = '0'+m
|
||||
if (m < 10) {
|
||||
m = '0' + m
|
||||
}
|
||||
//本年
|
||||
let reqYear = {
|
||||
SearchParameter:{
|
||||
STATISTICS_DATE:`${y}`,
|
||||
ANALYSISINS_TYPE:'1012',
|
||||
ANALYSISINS_FORMAT:'3000'
|
||||
SearchParameter: {
|
||||
STATISTICS_DATE: `${y}`,
|
||||
ANALYSISINS_TYPE: '1012',
|
||||
ANALYSISINS_FORMAT: '3000'
|
||||
},
|
||||
PageIndex:1,
|
||||
PageSize:10
|
||||
PageIndex: 1,
|
||||
PageSize: 10
|
||||
}
|
||||
const totalData = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList',reqYear)
|
||||
const totalData = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList', reqYear)
|
||||
this.yearNoticeText = totalData.Result_Data.List[0].ANALYSIS_CONTENT
|
||||
},
|
||||
//跳转到详情页
|
||||
handleGoDetail(item){
|
||||
if (this.type==='year'){
|
||||
handleGoDetail(item) {
|
||||
if (this.type === 'year') {
|
||||
uni.navigateTo({
|
||||
url:`/pages/commercialBI/planDetail?type=${this.type}&month=${item.Statistics_Month}`
|
||||
url: `/pages/commercialBI/planDetail?type=${this.type}&month=${item.Statistics_Month}`
|
||||
})
|
||||
}else{
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url:`/pages/commercialBI/planDetail?type=${this.type}&item=${JSON.stringify(item)}&id=${item.Serverpart_ID}`
|
||||
url: `/pages/commercialBI/planDetail?type=${this.type}&item=${JSON.stringify(item)}&id=${item.Serverpart_ID}`
|
||||
})
|
||||
}
|
||||
},
|
||||
async getPlanListData(type){
|
||||
async getPlanListData(type) {
|
||||
let req = {
|
||||
StatisticsDate:this.lastDay,
|
||||
ProvinceCode:'340000',
|
||||
StatisticsType:type==='month'?1:type==='year'?2:''
|
||||
StatisticsDate: this.lastDay,
|
||||
ProvinceCode: '340000',
|
||||
StatisticsType: type === 'month' ? 1 : type === 'year' ? 2 : ''
|
||||
}
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget',req)
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||||
uni.hideLoading()
|
||||
data.Result_Data.RegionBudgetList.forEach(item=>{
|
||||
if (type==='month'){
|
||||
data.Result_Data.RegionBudgetList.forEach(item => {
|
||||
if (type === 'month') {
|
||||
let num = item.Serverpart_Name.indexOf('片区')
|
||||
if (num!==-1){
|
||||
item.name = item.Serverpart_Name.slice(0,num)
|
||||
item.unit = item.Serverpart_Name.slice(num,100)
|
||||
}else{
|
||||
if (num !== -1) {
|
||||
item.name = item.Serverpart_Name.slice(0, num)
|
||||
item.unit = item.Serverpart_Name.slice(num, 100)
|
||||
} else {
|
||||
item.name = item.Serverpart_Name
|
||||
}
|
||||
}
|
||||
@ -257,16 +273,16 @@ export default {
|
||||
this.info.Revenue_Amount = this.$util.fmoney(this.info.Revenue_Amount)
|
||||
this.dataList = data.Result_Data.RegionBudgetList
|
||||
},
|
||||
handleShowNotice(){
|
||||
handleShowNotice() {
|
||||
this.showNotice = true
|
||||
},
|
||||
handleNoShowNotice(){
|
||||
handleNoShowNotice() {
|
||||
this.showNotice = false
|
||||
},
|
||||
handleShowNoticeYear(){
|
||||
handleShowNoticeYear() {
|
||||
this.showNoticeYear = true
|
||||
},
|
||||
handleNoShowNoticeYear(){
|
||||
handleNoShowNoticeYear() {
|
||||
this.showNoticeYear = false
|
||||
},
|
||||
}
|
||||
@ -274,18 +290,22 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.main{
|
||||
.main {
|
||||
padding: 0 16px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
.thisMonth,.thisYear{
|
||||
|
||||
.thisMonth,
|
||||
.thisYear {
|
||||
width: 100%;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 12px;
|
||||
.titleTop{
|
||||
|
||||
.titleTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
@ -293,34 +313,40 @@ export default {
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.question{
|
||||
|
||||
.question {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.titleTopNotice{
|
||||
|
||||
.titleTopNotice {
|
||||
position: absolute;
|
||||
padding: 12px;
|
||||
left:35%;
|
||||
left: 35%;
|
||||
top: 0;
|
||||
width: 50vw;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 10px 10px 0 rgba(22,0,2,0.1);
|
||||
box-shadow: 0 10px 10px 0 rgba(22, 0, 2, 0.1);
|
||||
z-index: 9999;
|
||||
}
|
||||
.meng{
|
||||
|
||||
.meng {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;left: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
padding: 12px 16px;
|
||||
@ -328,9 +354,11 @@ export default {
|
||||
border-radius: 8px;
|
||||
background: #f5f2f2;
|
||||
margin-top: 12px;
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
.big {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
@ -341,21 +369,26 @@ export default {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 8px;
|
||||
|
||||
.icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
width: calc(100% - 60px);
|
||||
padding: 2px 0;
|
||||
.textTop{
|
||||
|
||||
.textTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.number {
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
@ -363,25 +396,29 @@ export default {
|
||||
color: #150002;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.desc{
|
||||
|
||||
.desc {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 8px;
|
||||
font-size: 14px;
|
||||
color: #FF7043;
|
||||
.success{
|
||||
|
||||
.success {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.comparePlan{
|
||||
|
||||
.comparePlan {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -389,10 +426,12 @@ export default {
|
||||
line-height: 36rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.box2{
|
||||
|
||||
.box2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
color: #150002;
|
||||
@ -400,6 +439,7 @@ export default {
|
||||
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.addIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
@ -409,7 +449,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.progressPlan{
|
||||
.progressPlan {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border-radius: 5px;
|
||||
@ -417,22 +457,27 @@ export default {
|
||||
margin-top: 8px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.trans{
|
||||
|
||||
.trans {
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 0;top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||||
}
|
||||
.transYear{
|
||||
|
||||
.transYear {
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 0;top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||||
}
|
||||
|
||||
//.img{
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
@ -452,10 +497,12 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
padding-left: 48px;
|
||||
|
||||
.success {
|
||||
.text {
|
||||
font-size: 28rpx;
|
||||
@ -464,6 +511,7 @@ export default {
|
||||
color: #786b6c;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 2px;
|
||||
|
||||
.unit {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
@ -473,6 +521,7 @@ export default {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.money {
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
@ -484,35 +533,42 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.listBox{
|
||||
|
||||
.listBox {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: calc(8px + env(safe-area-inset-bottom)) ;
|
||||
.list{
|
||||
padding-bottom: calc(8px + env(safe-area-inset-bottom));
|
||||
|
||||
.list {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 12px;
|
||||
background: #F5F5F5;
|
||||
margin-bottom: 12px;
|
||||
.top{
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.title{
|
||||
|
||||
.title {
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #a69e9f;
|
||||
line-height: 18px;
|
||||
.name{
|
||||
|
||||
.name {
|
||||
color: #150002;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.value{
|
||||
|
||||
.value {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
@ -521,10 +577,12 @@ export default {
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.comparePlan{
|
||||
|
||||
.comparePlan {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -532,10 +590,12 @@ export default {
|
||||
line-height: 36rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.box2{
|
||||
|
||||
.box2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
color: #150002;
|
||||
@ -543,6 +603,7 @@ export default {
|
||||
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.addIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
@ -552,7 +613,8 @@ export default {
|
||||
}
|
||||
|
||||
}
|
||||
.progress{
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
background: #fff;
|
||||
@ -560,29 +622,35 @@ export default {
|
||||
margin: 8px 0 16px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.have{
|
||||
|
||||
.have {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
top: 0;left: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
margin-top: 16px;
|
||||
|
||||
.success {
|
||||
width: calc(50% - 4px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #a69e9f;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.money {
|
||||
margin-left: 8px;
|
||||
font-size: 14px;
|
||||
|
||||
@ -2,45 +2,52 @@
|
||||
<view class="main">
|
||||
<view class="heard">
|
||||
<image class="headerBg" src="https://eshangtech.com/ShopICO/ahyd-BID/plan/blueBack.png"></image>
|
||||
<view class="top" :style="{height:(menu.bottom + 6)+'px'}">
|
||||
<image :style="{top:(menu.top + ((menu.height - 24)/2))+'px'}" @click="handleBack" class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"></image>
|
||||
<view class="top" :style="{ height: (menu.bottom + 6) + 'px' }">
|
||||
<image :style="{ top: (menu.top + ((menu.height - 24) / 2)) + 'px' }" @click="handleBack" class="img"
|
||||
src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"></image>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="block"></view>
|
||||
<p class="title">年度经营计划</p>
|
||||
<!-- 选择月份 -->
|
||||
<view class="monthTabs">
|
||||
<scroll-view class="big" :show-scrollbar="false" scroll-with-animation scroll-x="true" enable-flex :scrollIntoView="selectMonthId" >
|
||||
<div :id="'item'+item.value" :class="selectMonth===item.value?'monthItem selectItem':'monthItem'" v-for="(item,index) in monthList" :key="index" @click="handleSelectMonth(item.value)">{{item.label}}</div>
|
||||
<scroll-view class="big" :show-scrollbar="false" scroll-with-animation scroll-x="true" enable-flex
|
||||
:scrollIntoView="selectMonthId">
|
||||
<div :id="'item' + item.value" :class="selectMonth === item.value ? 'monthItem selectItem' : 'monthItem'"
|
||||
v-for="(item, index) in monthList" :key="index" @click="handleSelectMonth(item.value)">{{ item.label }}
|
||||
</div>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="monthDetailList">
|
||||
<swiper class="swiper" previous-margin="40rpx" next-margin="40rpx" @change="handleDetailScroll" :current="selectDetail">
|
||||
<block v-for="(item,index) in swiperList" :key="index">
|
||||
<swiper class="swiper" previous-margin="40rpx" next-margin="40rpx" @change="handleDetailScroll"
|
||||
:current="selectDetail">
|
||||
<block v-for="(item, index) in swiperList" :key="index">
|
||||
<swiper-item class="swiper-item" :item-id="index" :data-item-id="index" bindtap='clickChange'>
|
||||
<view class="box">
|
||||
<view :class="selectDetail===index?'detail':'detail noShow'">
|
||||
<view class="item" v-if="selectDetail===index">
|
||||
<view :class="selectDetail === index ? 'detail' : 'detail noShow'">
|
||||
<view class="item" v-if="selectDetail === index">
|
||||
<view class="itemTop">
|
||||
<view class="left">
|
||||
<image class="logo" src="https://eshangtech.com/ShopICO/ahyd-BID/plan/monthLogo.svg"></image>
|
||||
<view class="detailContent">
|
||||
<view class="top">
|
||||
<span class="money">{{detail.Revenue_Amount || '-'}}</span>
|
||||
<image v-if="detail.Budget_Degree>100" class="icon" src="/static/images/index/yearSuccess.svg"></image>
|
||||
<span class="money">{{ detail.Revenue_Amount || '-' }}</span>
|
||||
<image v-if="detail.Budget_Degree > 100" class="icon"
|
||||
src="https://eshangtech.com/ShopICO/ahyd-BID/index/yearSuccess.svg"></image>
|
||||
</view>
|
||||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<p class="add" :style="{color:detail.Growth_Rate>0?'#E83944':'#049E77'}">{{detail.Growth_Rate>0?'+':'-'}}{{detail.Growth_Rate || '-'}}%</p>
|
||||
<p class="add" :style="{ color: detail.Growth_Rate > 0 ? '#E83944' : '#049E77' }">
|
||||
{{ detail.Growth_Rate > 0 ? '+' : '-' }}{{ detail.Growth_Rate || '-' }}%</p>
|
||||
<text class="compare">比计划</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="itemBottom" :style="{marginTop: selectDetail===index?'24px':'4px'}">
|
||||
<view class="itemBottom" :style="{ marginTop: selectDetail === index ? '24px' : '4px' }">
|
||||
<view class="progress">
|
||||
<view class="have" :style="{width: detail.Budget_Degree + '%'}"></view>
|
||||
<view class="have" :style="{ width: detail.Budget_Degree + '%' }"></view>
|
||||
</view>
|
||||
<view class="text">
|
||||
<span class="success">计划完成<span class="unit">/元</span></span>
|
||||
@ -48,26 +55,28 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item" v-if="selectDetail!==index">
|
||||
<view class="item" v-if="selectDetail !== index">
|
||||
<view class="itemTop">
|
||||
<view class="left">
|
||||
<image class="logo" src="https://eshangtech.com/ShopICO/ahyd-BID/plan/monthLogo.svg"></image>
|
||||
<view class="detailContent">
|
||||
<view class="top">
|
||||
<span class="money">{{'-'}}</span>
|
||||
<image v-if="detail.Budget_Degree>100" class="icon" src="/static/images/index/yearSuccess.svg"></image>
|
||||
<span class="money">{{ '-' }}</span>
|
||||
<image v-if="detail.Budget_Degree > 100" class="icon"
|
||||
src="https://eshangtech.com/ShopICO/ahyd-BID/index/yearSuccess.svg"></image>
|
||||
</view>
|
||||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<p class="add" :style="{color:detail.Growth_Rate>0?'#E83944':'#049E77'}">{{detail.Growth_Rate>0?'+':'-'}}{{ '-'}}%</p>
|
||||
<p class="add" :style="{ color: detail.Growth_Rate > 0 ? '#E83944' : '#049E77' }">
|
||||
{{ detail.Growth_Rate > 0 ? '+' : '-' }}{{ '-' }}%</p>
|
||||
<text class="compare">比计划</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="itemBottom" :style="{marginTop: selectDetail===index?'24px':'4px'}">
|
||||
<view class="itemBottom" :style="{ marginTop: selectDetail === index ? '24px' : '4px' }">
|
||||
<view class="progress">
|
||||
<view class="have" :style="{width: detail.Budget_Degree + '%'}"></view>
|
||||
<view class="have" :style="{ width: detail.Budget_Degree + '%' }"></view>
|
||||
</view>
|
||||
<view class="text">
|
||||
<span class="success">计划完成<span class="unit">/元</span></span>
|
||||
@ -86,34 +95,38 @@
|
||||
</view>
|
||||
<view class="serviceList">
|
||||
<scroll-view class="list" scroll-y="true">
|
||||
<view class="item" v-for="(item,index) in detail.RegionBudgetList" :key="index" @click="goPage(item.Serverpart_ID)">
|
||||
<view class="item" v-for="(item, index) in detail.RegionBudgetList" :key="index"
|
||||
@click="goPage(item.Serverpart_ID)">
|
||||
<view class="top">
|
||||
<p class="title">{{ item.Serverpart_Name || ''}}</p>
|
||||
<p class="title">{{ item.Serverpart_Name || '' }}</p>
|
||||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/plan/blueArrow.svg"></image>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<view class="left">
|
||||
<view class="money">
|
||||
<span class="num">{{ item.Revenue_Amount }}</span>
|
||||
<image v-if="item.Budget_Degree>100" class="icon" src="/static/images/index/yearSuccess.svg"></image>
|
||||
<image v-if="item.Budget_Degree > 100" class="icon"
|
||||
src="https://eshangtech.com/ShopICO/ahyd-BID/index/yearSuccess.svg"></image>
|
||||
</view>
|
||||
<view class="text">本月已完成<span class="unit">/元</span></view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<p class="add" :style="{color:item.Growth_Rate>0?'#E83944':'#049E77'}"><span>{{item.Growth_Rate>0?'+':''}}</span>{{item.Growth_Rate || '-'}}%</p>
|
||||
<p class="add" :style="{ color: item.Growth_Rate > 0 ? '#E83944' : '#049E77' }">
|
||||
<span>{{ item.Growth_Rate > 0 ? '+' : '' }}</span>{{ item.Growth_Rate || '-' }}%
|
||||
</p>
|
||||
<p class="text">比计划</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="progress">
|
||||
<view class="box">
|
||||
<view class="have" :style="{width:item.Budget_Degree + '%'}"></view>
|
||||
<view class="have" :style="{ width: item.Budget_Degree + '%' }"></view>
|
||||
</view>
|
||||
<view class="other">
|
||||
<view>
|
||||
<span class="unit">计划完成</span>
|
||||
<span class="type">/元</span>
|
||||
</view>
|
||||
<view class="money">{{item.Budget_Amount || ''}}</view>
|
||||
<view class="money">{{ item.Budget_Amount || '' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -124,22 +137,22 @@
|
||||
|
||||
<script>
|
||||
import request from '@/util/index.js'
|
||||
export default{
|
||||
export default {
|
||||
name: "yearPlan",
|
||||
data(){
|
||||
data() {
|
||||
return {
|
||||
monthList:[{label:'1月',value:1},{label:'2月',value:2},{label:'3月',value:3},{label:'4月',value:4},{label:'5月',value:5},{label:'6月',value:6},{label:'7月',value:7}, {label:'8月',value:8},{label:'9月',value:9},{label:'10月',value:10},{label:'11月',value:11},{label:'12月',value:12}],
|
||||
selectMonth:0,// 选中的月份
|
||||
selectMonthId:'',// 选中月份的id
|
||||
swiperList:[{label:1111},{label:2222},{label:3333},{label:4444},{label:5555},{label:6666},{label:7777},{label:8888},{label:9999},{label:1010}, {label:11111111},{label:1212}],
|
||||
selectDetail:0,// 选中的月份详情卡片
|
||||
serviceList:[{},{},{},{},{},{}],
|
||||
menu:{},
|
||||
detail:{},// 页面请求到的数据
|
||||
searchTime:'',
|
||||
monthList: [{ label: '1月', value: 1 }, { label: '2月', value: 2 }, { label: '3月', value: 3 }, { label: '4月', value: 4 }, { label: '5月', value: 5 }, { label: '6月', value: 6 }, { label: '7月', value: 7 }, { label: '8月', value: 8 }, { label: '9月', value: 9 }, { label: '10月', value: 10 }, { label: '11月', value: 11 }, { label: '12月', value: 12 }],
|
||||
selectMonth: 0,// 选中的月份
|
||||
selectMonthId: '',// 选中月份的id
|
||||
swiperList: [{ label: 1111 }, { label: 2222 }, { label: 3333 }, { label: 4444 }, { label: 5555 }, { label: 6666 }, { label: 7777 }, { label: 8888 }, { label: 9999 }, { label: 1010 }, { label: 11111111 }, { label: 1212 }],
|
||||
selectDetail: 0,// 选中的月份详情卡片
|
||||
serviceList: [{}, {}, {}, {}, {}, {}],
|
||||
menu: {},
|
||||
detail: {},// 页面请求到的数据
|
||||
searchTime: '',
|
||||
}
|
||||
},
|
||||
onLoad(){
|
||||
onLoad() {
|
||||
// 获取手机参数对页面进行适配
|
||||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||||
// 先拿到首页的时间 作为调用接口的统一时间 存的lastDay存当前月份的具体日期切换回本月的日期判断有用
|
||||
@ -150,21 +163,21 @@ export default{
|
||||
let month = date.getMonth() + 1
|
||||
// 滚动的月份列表
|
||||
// 超过当前月份的内容不显示 下同
|
||||
this.monthList = this.monthList.filter(item=>item.value<=month)
|
||||
this.monthList = this.monthList.filter(item => item.value <= month)
|
||||
// 详情卡片的滑动列表
|
||||
this.swiperList = this.swiperList.filter((item,index)=>index<month)
|
||||
this.swiperList = this.swiperList.filter((item, index) => index < month)
|
||||
// 根据月份显示的详情卡片
|
||||
this.selectDetail = month - 1
|
||||
// // 拿到片区详情完成列表
|
||||
// this.handleAreaDetailList()
|
||||
},
|
||||
onReady(){
|
||||
onReady() {
|
||||
// 默认把月份选择在当前相对应的月份
|
||||
this.getThisMonth()
|
||||
},
|
||||
methods:{
|
||||
methods: {
|
||||
// 横向月份选择器的初始值
|
||||
getThisMonth(){
|
||||
getThisMonth() {
|
||||
// 拿到当前的搜索时间 来判断默认选中第几个月份
|
||||
const date = new Date(this.searchTime)
|
||||
const month = date.getMonth() + 1
|
||||
@ -172,7 +185,7 @@ export default{
|
||||
this.selectMonthId = `item${month}`
|
||||
},
|
||||
// 点击月份切换月份
|
||||
handleSelectMonth(value){
|
||||
handleSelectMonth(value) {
|
||||
// 切换月份的时候 改变月份的值 改变选中的id 显示的卡片详情
|
||||
this.selectMonth = value
|
||||
this.selectMonthId = `item${value}`
|
||||
@ -180,7 +193,7 @@ export default{
|
||||
},
|
||||
// 月份信息详情的滚动
|
||||
// 由于点击月份的切换会让卡片详情的滑块列表滚动 所以在这加事件就可以
|
||||
handleDetailScroll(e){
|
||||
handleDetailScroll(e) {
|
||||
// 月份详情卡片滚动改变选中的月份和选中的滑动id
|
||||
const date = new Date(this.lastDay)
|
||||
let year = date.getFullYear()
|
||||
@ -189,17 +202,17 @@ export default{
|
||||
// 滚动 就等于改变月份 月份详情卡片的id
|
||||
this.selectDetail = e.detail.current
|
||||
this.selectMonth = this.selectDetail + 1
|
||||
this.selectMonthId = `item${this.selectDetail<5?1:this.selectDetail}`
|
||||
this.selectMonthId = `item${this.selectDetail < 5 ? 1 : this.selectDetail}`
|
||||
// 当月份和首页传入的时间的月份一致的话 时间就是首页的时间 反之就是之前月份的最后一天
|
||||
if (month === this.selectMonth){
|
||||
if (month === this.selectMonth) {
|
||||
// 兼容ios 时间月份和日期小于10的必须加上0 不然ios就会报错
|
||||
if (month<10){
|
||||
if (month < 10) {
|
||||
month = '0' + month
|
||||
}
|
||||
this.searchTime = `${year}-${month}-${day}`
|
||||
}else{
|
||||
} else {
|
||||
let m = this.selectMonth
|
||||
if (m<10){
|
||||
if (m < 10) {
|
||||
m = '0' + m
|
||||
}
|
||||
let d = this.$util.getThisMonthDay(`${year}-${m}`)
|
||||
@ -208,24 +221,24 @@ export default{
|
||||
// 用新的时间去请求 得到新的数据
|
||||
this.handleAreaDetailList()
|
||||
},
|
||||
async handleAreaDetailList(){
|
||||
uni.showLoading({title:'正在加载'})
|
||||
async handleAreaDetailList() {
|
||||
uni.showLoading({ title: '正在加载' })
|
||||
// 用全局的时间 改变时间调用接口就可以拿到新数据 不用在接口里面修改时间字段
|
||||
const req = {
|
||||
StatisticsDate: this.searchTime,
|
||||
ProvinceCode:'340000',
|
||||
StatisticsType:1
|
||||
ProvinceCode: '340000',
|
||||
StatisticsType: 1
|
||||
}
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget',req)
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||||
// 对钱进行百分号的格式化
|
||||
for (let key in data.Result_Data){
|
||||
if (key==='Budget_Amount' || key==='Revenue_Amount'){
|
||||
for (let key in data.Result_Data) {
|
||||
if (key === 'Budget_Amount' || key === 'Revenue_Amount') {
|
||||
data.Result_Data[key] = this.$util.fmoney(data.Result_Data[key])
|
||||
}
|
||||
}
|
||||
data.Result_Data.RegionBudgetList.forEach(item=>{
|
||||
for (let key in item){
|
||||
if (key==='Budget_Amount' || key==='Revenue_Amount'){
|
||||
data.Result_Data.RegionBudgetList.forEach(item => {
|
||||
for (let key in item) {
|
||||
if (key === 'Budget_Amount' || key === 'Revenue_Amount') {
|
||||
item[key] = this.$util.fmoney(item[key])
|
||||
}
|
||||
}
|
||||
@ -234,10 +247,10 @@ export default{
|
||||
uni.hideLoading()
|
||||
},
|
||||
// 跳转
|
||||
goPage(id){
|
||||
this.$util.toNextRoute('navigateTo', '/pages/plan/areaPlanMonth?id='+id+'&search='+this.searchTime)
|
||||
goPage(id) {
|
||||
this.$util.toNextRoute('navigateTo', '/pages/plan/areaPlanMonth?id=' + id + '&search=' + this.searchTime)
|
||||
},
|
||||
handleBack(){
|
||||
handleBack() {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
@ -248,16 +261,20 @@ export default{
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '/static/public/font/stylesheet.css';
|
||||
.main{
|
||||
|
||||
.main {
|
||||
width: 100%;
|
||||
.heard{
|
||||
|
||||
.heard {
|
||||
width: 100%;
|
||||
height: 366px;
|
||||
position: relative;
|
||||
.top{
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
.img{
|
||||
|
||||
.img {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
position: absolute;
|
||||
@ -265,30 +282,35 @@ export default{
|
||||
z-index: 3;
|
||||
}
|
||||
}
|
||||
.content{
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
top: 0;left: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
.block{
|
||||
|
||||
.block {
|
||||
width: 100%;
|
||||
height: 83px;
|
||||
}
|
||||
.title{
|
||||
|
||||
.title {
|
||||
font-size: 28px;
|
||||
font-family: "Alimama ShuHeiTi";
|
||||
color: #160002;
|
||||
line-height: 39px;
|
||||
font-weight: 600;
|
||||
text-shadow: 0 4px 8px rgba(2,32,202,0.2);
|
||||
text-shadow: 0 4px 8px rgba(2, 32, 202, 0.2);
|
||||
background: linear-gradient(180deg, #fff 50%, #B0BBFF 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
margin: 14px 24px;
|
||||
}
|
||||
.monthTabs{
|
||||
|
||||
.monthTabs {
|
||||
width: calc(100% - 32px);
|
||||
height: 34px;
|
||||
border-radius: 17px;
|
||||
@ -299,11 +321,13 @@ export default{
|
||||
padding: 2px 0;
|
||||
margin-top: 16px;
|
||||
margin-left: 16px;
|
||||
.big{
|
||||
|
||||
.big {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
white-space: nowrap;
|
||||
.monthItem{
|
||||
|
||||
.monthItem {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
padding: 2px 16px;
|
||||
@ -315,26 +339,32 @@ export default{
|
||||
text-align: center;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.selectItem{
|
||||
|
||||
.selectItem {
|
||||
background: #fff;
|
||||
}
|
||||
.monthItem:first-child{
|
||||
|
||||
.monthItem:first-child {
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.monthDetailList{
|
||||
|
||||
.monthDetailList {
|
||||
width: 100%;
|
||||
height: 140px;
|
||||
margin-top: 12px;
|
||||
.swiper{
|
||||
|
||||
.swiper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.swiper-item{
|
||||
.box{
|
||||
|
||||
.swiper-item {
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.detail{
|
||||
|
||||
.detail {
|
||||
width: calc(100% - 20px);
|
||||
height: 100%;
|
||||
background: linear-gradient(314deg, #D8EAFF 0%, #F3F5FF 32%, #F5FCFF 54%, #F0F7FF 70%, #D3D9FF 100%);
|
||||
@ -342,43 +372,51 @@ export default{
|
||||
border-radius: 8px;
|
||||
box-sizing: border-box;
|
||||
padding: 16px;
|
||||
.item{
|
||||
.itemTop{
|
||||
|
||||
.item {
|
||||
.itemTop {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
.logo{
|
||||
|
||||
.logo {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.detailContent{
|
||||
.top{
|
||||
|
||||
.detailContent {
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 2px;
|
||||
.money{
|
||||
|
||||
.money {
|
||||
font-size: 18px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 24px;
|
||||
}
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 20px;
|
||||
.unit{
|
||||
|
||||
.unit {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -389,15 +427,18 @@ export default{
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
text-align: right;
|
||||
.add{
|
||||
|
||||
.add {
|
||||
font-size: 18px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
line-height: 24px;
|
||||
}
|
||||
.compare{
|
||||
|
||||
.compare {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -406,16 +447,19 @@ export default{
|
||||
}
|
||||
}
|
||||
}
|
||||
.itemBottom{
|
||||
|
||||
.itemBottom {
|
||||
margin-top: 24px;
|
||||
.progress{
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
background: #ccc;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.have{
|
||||
|
||||
.have {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@ -424,19 +468,22 @@ export default{
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
.text{
|
||||
|
||||
.text {
|
||||
margin-top: 4px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.success{
|
||||
|
||||
.success {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 20px;
|
||||
.unit{
|
||||
|
||||
.unit {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -445,7 +492,8 @@ export default{
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
.target{
|
||||
|
||||
.target {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -456,7 +504,8 @@ export default{
|
||||
}
|
||||
}
|
||||
}
|
||||
.noShow{
|
||||
|
||||
.noShow {
|
||||
height: 112px;
|
||||
margin-top: 14px;
|
||||
}
|
||||
@ -466,7 +515,8 @@ export default{
|
||||
}
|
||||
|
||||
}
|
||||
.headerBg{
|
||||
|
||||
.headerBg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -474,7 +524,8 @@ export default{
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.allowLeft{
|
||||
|
||||
.allowLeft {
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
@ -482,7 +533,7 @@ export default{
|
||||
}
|
||||
}
|
||||
|
||||
.serviceList{
|
||||
.serviceList {
|
||||
width: 100%;
|
||||
height: calc(100vh - 366px);
|
||||
transform: translateY(-16px);
|
||||
@ -491,12 +542,19 @@ export default{
|
||||
position: relative;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding:16px 16px 0;
|
||||
.list{
|
||||
padding: 16px 16px 0;
|
||||
|
||||
.list {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
::-webkit-scrollbar {width: 0;height: 0;background-color: transparent;}
|
||||
.item{
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: 100%;
|
||||
height: 178px;
|
||||
background: linear-gradient(314deg, #EDF7FF 0%, #F3F5FF 32%, #F5FCFF 54%, #F0F7FF 70%, #D7DDFF 100%);
|
||||
@ -504,33 +562,39 @@ export default{
|
||||
margin-bottom: 12px;
|
||||
box-sizing: border-box;
|
||||
padding: 16px;
|
||||
.top{
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.title{
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
color: #1A33BC;
|
||||
line-height: 26px;
|
||||
}
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
opacity: 0.8;
|
||||
margin-left: 7px;
|
||||
}
|
||||
}
|
||||
.detail{
|
||||
|
||||
.detail {
|
||||
margin-top: 16px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
.money{
|
||||
|
||||
.left {
|
||||
.money {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 2px;
|
||||
.num{
|
||||
|
||||
.num {
|
||||
font-size: 20px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
@ -538,35 +602,41 @@ export default{
|
||||
line-height: 24px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 20px;
|
||||
.unit{
|
||||
|
||||
.unit {
|
||||
color: #A69E9F;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
.add{
|
||||
|
||||
.add {
|
||||
font-size: 24px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
line-height: 24px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -575,37 +645,44 @@ export default{
|
||||
}
|
||||
}
|
||||
}
|
||||
.progress{
|
||||
|
||||
.progress {
|
||||
margin-top: 16px;
|
||||
.box{
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background: #ccc;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.have{
|
||||
|
||||
.have {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
background: rgba(87, 110, 255, 1);
|
||||
border-radius: 5px;
|
||||
left: 0;top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
.other{
|
||||
|
||||
.other {
|
||||
width: 100%;
|
||||
margin-top: 4px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.unit{
|
||||
|
||||
.unit {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 20px;
|
||||
}
|
||||
.type{
|
||||
|
||||
.type {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
@ -613,7 +690,8 @@ export default{
|
||||
line-height: 20px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.money{
|
||||
|
||||
.money {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="rateMain">
|
||||
<image v-if="preferPath" style="width: 144rpx;height: 144rpx" :src="preferPath"></image>
|
||||
<canvas style="width: 144rpx;height: 144rpx;position:fixed;left: 100%" :canvas-id="name" id="rate"/>
|
||||
<canvas style="width: 144rpx;height: 144rpx;position:fixed;left: 100%" :canvas-id="name" id="rate" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -10,54 +10,58 @@ import uCharts from '@/components/u-charts.js';
|
||||
var uChartsInstance = {};
|
||||
export default {
|
||||
name: "rateCharts",
|
||||
data(){
|
||||
data() {
|
||||
return {
|
||||
preferPath:'',
|
||||
preferPath: '',
|
||||
}
|
||||
},
|
||||
props:{
|
||||
success:{
|
||||
props: {
|
||||
success: {
|
||||
type: Array,
|
||||
default:[]
|
||||
default: []
|
||||
},
|
||||
colorList:{
|
||||
colorList: {
|
||||
type: Array,
|
||||
default:[]
|
||||
default: []
|
||||
},
|
||||
name:{
|
||||
type:String,
|
||||
default:''
|
||||
name: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
success:{
|
||||
handler(value){
|
||||
watch: {
|
||||
success: {
|
||||
handler(value) {
|
||||
// 数据无效时不绘制,等待 API 返回有效数据后再触发
|
||||
if (!value || value.length < 3 || value[0] === undefined || value[1] === undefined || value[2] === undefined) {
|
||||
return;
|
||||
}
|
||||
this.preferPath = ''
|
||||
let sum = value[0] + value[1] + value[2]
|
||||
if (sum===0){
|
||||
if (sum === 0) {
|
||||
let res = {
|
||||
series:[{
|
||||
data:[{name:'便利店',value:0},{name:'餐饮客房',value:0},{name:'商铺租赁',value:0}]
|
||||
series: [{
|
||||
data: [{ name: '便利店', value: 0 }, { name: '餐饮客房', value: 0 }, { name: '商铺租赁', value: 0 }]
|
||||
}]
|
||||
}
|
||||
this.drawCharts(this.name,res)
|
||||
}else{
|
||||
let firstRate = Number(((value[0] / sum)*100).toFixed(2))
|
||||
let secondRate = Number(((value[1] / sum)*100).toFixed(2))
|
||||
let thirdRate = 100 - Number(firstRate)- Number(secondRate)
|
||||
this.drawCharts(this.name, res)
|
||||
} else {
|
||||
let firstRate = Number(((value[0] / sum) * 100).toFixed(2))
|
||||
let secondRate = Number(((value[1] / sum) * 100).toFixed(2))
|
||||
let thirdRate = 100 - Number(firstRate) - Number(secondRate)
|
||||
let res = {
|
||||
series:[{
|
||||
data:[{name:'便利店',value:firstRate},{name:'餐饮客房',value:secondRate},{name:'商铺租赁',value:thirdRate}]
|
||||
series: [{
|
||||
data: [{ name: '便利店', value: firstRate }, { name: '餐饮客房', value: secondRate }, { name: '商铺租赁', value: thirdRate }]
|
||||
}]
|
||||
}
|
||||
this.drawCharts(this.name,res)
|
||||
this.drawCharts(this.name, res)
|
||||
}
|
||||
},
|
||||
immediate:true
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
drawCharts(id,data){
|
||||
methods: {
|
||||
drawCharts(id, data) {
|
||||
const ctx = uni.createCanvasContext(id, this);
|
||||
let _this = this
|
||||
uChartsInstance[id] = new uCharts({
|
||||
@ -71,7 +75,7 @@ export default {
|
||||
rotateLock: false,
|
||||
background: "#FFFFFF",
|
||||
color: _this.colorList,
|
||||
padding: [5,5,5,5],
|
||||
padding: [5, 5, 5, 5],
|
||||
dataLabel: false,
|
||||
enableScroll: false,
|
||||
legend: {
|
||||
@ -93,20 +97,20 @@ export default {
|
||||
labelWidth: 15,
|
||||
border: false,
|
||||
borderWidth: 3,
|
||||
customRadius:34,
|
||||
customRadius: 34,
|
||||
borderColor: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
});
|
||||
setTimeout( ()=>{
|
||||
setTimeout(() => {
|
||||
_this.canvasToTempImage(_this.name)
|
||||
},500)
|
||||
}, 500)
|
||||
},
|
||||
canvasToTempImage(id){
|
||||
canvasToTempImage(id) {
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId:id,
|
||||
complete:(res)=>{
|
||||
if (res.tempFilePath){
|
||||
canvasId: id,
|
||||
complete: (res) => {
|
||||
if (res.tempFilePath) {
|
||||
uni.getFileSystemManager().readFile({
|
||||
filePath: res.tempFilePath,
|
||||
encoding: 'base64',
|
||||
@ -117,17 +121,18 @@ export default {
|
||||
})
|
||||
}
|
||||
}
|
||||
},this)
|
||||
}, this)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rateMain{
|
||||
.rateMain {
|
||||
width: 144rpx;
|
||||
height: 144rpx;
|
||||
.month{
|
||||
|
||||
.month {
|
||||
width: 136rpx;
|
||||
height: 136rpx;
|
||||
position: fixed;
|
||||
|
||||
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
@ -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>首页图标/本月计划备份_20@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="驿达小程序-首页0311" transform="translate(-289.000000, -2140.000000)">
|
||||
<g id="时间备份-2" transform="translate(289.000000, 2140.000000)">
|
||||
<path d="M0,5 L16,5 L16,15 C16,15.5522847 15.5522847,16 15,16 L1,16 C0.44771525,16 6.76353751e-17,15.5522847 0,15 L0,5 L0,5 Z" id="矩形" fill="#782717" opacity="0.200000003"></path>
|
||||
<path d="M3.5,0.5 L4.5,0.5 C4.77614237,0.5 5,0.723857625 5,1 L5,2 L5,2 L3,2 L3,1 C3,0.723857625 3.22385763,0.5 3.5,0.5 Z" id="矩形" fill="#782717" opacity="0.5"></path>
|
||||
<path d="M11.5,0.5 L12.5,0.5 C12.7761424,0.5 13,0.723857625 13,1 L13,2 L13,2 L11,2 L11,1 C11,0.723857625 11.2238576,0.5 11.5,0.5 Z" id="矩形备份" fill="#782717" opacity="0.5"></path>
|
||||
<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="#782717" opacity="0.5"></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 id="编组" transform="translate(8.500000, 8.000000) rotate(-45.000000) translate(-8.500000, -8.000000) translate(7.000000, 7.000000)" fill="#782717">
|
||||
<rect id="矩形" x="0" y="0" width="1" height="2"></rect>
|
||||
<rect id="矩形" x="0" y="1" width="3" height="1"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.2 KiB |
@ -1,14 +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="商业BI切图" transform="translate(-194.000000, -346.000000)" fill-rule="nonzero">
|
||||
<g id="编组-3" transform="translate(100.000000, 80.000000)">
|
||||
<g id="question-circle" transform="translate(94.000000, 266.000000)">
|
||||
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect>
|
||||
<path d="M8,1 C4.134375,1 1,4.134375 1,8 C1,11.865625 4.134375,15 8,15 C11.865625,15 15,11.865625 15,8 C15,4.134375 11.865625,1 8,1 Z M8,13.8125 C4.790625,13.8125 2.1875,11.209375 2.1875,8 C2.1875,4.790625 4.790625,2.1875 8,2.1875 C11.209375,2.1875 13.8125,4.790625 13.8125,8 C13.8125,11.209375 11.209375,13.8125 8,13.8125 Z M9.74375,4.9484375 C9.275,4.5375 8.65625,4.3125 8,4.3125 C7.34375,4.3125 6.725,4.5390625 6.25625,4.9484375 C5.76875,5.375 5.5,5.9484375 5.5,6.5625 L5.5,6.68125 C5.5,6.75 5.55625,6.80625 5.625,6.80625 L6.375,6.80625 C6.44375,6.80625 6.5,6.75 6.5,6.68125 L6.5,6.5625 C6.5,5.8734375 7.1734375,5.3125 8,5.3125 C8.8265625,5.3125 9.5,5.8734375 9.5,6.5625 C9.5,7.0484375 9.15625,7.49375 8.6234375,7.6984375 C8.2921875,7.825 8.0109375,8.046875 7.809375,8.3375 C7.6046875,8.634375 7.4984375,8.990625 7.4984375,9.3515625 L7.4984375,9.6875 C7.4984375,9.75625 7.5546875,9.8125 7.6234375,9.8125 L8.3734375,9.8125 C8.4421875,9.8125 8.4984375,9.75625 8.4984375,9.6875 L8.4984375,9.3328125 C8.4984375,9.025 8.6921875,8.74375 8.98125,8.6328125 C9.903125,8.278125 10.4984443,7.465625 10.4984443,6.5625 C10.5,5.9484375 10.23125,5.375 9.74375,4.9484375 Z M7.375,11.4375 C7.375,11.782678 7.65482203,12.0625 8,12.0625 C8.34517797,12.0625 8.625,11.782678 8.625,11.4375 C8.625,11.092322 8.34517797,10.8125 8,10.8125 C7.65482203,10.8125 7.375,11.092322 7.375,11.4375 Z" id="形状" fill="#A69E9F"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.1 KiB |
@ -1,15 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>首页图标/本月计划备份_4@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="驿达小程序-首页0311" transform="translate(-219.000000, -2176.000000)">
|
||||
<g id="分润门店" transform="translate(219.000000, 2176.000000)">
|
||||
<path d="M3,12 L24,12 L24,23 C24,24.1045695 23.1045695,25 22,25 L5,25 C3.8954305,25 3,24.1045695 3,23 L3,12 L3,12 Z" id="矩形" fill="#E3D2D2"></path>
|
||||
<path d="M13.5,19 C15.1568542,19 16.5,20.3431458 16.5,22 L16.5,25 L16.5,25 L10.5,25 L10.5,22 C10.5,20.3431458 11.8431458,19 13.5,19 Z" id="矩形" fill="#FFFFFF"></path>
|
||||
<path d="M7,4 L20,4 C20.6295146,4 21.2222912,4.29638831 21.6,4.8 L25.8,10.4 C26.1313708,10.8418278 26.0418278,11.4686292 25.6,11.8 C25.4269038,11.9298221 25.2163702,12 25,12 L2,12 C1.44771525,12 1,11.5522847 1,11 C1,10.7836298 1.07017787,10.5730962 1.2,10.4 L5.4,4.8 C5.77770876,4.29638831 6.37048539,4 7,4 Z" id="矩形" fill="#E3D2D2"></path>
|
||||
<path d="M20.1055728,15.4472136 L24.5527864,13.2236068 C24.8343139,13.0828431 25.1656861,13.0828431 25.4472136,13.2236068 L29.8944272,15.4472136 C30.5719952,15.7859976 31,16.4785239 31,17.236068 L31,20.0948752 C31,22.569308 29.9009119,24.9159067 28,26.5 L26.2803688,27.933026 C25.5386769,28.5511026 24.4613231,28.5511026 23.7196312,27.933026 L22,26.5 C20.0990881,24.9159067 19,22.569308 19,20.0948752 L19,17.236068 C19,16.4785239 19.4280048,15.7859976 20.1055728,15.4472136 Z" id="矩形" fill="#0094FF"></path>
|
||||
<path d="M24,13.5 L24,23 C24,24.1045695 23.1045695,25 22,25 L20.5961883,25.0009855 C19.5689695,23.5893868 19,21.8752192 19,20.0948752 L19,17.236068 C19,16.4785239 19.4280048,15.7859976 20.1055728,15.4472136 L24,13.5 Z" id="形状结合" fill="#5827DA"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.0 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>首页图标/本月计划备份_11@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="驿达小程序-首页0311" transform="translate(-355.000000, -2278.000000)" fill-rule="nonzero">
|
||||
<g id="点赞" transform="translate(355.000000, 2278.000000)">
|
||||
<rect id="矩形" fill="#4D66FF" opacity="0" x="0" y="0" width="16" height="16"></rect>
|
||||
<path d="M12.0875,14.2609375 L12.06875,14.2609375 C11.4875,14.2546875 10.9046875,14.2546875 10.321875,14.2546875 L9.4328125,14.2546875 C8.8390625,14.2546875 8.2453125,14.2546875 7.65,14.246875 C7.3203125,14.2375 6.9953125,14.16875 6.6890625,14.04375 C6.16875,13.840625 5.871875,13.3875 5.87343136,12.7984375 L5.875,10.5890625 C5.875,9.365625 5.875,8.140625 5.8859375,6.9171875 C5.8875,6.584375 6.1015625,6.271875 6.284375,6.1078125 C6.9921875,5.4609375 7.7609375,4.6546875 8.0828125,3.5671875 C8.171875,3.2640625 8.20625,2.9296875 8.2421875,2.5765625 C8.3140625,1.8734375 8.7703125,1.415625 9.3796875,1.415625 C9.61875,1.415625 9.8578125,1.4875 10.0921875,1.6265625 C10.5625,1.909375 10.8765625,2.353125 11.05,2.9859375 C11.328125,3.990625 11.1859375,4.965625 11.0296875,5.8015625 L11.0296875,5.8046875 C10.99375,6 11.140625,6.18125 11.340625,6.18125 L13.371875,6.18125 C13.721875,6.18125 14.2234375,6.225 14.5328125,6.6 C14.7578125,6.8734375 14.821875,7.2421875 14.7265625,7.7296875 C14.4359375,9.228125 14.0796875,10.7390625 13.7390625,12.146875 C13.6328125,12.5859375 13.45625,12.9921875 13.2859375,13.3859375 L13.2125,13.5546875 C13.01875,14.0109375 12.61875,14.2609375 12.0875,14.2609375 L12.0875,14.2609375 Z M3.3765625,14.1140625 L3.190625,14.1140625 C2.51875,14.1140625 1.96875,13.5640625 1.96875,12.8921875 L1.96875,7.446875 C1.96875,6.775 2.51875,6.225 3.190625,6.225 L3.3765625,6.225 C4.0484375,6.225 4.59844082,6.775 4.59844082,7.446875 L4.59844082,12.890625 C4.6,13.5640625 4.05,14.1140625 3.3765625,14.1140625 L3.3765625,14.1140625 Z" id="形状" fill="#FF6E40"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.2 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>首页图标/本月计划备份_18@2x</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="驿达小程序-首页0311" transform="translate(-387.000000, -2278.000000)" fill-rule="nonzero">
|
||||
<g id="点赞" transform="translate(387.000000, 2278.000000)">
|
||||
<rect id="矩形" fill="#4D66FF" opacity="0" x="0" y="0" width="16" height="16"></rect>
|
||||
<path d="M12.0875,14.2609375 L12.06875,14.2609375 C11.4875,14.2546875 10.9046875,14.2546875 10.321875,14.2546875 L9.4328125,14.2546875 C8.8390625,14.2546875 8.2453125,14.2546875 7.65,14.246875 C7.3203125,14.2375 6.9953125,14.16875 6.6890625,14.04375 C6.16875,13.840625 5.871875,13.3875 5.87343136,12.7984375 L5.875,10.5890625 C5.875,9.365625 5.875,8.140625 5.8859375,6.9171875 C5.8875,6.584375 6.1015625,6.271875 6.284375,6.1078125 C6.9921875,5.4609375 7.7609375,4.6546875 8.0828125,3.5671875 C8.171875,3.2640625 8.20625,2.9296875 8.2421875,2.5765625 C8.3140625,1.8734375 8.7703125,1.415625 9.3796875,1.415625 C9.61875,1.415625 9.8578125,1.4875 10.0921875,1.6265625 C10.5625,1.909375 10.8765625,2.353125 11.05,2.9859375 C11.328125,3.990625 11.1859375,4.965625 11.0296875,5.8015625 L11.0296875,5.8046875 C10.99375,6 11.140625,6.18125 11.340625,6.18125 L13.371875,6.18125 C13.721875,6.18125 14.2234375,6.225 14.5328125,6.6 C14.7578125,6.8734375 14.821875,7.2421875 14.7265625,7.7296875 C14.4359375,9.228125 14.0796875,10.7390625 13.7390625,12.146875 C13.6328125,12.5859375 13.45625,12.9921875 13.2859375,13.3859375 L13.2125,13.5546875 C13.01875,14.0109375 12.61875,14.2609375 12.0875,14.2609375 L12.0875,14.2609375 Z M3.3765625,14.1140625 L3.190625,14.1140625 C2.51875,14.1140625 1.96875,13.5640625 1.96875,12.8921875 L1.96875,7.446875 C1.96875,6.775 2.51875,6.225 3.190625,6.225 L3.3765625,6.225 C4.0484375,6.225 4.59844082,6.775 4.59844082,7.446875 L4.59844082,12.890625 C4.6,13.5640625 4.05,14.1140625 3.3765625,14.1140625 L3.3765625,14.1140625 Z" id="形状" fill="#4E68FF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |