34 changed files with 2310 additions and 310 deletions
@ -0,0 +1,3 @@ |
|||
import Vue from 'vue' |
|||
const bus = new Vue() |
|||
export default bus |
|||
@ -0,0 +1,132 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<image src="../../static/baseIcon/orders.png" style="width: 18px;height: 18px;" mode="aspectFill"></image> |
|||
<text class="top-name">{{info.name}}</text> |
|||
</view> |
|||
|
|||
<view class="content"> |
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">账户数量</text> |
|||
<text class="item-text1">{{info.number}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">截止时间</text> |
|||
<text class="item-text1">{{info.date}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view class="item" style="border-bottom: none;"> |
|||
|
|||
<text class="item-text">账户余额</text> |
|||
<text class="item-text1" >{{info.balance}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
info: { |
|||
sid: "", |
|||
name: "", |
|||
number: "", |
|||
date: "", |
|||
balance: "", |
|||
}, |
|||
|
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
this.info = { |
|||
sid: option.sid, |
|||
name: option.name, |
|||
number: option.number, |
|||
date: option.date, |
|||
balance: option.balance, |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
|
|||
padding: 20px 25px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
.top-name { |
|||
margin-left: 5px; |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
margin-left: 20px; |
|||
margin-right: 20px; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
|
|||
.item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 15px 20px; |
|||
border-bottom: 1px solid #eee; |
|||
|
|||
.item-text{ |
|||
font-size: 14px; |
|||
color: #191919; |
|||
} |
|||
|
|||
.item-text1{ |
|||
font-size: 14px; |
|||
color: #717171; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,132 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<image src="../../static/baseIcon/orders.png" style="width: 18px;height: 18px;" mode="aspectFill"></image> |
|||
<text class="top-name">{{info.name}}</text> |
|||
</view> |
|||
|
|||
<view class="content"> |
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">客户数量</text> |
|||
<text class="item-text1">{{info.customNumber}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">截止时间</text> |
|||
<text class="item-text1">{{info.date}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view class="item" style="border-bottom: none;"> |
|||
|
|||
<text class="item-text">应收账款</text> |
|||
<text class="item-text1" >{{info.accounts}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
info: { |
|||
sid: "", |
|||
name: "", |
|||
customNumber: "", |
|||
date: "", |
|||
accounts: "", |
|||
}, |
|||
|
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
this.info = { |
|||
sid: option.sid, |
|||
name: option.name, |
|||
customNumber: option.customNumber, |
|||
date: option.date, |
|||
accounts: option.accounts, |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
|
|||
padding: 20px 25px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
.top-name { |
|||
margin-left: 5px; |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
margin-left: 20px; |
|||
margin-right: 20px; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
|
|||
.item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 15px 20px; |
|||
border-bottom: 1px solid #eee; |
|||
|
|||
.item-text{ |
|||
font-size: 14px; |
|||
color: #191919; |
|||
} |
|||
|
|||
.item-text1{ |
|||
font-size: 14px; |
|||
color: #717171; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,122 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<image src="../../static/baseIcon/orders.png" style="width: 18px;height: 18px;" mode="aspectFill"></image> |
|||
<text class="top-name">{{info.name}}</text> |
|||
</view> |
|||
|
|||
<view class="content"> |
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">截止时间</text> |
|||
<text class="item-text1">{{info.date}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view class="item" style="border-bottom: none;"> |
|||
|
|||
<text class="item-text">预付金额</text> |
|||
<text class="item-text1" >{{info.advanceCharge}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
info: { |
|||
sid: "", |
|||
name: "", |
|||
date: "", |
|||
advanceCharge: "", |
|||
}, |
|||
|
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
this.info = { |
|||
sid: option.sid, |
|||
name: option.name, |
|||
date: option.date, |
|||
advanceCharge: option.advanceCharge, |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
|
|||
padding: 20px 25px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
.top-name { |
|||
margin-left: 5px; |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
margin-left: 20px; |
|||
margin-right: 20px; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
|
|||
.item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 15px 20px; |
|||
border-bottom: 1px solid #eee; |
|||
|
|||
.item-text{ |
|||
font-size: 14px; |
|||
color: #191919; |
|||
} |
|||
|
|||
.item-text1{ |
|||
font-size: 14px; |
|||
color: #717171; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,122 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<image src="../../static/baseIcon/orders.png" style="width: 18px;height: 18px;" mode="aspectFill"></image> |
|||
<text class="top-name">{{info.name}}</text> |
|||
</view> |
|||
|
|||
<view class="content"> |
|||
|
|||
<view class="item"> |
|||
|
|||
<text class="item-text">截止时间</text> |
|||
<text class="item-text1">{{info.date}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view class="item" style="border-bottom: none;"> |
|||
|
|||
<text class="item-text">在途货值</text> |
|||
<text class="item-text1" >{{info.goodsInTransit}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
info: { |
|||
sid: "", |
|||
name: "", |
|||
date: "", |
|||
goodsInTransit: "", |
|||
}, |
|||
|
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
this.info = { |
|||
sid: option.sid, |
|||
name: option.name, |
|||
date: option.date, |
|||
goodsInTransit: option.goodsInTransit, |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
|
|||
padding: 20px 25px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
.top-name { |
|||
margin-left: 5px; |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
margin-left: 20px; |
|||
margin-right: 20px; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
|
|||
.item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 15px 20px; |
|||
border-bottom: 1px solid #eee; |
|||
|
|||
.item-text{ |
|||
font-size: 14px; |
|||
color: #191919; |
|||
} |
|||
|
|||
.item-text1{ |
|||
font-size: 14px; |
|||
color: #717171; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,514 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<text class="top-name">{{info.projectName}}</text> |
|||
<text class="top-date">{{info.orderDate}}</text> |
|||
</view> |
|||
|
|||
<view class="centre"> |
|||
|
|||
<view class="centre-top"> |
|||
<qiun-data-charts type="ring" :opts="info.opts" :chartData="chartData" /> |
|||
</view> |
|||
|
|||
|
|||
<view class="centre-bom"> |
|||
<text class="centre-lift-text">贷款总额：{{info.totalLoanWan==''?'--':info.totalLoanWan}}万元</text> |
|||
<view class="centre-lift-view" @click="jump"> |
|||
<image src="../../static/baseIcon/download.png" style="width: 16px;height: 16px;" mode="aspectFill"> |
|||
</image> |
|||
<text class="centre-lift-view-text">报表下载</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view class="bom"> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
|||
<text style=" font-size: 16px; |
|||
color: #6C6C6C;">分项数据</text> |
|||
<text style=" font-size: 16px; |
|||
color: #6C6C6C;">单位：万元</text> |
|||
</view> |
|||
<qiun-data-charts ref="myChart" type="bar" @tap=tap($event) :opts="opts2" :chartData="chartData2" /> |
|||
|
|||
</view> --> |
|||
|
|||
<view style="margin-top: 30px;padding-bottom: 50px; display: flex;flex-direction: column;"> |
|||
|
|||
<view class="layout" @click="itemClick('1')"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/img/newApp/zhye.png" mode="aspectFill" |
|||
style="width: 12px;height: 12px;"> |
|||
</image> |
|||
|
|||
<view class="content"> |
|||
<text class="content-text1">账户余额</text> |
|||
<text class="content-text2">{{info.accountsBalanceWan }}万元</text> |
|||
|
|||
</view> |
|||
<image src="../../static/baseIcon/zy.png" mode="aspectFill" style="width: 14px;height: 14px;"></image> |
|||
</view> |
|||
|
|||
<view class="layout" @click="itemClick('2')"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/img/newApp/yszk.png" mode="aspectFill" |
|||
style="width: 12px;height: 12px;"> |
|||
</image> |
|||
|
|||
<view class="content"> |
|||
<text class="content-text1">应收账款</text> |
|||
<text class="content-text2">{{info.accountsReceivableWan }}万元</text> |
|||
|
|||
</view> |
|||
<image src="../../static/baseIcon/zy.png" mode="aspectFill" style="width: 14px;height: 14px;"></image> |
|||
</view> |
|||
|
|||
<view class="layout" @click="itemClick('3')"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/img/newApp/zwkcjz.png" mode="aspectFill" |
|||
style="width: 12px;height: 12px;"> |
|||
</image> |
|||
|
|||
<view class="content"> |
|||
<text class="content-text1">库存货值</text> |
|||
<text class="content-text2">{{info.stockAmountWan }}万元</text> |
|||
|
|||
</view> |
|||
<image src="../../static/baseIcon/zy.png" mode="aspectFill" style="width: 14px;height: 14px;"></image> |
|||
</view> |
|||
|
|||
<view class="layout" @click="itemClick('4')"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/img/newApp/zthwjz.png" mode="aspectFill" |
|||
style="width: 12px;height: 12px;"> |
|||
</image> |
|||
|
|||
<view class="content"> |
|||
<text class="content-text1">在途货值</text> |
|||
<text class="content-text2">{{info.transitAmountWan }}万元</text> |
|||
|
|||
</view> |
|||
<image src="../../static/baseIcon/zy.png" mode="aspectFill" style="width: 14px;height: 14px;"></image> |
|||
</view> |
|||
|
|||
<view class="layout" @click="itemClick('5')"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/img/newApp/yfk.png" mode="aspectFill" |
|||
style="width: 12px;height: 12px;"> |
|||
</image> |
|||
|
|||
<view class="content"> |
|||
<text class="content-text1">预付款</text> |
|||
<text class="content-text2">{{info.advancePaymentWan }}万元</text> |
|||
|
|||
</view> |
|||
<image src="../../static/baseIcon/zy.png" mode="aspectFill" style="width: 14px;height: 14px;"></image> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
params: { |
|||
projectSid: "9a2c1e08-0e0a-4440-bc3d-3adbef082cdb", |
|||
orderDate: "2023-08-07", |
|||
}, |
|||
info: { |
|||
projectName: "", |
|||
orderDate: "", |
|||
reportTime: "", |
|||
projectSid: "", |
|||
totalLoan: "", |
|||
totalLoanWan: "", |
|||
accountsBalance: "", |
|||
accountsBalanceWan: "", |
|||
accountsReceivable: "", |
|||
accountsReceivableWan: "", |
|||
stockAmount: "", |
|||
stockAmountWan: "", |
|||
transitAmount: "", |
|||
transitAmountWan: "", |
|||
advancePayment: "", |
|||
advancePaymentWan: "", |
|||
pledgeRate: "", |
|||
opts: {}, |
|||
}, |
|||
chartData: {}, |
|||
//您可以通过修改 config-ucharts.js 文件中下标为 ['ring'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。 |
|||
chartData2: {}, |
|||
opts2: { |
|||
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", |
|||
"#ea7ccc" |
|||
], |
|||
padding: [5, 30, 10, 10], |
|||
enableScroll: false, |
|||
legend: { |
|||
"show": false, |
|||
"position": "right", |
|||
"lineHeight": 25, |
|||
}, |
|||
xAxis: { |
|||
boundaryGap: "justify", |
|||
disableGrid: false, |
|||
min: 0, |
|||
axisLine: true, |
|||
max: 20000, |
|||
triggerEvent: true |
|||
}, |
|||
yAxis: { |
|||
triggerEvent: true |
|||
}, |
|||
|
|||
extra: { |
|||
bar: { |
|||
type: "stack", |
|||
width: 30, |
|||
meterBorde: 2, |
|||
meterFillColor: "#FFFFFF", |
|||
activeBgColor: "#000000", |
|||
activeBgOpacity: 0.08, |
|||
categoryGap: 2 |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
|
|||
// this.params = { |
|||
// projectSid: option.projectSid, |
|||
// orderDate: option.orderDate |
|||
// } |
|||
|
|||
|
|||
}, |
|||
onShow() { |
|||
wx.hideHomeButton() |
|||
// setTimeout(() => { |
|||
|
|||
// }, 1000) |
|||
this.getServerData(); |
|||
}, |
|||
methods: { |
|||
init() { |
|||
// var chart = this.$echarts.init(this.$refs["myChart"]); |
|||
// this.$refs["myChart"].getZr().on('click', params => { |
|||
|
|||
// let pointInPixel = [params.offsetX, params.offsetY] |
|||
|
|||
// if (chart.containPixel('grid', pointInPixel)) { |
|||
|
|||
// let xIndex = chart.convertFromPixel({ |
|||
// seriesIndex: 0 |
|||
// }, [params.offsetX, params.offsetY])[0] |
|||
|
|||
// console.log(xIndex) |
|||
|
|||
// this.select_index = xIndex |
|||
|
|||
// } |
|||
|
|||
// }) |
|||
}, |
|||
getServerData() { |
|||
|
|||
console.log("this.params", this.params) |
|||
|
|||
this.$api.getProjectDaily(this.params).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
|
|||
this.info = resp |
|||
|
|||
this.info.opts = { |
|||
rotate: false, |
|||
rotateLock: false, |
|||
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", |
|||
"#9A60B4", |
|||
"#ea7ccc" |
|||
], |
|||
dataLabel: false, |
|||
enableScroll: false, |
|||
legend: { |
|||
show: true, |
|||
position: "right", |
|||
lineHeight: 30 |
|||
}, |
|||
title: { |
|||
name: this.info.pledgeRatePercent+"%", |
|||
fontSize: 38, |
|||
color: "#F6A42F" |
|||
}, |
|||
subtitle: { |
|||
name: "质押率", |
|||
fontSize: 20, |
|||
color: "#17B0DF" |
|||
}, |
|||
extra: { |
|||
ring: { |
|||
ringWidth: 30, |
|||
activeOpacity: 0.1, |
|||
activeRadius: 1, |
|||
offsetAngle: 0, |
|||
labelWidth: 15, |
|||
border: true, |
|||
borderWidth: 3, |
|||
borderColor: "#FFFFFF" |
|||
} |
|||
} |
|||
}, |
|||
|
|||
//模拟从服务器获取数据时的延时 |
|||
setTimeout(() => { |
|||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|||
let res = { |
|||
series: [{ |
|||
data: [{ |
|||
"name": "帐户余额", |
|||
"value": this.info.accountsBalance, |
|||
"labelShow": true, |
|||
"labelText": "四班:18人" |
|||
}, { |
|||
"name": "应收账款", |
|||
"value": this.info.accountsReceivable, |
|||
"labelShow": true, |
|||
"labelText": "四班:18人" |
|||
}, { |
|||
"name": "库存货值", |
|||
"value": this.info.stockAmount, |
|||
"labelShow": true, |
|||
"labelText": "四班:18人" |
|||
}, { |
|||
"name": "在途货值", |
|||
"value": this.info.transitAmount, |
|||
"labelShow": true, |
|||
"labelText": "四班:18人" |
|||
}, { |
|||
"name": "预付款", |
|||
"value": this.info.advancePayment, |
|||
"labelShow": true, |
|||
"labelText": "四班:18人" |
|||
}] |
|||
}] |
|||
}; |
|||
this.chartData = JSON.parse(JSON.stringify(res)); |
|||
}, 500); |
|||
|
|||
// //模拟从服务器获取数据时的延时 |
|||
// setTimeout(() => { |
|||
// //模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|||
// let res = { |
|||
// categories: ["账户余额", "应收账款", "库存货值", "在途货值", "预付款"], |
|||
// series: [{ |
|||
// name: "", |
|||
// data: [this.info.accountsBalanceWan, this.info |
|||
// .accountsReceivableWan, |
|||
// this.info.stockAmountWan, this.info.transitAmountWan, |
|||
// this |
|||
// .info.advancePaymentWan |
|||
// ] |
|||
// }, |
|||
// // { |
|||
// // name: "完成量", |
|||
// // data: [18,27,21,24,6,28] |
|||
// // } |
|||
// ] |
|||
// }; |
|||
// this.chartData2 = JSON.parse(JSON.stringify(res)); |
|||
// }, 500); |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
|
|||
}, |
|||
jump() { |
|||
// 下载 |
|||
uni.navigateTo({ |
|||
url: 'RegulatoryReportingDownload?sid=' + this.info.projectSid + "&name=" + this.info |
|||
.projectName + |
|||
"&date=" + this.info.orderDate |
|||
}); |
|||
|
|||
}, |
|||
|
|||
itemClick(index) { |
|||
switch (index) { |
|||
case "1": |
|||
// 账号余额 |
|||
uni.navigateTo({ |
|||
url: 'AccountBalance?sid=' + this.info.projectSid + "&name=" + this.info.projectName + |
|||
"&number=暂无" + |
|||
"&date=" + this.info.reportTime + "&balance=" + this.info.accountsBalanceWan |
|||
}); |
|||
break; |
|||
case "2": |
|||
|
|||
// 应收账款 |
|||
uni.navigateTo({ |
|||
url: 'Accounts?sid=' + this.info.projectSid + "&name=" + this.info.projectName + |
|||
"&customNumber=暂无" + |
|||
"&date=" + this.info.reportTime + "&accounts=" + this.info.accountsReceivableWan |
|||
}); |
|||
break; |
|||
case "3": |
|||
// 库存汇总 |
|||
uni.navigateTo({ |
|||
url: 'InventorySummary?projectSid=' + this.info.projectSid + "&orderDate=" + this.info |
|||
.orderDate |
|||
}); |
|||
break; |
|||
case "4": |
|||
// 在途货物 |
|||
uni.navigateTo({ |
|||
url: 'GoodsInTransit?sid=' + this.info.projectSid + "&name=" + this.info.projectName + |
|||
"&goodsInTransit=" + this.info |
|||
.transitAmountWan + |
|||
"&date=" + this.info.reportTime |
|||
}); |
|||
|
|||
break; |
|||
case "5": |
|||
// 预付款 |
|||
uni.navigateTo({ |
|||
url: 'AdvanceCharge?sid=' + this.info.projectSid + "&name=" + this.info.projectName + |
|||
"&advanceCharge=" + this.info |
|||
.advancePaymentWan + "&date=" + this.info.reportTime |
|||
}); |
|||
break; |
|||
default: |
|||
break; |
|||
} |
|||
}, |
|||
tap(params) { |
|||
console.log("params", params) |
|||
}, |
|||
handleZrClick(params) { |
|||
console.log("params", params) |
|||
// 图标任意位置点击事件处理 |
|||
if (params.topTarget && params.topTarget.parent.anid && params.target === undefined) { |
|||
console.log("点击x或y轴") |
|||
} |
|||
|
|||
}, |
|||
clickBarInBarChart(params) { |
|||
console.log("params", params) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
background-color: #fff; |
|||
padding: 20px 25px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.top-name { |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.centre { |
|||
background-color: #fff; |
|||
display: flex; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
padding: 25px; |
|||
|
|||
.centre-top {} |
|||
|
|||
|
|||
.centre-bom { |
|||
margin-top: 10px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.centre-lift-text { |
|||
font-size: 14px; |
|||
color: #191919; |
|||
font-weight: 550; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.centre-lift-view { |
|||
display: flex; |
|||
align-items: center; |
|||
flex-direction: row; |
|||
|
|||
.centre-lift-view-text { |
|||
margin-left: 10px; |
|||
font-size: 14px; |
|||
color: #018AD2; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
.bom { |
|||
width: 90%; |
|||
margin: 20px; |
|||
} |
|||
|
|||
.layout { |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
padding: 15px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
margin-bottom: 10px; |
|||
|
|||
.content { |
|||
margin-left: 10px; |
|||
margin-right: 10px; |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
|
|||
.content-text1 { |
|||
font-size: 14px; |
|||
color: #191919; |
|||
} |
|||
|
|||
.content-text2 { |
|||
font-size: 14px; |
|||
color: #6c6c6c; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,194 @@ |
|||
<template> |
|||
|
|||
<view class="pages"> |
|||
|
|||
<view class="top"> |
|||
<text class="top-name">{{params.name}}</text> |
|||
<text class="top-date">{{params.orderDate}}</text> |
|||
</view> |
|||
|
|||
<view class="content"> |
|||
<view v-show="list.length==0"> |
|||
<view style="display:flex;flex-direction: column;justify-content: center;align-items: center;"> |
|||
<image src="../../static/baseIcon/notData.png" mode="aspectFill" |
|||
style="width: 150px;height: 150px;"> |
|||
</image> |
|||
<text style="text-align: center;width: 100%; color: #717171;">暂无数据</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in list" class="list"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 20px;"> |
|||
<text class="item-text">{{item.fileSrcName}}</text> |
|||
<text class="item-text" @click="downloadClick(item.fullUrl)">点击下载</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
params: { |
|||
projectSid: "", |
|||
name: "", |
|||
orderDate: "", |
|||
|
|||
}, |
|||
list: [ |
|||
// { |
|||
// sid: "1", |
|||
// name: "质物库存汇总表", |
|||
// url: "111111111111111", |
|||
// }, |
|||
// { |
|||
// sid: "2", |
|||
// name: "销售日报表", |
|||
// url: "222222222222", |
|||
// }, |
|||
// { |
|||
// sid: "3", |
|||
// name: "在途商品表", |
|||
// url: "3333333333", |
|||
// } |
|||
] |
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
console.log('option', option) |
|||
this.params = { |
|||
projectSid: option.sid, |
|||
name: option.name, |
|||
orderDate: option.date |
|||
} |
|||
|
|||
this.getServerData() |
|||
}, |
|||
methods: { |
|||
getServerData() { |
|||
|
|||
this.$api.getProjectDailyFiles(this.params).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
|
|||
this.list =resp |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
|
|||
}, |
|||
|
|||
downloadClick(url) { |
|||
if (url == '') { |
|||
uni.showToast({ |
|||
icon: "none", |
|||
title: "下载地址错误，请重新进入页面。", |
|||
duration: 5000 |
|||
}) |
|||
return |
|||
} |
|||
|
|||
|
|||
uni.downloadFile({ |
|||
url: url, // 网络文档地址 |
|||
success: (data) => { |
|||
if (data.statusCode === 200) { |
|||
uni.saveFile({ |
|||
tempFilePath: data.tempFilePath, //临时路径 |
|||
success: function(res) { |
|||
// 保存路径 |
|||
uni.showToast({ |
|||
title: "文件已保存：" + res.savedFilePath, |
|||
duration: 5000 |
|||
}) |
|||
setTimeout(() => { |
|||
//打开文档查看 |
|||
uni.openDocument({ |
|||
filePath: res.savedFilePath, |
|||
showMenu: true, //右上角是否有可以转发分享的功能 |
|||
success: function(res) { |
|||
console.log('打开文档成功') |
|||
} |
|||
}) |
|||
}, 3000); |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
uni.showToast({ |
|||
title: '失败请重新下载' |
|||
}); |
|||
}, |
|||
}); |
|||
|
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages { |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 100%; |
|||
|
|||
.top { |
|||
padding: 20px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.top-name { |
|||
font-size: 16px; |
|||
color: #000; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.top-date { |
|||
font-size: 13px; |
|||
color: #717171; |
|||
} |
|||
} |
|||
|
|||
.content { |
|||
display: flex; |
|||
width: 100%; |
|||
flex-direction: column; |
|||
border-top: 2px solid #eee; |
|||
|
|||
.list { |
|||
display: flex; |
|||
margin-left: 30px; |
|||
margin-right: 30px; |
|||
flex-direction: column; |
|||
|
|||
.item-text { |
|||
font-size: 14px; |
|||
color: #018AD2; |
|||
border-bottom: 1px solid #018AD2; |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,327 @@ |
|||
<template> |
|||
<view> |
|||
<!-- 自定义导航栏 --> |
|||
<view class="navBarBox"> |
|||
<!-- 状态栏占位 --> |
|||
<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
|||
<!-- 真正的导航栏内容 --> |
|||
<view class="navBar"> |
|||
<view>用户须知</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="subscribe"> |
|||
<template type="text/wxtag-template"> |
|||
<view class="subscribe-icon"> |
|||
<image class="subscribe-icon-one" src="/static/static/img/finger_00.png"></image> |
|||
<image class="subscribe-icon-two" src="/static/static/img/finger_01.png"></image> |
|||
</view> |
|||
<view class="subscribe-cont"> |
|||
<wx-open-subscribe :template="templateIds[0]" id="subscribe-btn" ref="subscribeBtn"> |
|||
<script type="text/wxtag-template" slot="style"> |
|||
<style> |
|||
.subscribe-txt{ |
|||
color: #89663f; |
|||
font-weight: bold; |
|||
-webkit-animation: subscribeCont 1s linear infinite; |
|||
animation: subscribeCont 1s linear infinite; |
|||
display: inline-block; |
|||
height: 40px; |
|||
width: 160px; |
|||
text-align: center; |
|||
line-height: 40px; |
|||
} |
|||
@keyframes subscribeCont { |
|||
25% { |
|||
transform: scale(.98); |
|||
} |
|||
|
|||
50%, |
|||
100% { |
|||
transform: scale(1); |
|||
} |
|||
|
|||
75% { |
|||
transform: scale(1.05); |
|||
} |
|||
} |
|||
</style> |
|||
</script> |
|||
<script type="text/wxtag-template"> |
|||
<view class="subscribe-txt">点击消息提醒</view> |
|||
</script> |
|||
</wx-open-subscribe> |
|||
</view> |
|||
</template> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
// const jweixin = require('jweixin-module'); |
|||
export default { |
|||
data() { |
|||
return { |
|||
// 状态栏高度 |
|||
statusBarHeight: 0, |
|||
templateIds: ['R9LbtDjg9sC-o3xUS2kDcSQ9MS4I67LnacAS8Fsmxp0'] |
|||
} |
|||
}, |
|||
//第一次加载时调用 |
|||
created() { |
|||
//获取手机状态栏高度 |
|||
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
|||
}, |
|||
onReady() { |
|||
this.getInfo() |
|||
}, |
|||
methods: { |
|||
getInfo() { |
|||
// 这里是后去config得基本信息（跟后端要接口 wx.$api.index.wpaySubscribeH5Info 别看不懂，这是封装的请求接口而已换成你自己的就行了） |
|||
wx.$api.index.wpaySubscribeH5Info(location.href.split('#')[0], ['chooseWXPay', ]).then(res1 => { |
|||
let w_pay = JSON.parse(res1.data) |
|||
this.$jweixin.config({ |
|||
debug: false, |
|||
appId: w_pay.appId, |
|||
timestamp: w_pay.timestamp, |
|||
nonceStr: w_pay.nonceStr, |
|||
signature: w_pay.signature, |
|||
jsApiList: ['wx-open-subscribe', 'wx-open-launch-app', 'launchAppLication'], |
|||
openTagList: ['wx-open-subscribe', 'wx-open-launch-app', 'wx-open-subscribe-dialog'] |
|||
}) |
|||
// config 准备好了那么就开始操作了， |
|||
jweixin.ready(() => { |
|||
// wx-open-subscribe 原生绑定点击事件 |
|||
this.$nextTick(() => { |
|||
const btn = this.$refs.subscribeBtn; |
|||
btn.addEventListener('success', ({ |
|||
detail |
|||
}) => { |
|||
this.content2 = JSON.parse(detail.subscribeDetails) |
|||
for (var i in this.content2) { |
|||
if (i === this.templateIds[0] || i === |
|||
'EZcWzqrLdU-2Ax6KILdv9uSf6ANbHka7CbYG2KGahPk') { |
|||
let status = JSON.parse(this.content2[i]).status |
|||
console.log(status) |
|||
console.log(this.content2) |
|||
if (status === 'accept') { |
|||
// 这里跟后端要个接口，绑定； |
|||
wx.$api.index.subscribeH5(1).then(res => { |
|||
wx.showLoading({ |
|||
title: res.data, |
|||
icon: 'none', |
|||
}) |
|||
// 获取卡权益 |
|||
// this.indexInfo(); |
|||
setTimeout(function() { |
|||
wx.hideLoading(); |
|||
}, 1000) |
|||
}) |
|||
} else if (status === 'reject') { |
|||
alert('拒绝授权') |
|||
} |
|||
} |
|||
} |
|||
}); |
|||
btn.addEventListener('error', (e) => { |
|||
alert('授权失败了，请重试') |
|||
}); |
|||
}) |
|||
}) |
|||
}).catch(err => { |
|||
wx.showToast({ |
|||
title: err.message, |
|||
icon: 'none' |
|||
}) |
|||
}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
.navBarBox { |
|||
background: #007AFF; |
|||
} |
|||
|
|||
.navBarBox .statusBar {} |
|||
|
|||
.navBarBox .navBar { |
|||
padding-top: 15px; |
|||
padding-bottom: 13px; |
|||
display: flex; |
|||
font-size: 13px; |
|||
flex-direction: row; |
|||
color: #ffffff; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
|
|||
/* 订阅消息 */ |
|||
.subscribe { |
|||
color: #89663f; |
|||
width: 100%; |
|||
padding: 0 100rpx; |
|||
display: inline-block; |
|||
box-sizing: border-box; |
|||
margin-top: 50rpx; |
|||
display: flex; |
|||
/* -webkit-animation: Tada 3s both infinite; |
|||
-moz-animation: Tada 3s both infinite; |
|||
-ms-animation: Tada 3s both infinite; |
|||
animation: Tada 3s both infinite; */ |
|||
} |
|||
|
|||
.subscribe-icon, |
|||
.subscribe-cont { |
|||
height: 80rpx; |
|||
text-align: center; |
|||
line-height: 80rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.subscribe-icon { |
|||
width: 150rpx; |
|||
padding-left: 30rpx; |
|||
box-sizing: border-box; |
|||
background: linear-gradient(to right, #f3c988, #f9e0b8); |
|||
border-radius: 40rpx 0 0 40rpx; |
|||
} |
|||
|
|||
.subscribe-icon::after { |
|||
position: absolute; |
|||
content: ''; |
|||
right: -50rpx; |
|||
top: 0; |
|||
width: 0; |
|||
height: 0; |
|||
border-bottom: 80rpx solid #f9e0b8; |
|||
border-right: 50rpx solid transparent; |
|||
z-index: 9; |
|||
} |
|||
|
|||
.subscribe-cont { |
|||
width: calc(100% - 150rpx); |
|||
background: linear-gradient(to right, #f3c988, #f9e0b8); |
|||
border-radius: 0 40rpx 40rpx 0; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.subscribe-cont text { |
|||
display: inline-block; |
|||
-webkit-animation: subscribeCont 1s linear infinite; |
|||
animation: subscribeCont 1s linear infinite; |
|||
} |
|||
|
|||
@keyframes subscribeCont { |
|||
25% { |
|||
transform: scale(.98); |
|||
} |
|||
|
|||
50%, |
|||
100% { |
|||
transform: scale(1); |
|||
} |
|||
|
|||
75% { |
|||
transform: scale(1.05); |
|||
} |
|||
} |
|||
|
|||
.subscribe-icon image { |
|||
width: 54rpx; |
|||
height: 54rpx; |
|||
margin-top: 14rpx; |
|||
} |
|||
|
|||
@keyframes Tada { |
|||
0% { |
|||
transform: scale(1); |
|||
transform: scale(1) |
|||
} |
|||
|
|||
70%, |
|||
73% { |
|||
transform: scale(1) rotate(-3deg); |
|||
transform: scale(1) rotate(-3deg) |
|||
} |
|||
|
|||
77%, |
|||
83%, |
|||
90%, |
|||
97% { |
|||
transform: scale(1) rotate(3deg); |
|||
transform: scale(1) rotate(3deg) |
|||
} |
|||
|
|||
80%, |
|||
87%, |
|||
93% { |
|||
transform: scale(1) rotate(-3deg); |
|||
transform: scale(1) rotate(-3deg) |
|||
} |
|||
|
|||
100% { |
|||
transform: scale(1) rotate(0); |
|||
transform: scale(1) rotate(0) |
|||
} |
|||
} |
|||
|
|||
.subscribe-icon-one { |
|||
-webkit-animation: bounce-right 1s linear infinite; |
|||
animation: bounce-right 1s linear infinite; |
|||
} |
|||
|
|||
@keyframes bounce-right { |
|||
25% { |
|||
transform: translateX(-3px); |
|||
} |
|||
|
|||
50%, |
|||
100% { |
|||
transform: translateX(0); |
|||
} |
|||
|
|||
75% { |
|||
transform: translateX(3px); |
|||
} |
|||
} |
|||
|
|||
.subscribe-icon-two { |
|||
-webkit-animation: bounce-two 1s linear infinite; |
|||
animation: bounce-two 1s linear infinite; |
|||
} |
|||
|
|||
@keyframes bounce-two { |
|||
25% { |
|||
opacity: 0; |
|||
transform: translateX(-3px); |
|||
} |
|||
|
|||
75% { |
|||
opacity: 1; |
|||
transform: translateX(3px); |
|||
} |
|||
} |
|||
|
|||
subscribe-btn { |
|||
width: 100%; |
|||
height: 200rpx; |
|||
text-align: center; |
|||
line-height: 150rpx; |
|||
font-size: 30rpx; |
|||
font-weight: 500; |
|||
color: #ffffff; |
|||
background-color: green; |
|||
position: relative; |
|||
overflow: hidden; |
|||
} |
|||
</style> |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
After Width: | Height: | Size: 923 B |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
Loading…
Reference in new issue