861 lines
24 KiB
Vue
861 lines
24 KiB
Vue
<template>
|
||
<view class="page" :style="themeColor">
|
||
<view class="flex benben-position-layout flex flex-wrap align-center viewReport_flex_0"
|
||
:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
|
||
<view class='flex flex-wrap align-center justify-between flex-sub viewReport_fd0_0'>
|
||
<view class='flex flex-wrap align-center' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
|
||
<text class='fu-iconfont2 viewReport_fd0_0_c0_c0' @tap.stop="handleJumpDiy" data-type="back"
|
||
data-url="1"></text>
|
||
</view>
|
||
<view class='flex flex-wrap align-stretch justify-center flex-sub'>
|
||
<text class='viewReport_fd0_0_c1_c0'>财务报表</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center viewReport_fd0_0_c2'>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
|
||
<!---日数据flex布局开始-->
|
||
<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout viewReport_flex_1">
|
||
<view class='flex flex-direction flex-wrap align-stretch flex-sub viewReport_fd1_0'>
|
||
<view class='flex flex-wrap align-center viewReport_fd1_0_c0'>
|
||
<text class='viewReport_fd1_0_c0_c0'>日数据</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center'>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_0_c1_c0'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_0_c1_c0_c0_c0'>今日营业额</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_0_c1_c0_c1'>
|
||
<text class='viewReport_fd1_0_c1_c0_c1_c0'>{{details.today_order_money}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_0_c1_c1'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_0_c1_c1_c0_c0'>今日成交量</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_0_c1_c1_c1'>
|
||
<text class='viewReport_fd1_0_c1_c1_c1_c0'>{{details.today_order_num}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_0_c1_c2'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_0_c1_c2_c0_c0'>昨日营业额</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_0_c1_c2_c1'>
|
||
<text class='viewReport_fd1_0_c1_c2_c1_c0'>{{details.yesterday_order_money}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_0_c1_c3'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_0_c1_c3_c0_c0'>昨日成交量</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_0_c1_c3_c1'>
|
||
<text class='viewReport_fd1_0_c1_c3_c1_c0'>{{details.yesterday_order_num}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_1'>
|
||
<view class='flex flex-wrap align-center justify-between'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_1_c0_c0_c0'>近七天营业额曲线</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center'>
|
||
<view class='flex flex-wrap align-center viewReport_fd1_1_c0_c1_c0'>
|
||
<image class='viewReport_fd1_1_c0_c1_c0_c0' mode="aspectFit" :src='STATIC_URL+"48.png"'>
|
||
</image>
|
||
<text class='viewReport_fd1_1_c0_c1_c0_c1'>成交量</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center'>
|
||
<image class='viewReport_fd1_1_c0_c1_c1_c0' mode="aspectFit" :src='STATIC_URL+"47.png"'>
|
||
</image>
|
||
<text class='viewReport_fd1_1_c0_c1_c1_c1'>成交额</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_1_c1'>
|
||
<view class=" viewReport_fd1_1_c1_c0">
|
||
<!-- <qiun-data-charts type='line' chart-type='4' /> -->
|
||
<canvas @touchstart="onClick" class="chart" id="line" canvas-id="line"></canvas>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch flex-sub viewReport_fd1_2'>
|
||
<view class='flex flex-wrap align-center viewReport_fd1_2_c0'>
|
||
<text class='viewReport_fd1_2_c0_c0'>月数据</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center'>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_2_c1_c0'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_2_c1_c0_c0_c0'>本月营业额</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_2_c1_c0_c1'>
|
||
<text class='viewReport_fd1_2_c1_c0_c1_c0'>{{details.this_month_order_money}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_2_c1_c1'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_2_c1_c1_c0_c0'>本月成交量</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_2_c1_c1_c1'>
|
||
<text class='viewReport_fd1_2_c1_c1_c1_c0'>{{details.this_month_order_num}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_2_c1_c2'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_2_c1_c2_c0_c0'>上月营业额</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_2_c1_c2_c1'>
|
||
<text class='viewReport_fd1_2_c1_c2_c1_c0'>{{details.last_month_order_money}}</text>
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-direction flex-wrap align-stretch viewReport_fd1_2_c1_c3'>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='viewReport_fd1_2_c1_c3_c0_c0'>上月成交量</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-center viewReport_fd1_2_c1_c3_c1'>
|
||
<text class='viewReport_fd1_2_c1_c3_c1_c0'>{{details.last_month_order_num}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!---日数据flex布局结束-->
|
||
|
||
|
||
</view>
|
||
</template>
|
||
<script>
|
||
export default {
|
||
components: {},
|
||
|
||
|
||
data() {
|
||
return {
|
||
lineColorArr: [{
|
||
color: "#4A93E8"
|
||
}, {
|
||
color: "#6BBBC3"
|
||
}], //切换折线1，折线2{color:"#888"},{color:"#888"}3.0最新版本修改
|
||
details: ""
|
||
};
|
||
},
|
||
computed: {
|
||
themeColor() {
|
||
return this.$store.getters.themeColor
|
||
},
|
||
|
||
},
|
||
watch: {},
|
||
onReady() {
|
||
const query = uni.createSelectorQuery().in(this);
|
||
query.select('.chart').boundingClientRect(data => {
|
||
// this.domEchart = data;
|
||
console.log(data)
|
||
this.lineDraw("line", data, -1);
|
||
}).exec();
|
||
},
|
||
onLoad(options) {
|
||
this.get649bdc9a8a38f()
|
||
|
||
},
|
||
methods: {
|
||
get649bdc9a8a38f() {
|
||
this.$api.post(global.apiUrls.get649bdc9a8a38f, {
|
||
type: this.tabls
|
||
}).then(res => {
|
||
if (res.data.code == 1) {
|
||
this.details = res.data.data
|
||
}
|
||
})
|
||
},
|
||
toFixedNumber(n = 2, val) { //去小数点后2位
|
||
if (typeof val == "number") {
|
||
return val.toFixed(n) * 1
|
||
}
|
||
},
|
||
//绘制线条 line chart3.0最新版本修改
|
||
lineDraw(ids, elem, num = -1) {
|
||
|
||
|
||
let ctx = uni.createCanvasContext(ids),
|
||
isHover = null;
|
||
|
||
|
||
|
||
let grid = {
|
||
top: (12 * elem.height) / 100, //canvas标签的高度的12%（相对总高的百分比）
|
||
bottom: ((100 - 18) * elem.height) / 100, //canvas图形距离底部的百分比 18%
|
||
left: (12 * elem.width) / 100, //距离左侧的百分比（12%总宽度）
|
||
right: ((100 - 8) * elem.width) / 100 //距离右侧百分比（8%总宽度）
|
||
},
|
||
lineColor = "#999", //x,y轴线颜色
|
||
fillColor = "#333", //x,y轴number颜色
|
||
|
||
// yAxis = {
|
||
// textSize: 10, //刻度数字fontSize
|
||
// maxNumber: moneyNum, //分段的最大值
|
||
// splitNumber: 5, //分成几段
|
||
// splitLen: 5, //轴左侧的小横线 -|
|
||
// marginSplit: 5 //刻度文字与 “-|”的距离
|
||
// },
|
||
lineWidth = 1,
|
||
xAxis = {
|
||
textSize: 10, //刻度数字fontSize
|
||
maxNumber: 12,
|
||
splitNumber: 6,
|
||
splitLen: 5,
|
||
marginSplit: 5
|
||
},
|
||
dotStyle = [{
|
||
color: "#fff",
|
||
arcR: 4, //半径
|
||
dash: 0 //是否线条虚线 0实线 1以上虚线
|
||
},
|
||
{
|
||
color: "#fff",
|
||
arcR: 4, //半径
|
||
dash: 0 //是否线条虚线 0实线 1以上虚线
|
||
}
|
||
],
|
||
lineStyle = [{
|
||
color: "#4A93E8",
|
||
lineDotType: "line", //两圆点的连接线 line直线，wave二次贝塞尔曲线
|
||
width: 2, //连线的width
|
||
dash: 3 //是否线条虚线 0实线 1以上虚线
|
||
},
|
||
{
|
||
color: "#6BBBC3",
|
||
lineDotType: "line", //两圆点的连接线 line直线，wave二次贝塞尔曲线
|
||
width: 2, //连线的width
|
||
dash: 0 //是否线条虚线 0实线 1以上虚线
|
||
}
|
||
],
|
||
dataJSON = [ //数据data
|
||
// {
|
||
// x: [1, 3, 5, 9, 10, 12],//设置字符类型，非Number
|
||
// y: [69, 28, 70, 65, 76, 65]
|
||
// },
|
||
// {
|
||
// x: [1, 3, 5, 9, 10, 12],//非Number类型数据 复制第一条 x的数据
|
||
// y: [9, 18, 70, 75, 56, 35]
|
||
// }
|
||
// {
|
||
// x: ["1月", "3月", "5月", "9月", "10月", "12月"], //设置字符类型，非Number
|
||
// y: [69, 28, 70, 65, 76, 65]
|
||
// },
|
||
// {
|
||
// x: ["1月", "3月", "5月", "10月", "10月", "12月"], //非Number类型数据 复制第一条 x的数据
|
||
// y: [9, 18, 70, 75, 56, 35]
|
||
// }
|
||
];
|
||
|
||
|
||
|
||
|
||
lineStyle.forEach((ep, vp) => {
|
||
if (num == vp) {
|
||
this.lineColorArr[vp] = {
|
||
color: ep.color
|
||
};
|
||
} else if (num == -1) {
|
||
this.lineColorArr[vp] = {
|
||
color: ep.color
|
||
};
|
||
} else {
|
||
this.lineColorArr[vp] = {
|
||
color: "#888"
|
||
};
|
||
}
|
||
|
||
});
|
||
ctx.beginPath();
|
||
ctx.setLineWidth(lineWidth);
|
||
ctx.setTextAlign("right");
|
||
ctx.setTextBaseline("middle");
|
||
ctx.setStrokeStyle(lineColor);
|
||
ctx.setFillStyle(fillColor);
|
||
ctx.moveTo(grid.left, grid.top);
|
||
ctx.lineTo(grid.left, grid.bottom);
|
||
let yAxis=""
|
||
this.$api.post(global.apiUrls.get649bdc9a8a38f, {
|
||
type: this.tabls
|
||
}).then(res => {
|
||
if (res.data.code == 1) {
|
||
let moneyNum = Math.ceil(res.data.data.this_month_order_money)
|
||
console.log(moneyNum)
|
||
yAxis = {
|
||
textSize: 10, //刻度数字fontSize
|
||
maxNumber: moneyNum, //分段的最大值
|
||
splitNumber: 5, //分成几段
|
||
splitLen: 5, //轴左侧的小横线 -|
|
||
marginSplit: 5 //刻度文字与 “-|”的距离
|
||
}
|
||
ctx.setFontSize(yAxis.textSize);
|
||
for (let n = 1; n <= yAxis.splitNumber; n++) {
|
||
ctx.moveTo(grid.left, grid.bottom - (grid.bottom - grid.top) / yAxis.splitNumber * n + lineWidth);
|
||
ctx.lineTo(grid.left - yAxis.splitLen, grid.bottom - (grid.bottom - grid.top) / yAxis.splitNumber * n +
|
||
lineWidth);
|
||
ctx.fillText(this.toFixedNumber(1, yAxis.maxNumber / yAxis.splitNumber * n), grid.left - yAxis
|
||
.splitLen - lineWidth - yAxis.marginSplit, grid.bottom - (grid.bottom - grid.top) / yAxis
|
||
.splitNumber * n + lineWidth)
|
||
}
|
||
}
|
||
})
|
||
// ctx.setFontSize(yAxis.textSize);
|
||
// for (let n = 1; n <= yAxis.splitNumber; n++) {
|
||
// ctx.moveTo(grid.left, grid.bottom - (grid.bottom - grid.top) / yAxis.splitNumber * n + lineWidth);
|
||
// ctx.lineTo(grid.left - yAxis.splitLen, grid.bottom - (grid.bottom - grid.top) / yAxis.splitNumber * n +
|
||
// lineWidth);
|
||
// ctx.fillText(this.toFixedNumber(1, yAxis.maxNumber / yAxis.splitNumber * n), grid.left - yAxis
|
||
// .splitLen - lineWidth - yAxis.marginSplit, grid.bottom - (grid.bottom - grid.top) / yAxis
|
||
// .splitNumber * n + lineWidth)
|
||
// }
|
||
ctx.moveTo(grid.left, grid.bottom);
|
||
ctx.lineTo(grid.right, grid.bottom);
|
||
ctx.setTextAlign("center");
|
||
ctx.setTextBaseline("top");
|
||
ctx.setFontSize(xAxis.textSize);
|
||
|
||
this.$api.post(global.apiUrls.get649bdc9a8a38f,{
|
||
type:this.tabls
|
||
}).then(res=>{
|
||
if(res.data.code==1){
|
||
dataJSON = res.data.data.list
|
||
console.log(dataJSON)
|
||
|
||
if (typeof dataJSON[0].x[0] != "number") { //非number类型数据
|
||
xAxis.splitNumber = dataJSON[0].x.length;
|
||
xAxis.maxNumber = dataJSON[0].x.length;
|
||
}
|
||
for (let n = 1; n <= xAxis.splitNumber; n++) {
|
||
ctx.moveTo(grid.left + (grid.right - grid.left) / xAxis.splitNumber * n - lineWidth, grid.bottom);
|
||
ctx.lineTo(grid.left + (grid.right - grid.left) / xAxis.splitNumber * n - lineWidth, grid.bottom +
|
||
xAxis.splitLen);
|
||
//this.toFixedNumber(1, xAxis.maxNumber / xAxis.splitNumber * n)
|
||
if (typeof dataJSON[0].x[n - 1] != "number") { //数据非number类型
|
||
ctx.fillText(dataJSON[0].x[n - 1], grid.left + (grid.right -
|
||
grid.left) / xAxis.splitNumber * n - lineWidth, grid.bottom + xAxis.splitLen +
|
||
lineWidth +
|
||
xAxis.marginSplit)
|
||
} else { //number类型
|
||
ctx.fillText(this.toFixedNumber(1, xAxis.maxNumber / xAxis.splitNumber * n), grid.left + (grid
|
||
.right -
|
||
grid.left) / xAxis.splitNumber * n - lineWidth, grid.bottom + xAxis.splitLen +
|
||
lineWidth +
|
||
xAxis.marginSplit)
|
||
}
|
||
}
|
||
ctx.stroke();
|
||
let tapDraw = (obj, data) => {
|
||
ctx.save();
|
||
ctx.beginPath();
|
||
ctx.setFillStyle("#2C405A");
|
||
ctx.setStrokeStyle("#E6A23C");
|
||
ctx.setLineDash([5]);
|
||
ctx.setLineWidth(1);
|
||
ctx.moveTo(grid.left, obj.y - obj.offsetTop);
|
||
ctx.lineTo(grid.right, obj.y - obj.offsetTop);
|
||
ctx.moveTo(obj.x - obj.offsetLeft, grid.top);
|
||
ctx.lineTo(obj.x - obj.offsetLeft, grid.bottom);
|
||
ctx.stroke();
|
||
ctx.restore();
|
||
// ctx.draw(true, function(res,obj){
|
||
// console.log('draw success', ctx);
|
||
// });
|
||
}
|
||
let drawLineData = (dataX, dataY, ix) => {
|
||
dataX.forEach((ele, indx) => {
|
||
let x, y;
|
||
if (typeof ele !== "number") {
|
||
x = grid.left + (grid.right - grid.left) * ((indx + 1) / xAxis.maxNumber) -
|
||
lineWidth,
|
||
y = grid.bottom - (grid.bottom - grid.top) * (dataY[indx] / yAxis.maxNumber) +
|
||
lineWidth;
|
||
} else {
|
||
x = grid.left + (grid.right - grid.left) * (ele / xAxis.maxNumber) - lineWidth,
|
||
y = grid.bottom - (grid.bottom - grid.top) * (dataY[indx] / yAxis.maxNumber) +
|
||
lineWidth;
|
||
}
|
||
if (indx >= dataX.length - 1) {} else {
|
||
let x2 = typeof ele !== "number" ? grid.left + (grid.right - grid.left) * ((indx +
|
||
2) / xAxis
|
||
.maxNumber) - lineWidth : grid.left + (grid.right - grid.left) * (dataX[
|
||
indx + 1] / xAxis
|
||
.maxNumber) - lineWidth,
|
||
y2 = grid.bottom - (grid.bottom - grid.top) * (dataY[indx + 1] / yAxis
|
||
.maxNumber) + lineWidth;
|
||
let dis = {
|
||
x: x + (x2 - x) / 3 + (x2 - x) / 2,
|
||
y: y2 - y > 0 ? y + (y2 - y) / 3 - (y2 - y) / 5 : y + (y2 - y) / 3 + (y2 -
|
||
y) / 5
|
||
};
|
||
ctx.beginPath();
|
||
ctx.setStrokeStyle(lineStyle[ix].color);
|
||
ctx.setLineDash([lineStyle[ix].dash]);
|
||
ctx.moveTo(x, y);
|
||
if (lineStyle[ix].lineDotType == "line") { //直线连接
|
||
ctx.lineTo(x2, y2);
|
||
} else if (lineStyle[ix].lineDotType == "wave") { //二次贝塞尔曲线连接
|
||
ctx.quadraticCurveTo(dis.x, dis.y, x2, y2);
|
||
}
|
||
ctx.stroke();
|
||
}
|
||
//显示 x，y的值
|
||
if (this.tapEvent != null) {
|
||
let x2 = this.tapEvent.x - this.tapEvent.offsetLeft,
|
||
y2 = this.tapEvent.y - this.tapEvent.offsetTop;
|
||
if (this.distDot({
|
||
x: x2,
|
||
y: y2
|
||
}, {
|
||
x: x,
|
||
y: y
|
||
}, dotStyle[ix].arcR + lineWidth) < 0) {
|
||
ctx.beginPath();
|
||
ctx.setFillStyle("#E6A23C");
|
||
ctx.setLineDash([dotStyle[ix].dash]);
|
||
ctx.arc(x, y, dotStyle[ix].arcR * 1.5, 0, 2 * Math.PI);
|
||
ctx.fill();
|
||
ctx.stroke();
|
||
|
||
ctx.beginPath();
|
||
ctx.setFillStyle(lineStyle[ix].color);
|
||
ctx.setFontSize(14);
|
||
ix % 2 == 1 ?
|
||
ctx.fillText(ele + "," + dataY[indx], x, y + 6) :
|
||
ctx.fillText(ele + "," + dataY[indx], x, y - 20);
|
||
isHover = {
|
||
x: x,
|
||
y: y
|
||
};
|
||
ctx.fill();
|
||
} else {
|
||
ctx.beginPath();
|
||
ctx.setFillStyle(dotStyle[ix].color);
|
||
ctx.setLineDash([dotStyle[ix].dash]);
|
||
ctx.arc(x, y, dotStyle[ix].arcR, 0, 2 * Math.PI);
|
||
ctx.fill();
|
||
ctx.stroke();
|
||
}
|
||
|
||
} else {
|
||
ctx.beginPath();
|
||
ctx.setFillStyle(dotStyle[ix].color);
|
||
ctx.setLineDash([dotStyle[ix].dash]);
|
||
ctx.arc(x, y, dotStyle[ix].arcR, 0, 2 * Math.PI);
|
||
ctx.fill();
|
||
ctx.stroke();
|
||
if (num != -1) {
|
||
ctx.beginPath();
|
||
ctx.setFillStyle(lineStyle[ix].color);
|
||
ctx.setFontSize(12);
|
||
ctx.fillText(ele + "," + dataY[indx], x, y + 6);
|
||
ctx.fill();
|
||
}
|
||
}
|
||
})
|
||
}
|
||
dataJSON.forEach((e, v) => {
|
||
if (v == num && num != -1) {
|
||
drawLineData(e.x, e.y, v);
|
||
} else if (num == -1) {
|
||
drawLineData(e.x, e.y, v);
|
||
} else {
|
||
|
||
}
|
||
})
|
||
if (this.tapEvent != null && isHover != null) {
|
||
tapDraw(this.tapEvent, elem);
|
||
}
|
||
ctx.draw();
|
||
|
||
|
||
}
|
||
})
|
||
|
||
|
||
|
||
|
||
|
||
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.page {
|
||
width: 100vw;
|
||
overflow-x: hidden;
|
||
min-height: calc(100vh - var(--window-bottom));
|
||
background: rgba(248, 248, 248, 1);
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.chart {
|
||
width: 100%;
|
||
height: 480rpx;
|
||
background: #f8f8f8;
|
||
border-radius: 10rpx;
|
||
}
|
||
.viewReport_fd1_1_c1_c0 {
|
||
width: 639rpx;
|
||
height: 500rpx;
|
||
}
|
||
|
||
.viewReport_flex_0 {
|
||
background: #fff;
|
||
width: 750rpx;
|
||
height: 88rpx;
|
||
overflow: hidden;
|
||
z-index: 10;
|
||
top: 0rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd0_0_c2 {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.viewReport_fd0_0_c1_c0 {
|
||
font-size: 36rpx;
|
||
font-weight: 500;
|
||
color: #333333;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.viewReport_fd0_0_c0_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 88rpx;
|
||
}
|
||
|
||
.viewReport_fd0_0 {
|
||
margin: 0rpx 32rpx 0rpx 32rpx;
|
||
}
|
||
|
||
.viewReport_flex_1 {
|
||
padding: 24rpx 24rpx 40rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c3_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c3_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c3_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c3 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c2_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c2_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c2_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c2 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c1_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c1_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c1_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c1 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c0_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c0_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c0_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c1_c0 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_2_c0_c0 {
|
||
color: #111111;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2_c0 {
|
||
margin: 9rpx 9rpx 15rpx 9rpx;
|
||
}
|
||
|
||
.viewReport_fd1_2 {
|
||
background: rgba(255, 255, 255, 1);
|
||
margin: 0rpx 0rpx 20rpx 0rpx;
|
||
padding: 15rpx 15rpx 15rpx 15rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
|
||
|
||
.viewReport_fd1_1_c1 {
|
||
margin: 48rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c1_c1_c1 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
line-height: 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c1_c1_c0 {
|
||
width: 28rpx;
|
||
height: 8rpx;
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
margin: 0rpx 12rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c1_c0_c1 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
line-height: 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c1_c0_c0 {
|
||
width: 28rpx;
|
||
height: 8rpx;
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
margin: 0rpx 12rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c1_c0 {
|
||
margin: 0rpx 48rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1_c0_c0_c0 {
|
||
color: #111111;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.viewReport_fd1_1 {
|
||
background: rgba(255, 255, 255, 1);
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
padding: 30rpx 24rpx 0rpx 24rpx;
|
||
margin: 0rpx 0rpx 20rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c3_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c3_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c3_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c3 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c2_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c2_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c2_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c2 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c1_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c1_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c1_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c1 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c0_c1_c0 {
|
||
color: #333333;
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c0_c1 {
|
||
margin: 24rpx 0rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c0_c0_c0 {
|
||
color: #666666;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 24rpx;
|
||
margin: 24rpx 0rpx 0rpx 24rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c1_c0 {
|
||
background: rgba(247, 247, 247, 1);
|
||
margin: 9rpx 9rpx 9rpx 9rpx;
|
||
width: 318rpx;
|
||
height: 169rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.viewReport_fd1_0_c0_c0 {
|
||
color: #111111;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0_c0 {
|
||
margin: 9rpx 9rpx 15rpx 9rpx;
|
||
}
|
||
|
||
.viewReport_fd1_0 {
|
||
background: rgba(255, 255, 255, 1);
|
||
margin: 0rpx 0rpx 20rpx 0rpx;
|
||
padding: 15rpx 15rpx 15rpx 15rpx;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
</style>
|