1080 lines
25 KiB
Vue
1080 lines
25 KiB
Vue
<!-- 统计页 -->
|
|
<template>
|
|
<view class="content">
|
|
<view class="c-top">
|
|
<view class="" @click="getback()">
|
|
<uni-icons type="left" size="18"></uni-icons>
|
|
</view>
|
|
<view class="c-title">业务统计</view>
|
|
<view class=""></view>
|
|
</view>
|
|
<view class="ail">
|
|
|
|
<!-- <view class="top-box">
|
|
<view class="t-top">
|
|
<view class="sis">
|
|
<view class="t-title">检测进行中</view>
|
|
<view class="t-num">{{threenum.workingNum}}</view>
|
|
</view>
|
|
<view class="sis">
|
|
<view class="t-title">当日订单</view>
|
|
<view class="t-num" >{{threenum.todayOrderNum}}</view>
|
|
</view>
|
|
<view class="sis">
|
|
<view class="t-title">当日结算订单</view>
|
|
<view class="t-num">{{threenum.workedNum}}</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<!-- ↓ 新增 -->
|
|
<view class="ping-bottom" style="margin-top: 2%;">
|
|
<view class="dinga">检测数量统计</view>
|
|
<view class=""></view>
|
|
<!-- <view class="dinga">选择时间</view> -->
|
|
</view>
|
|
<view style="width: 95%; margin: 5px auto;">
|
|
<uni-datetime-picker v-model="ranges" type="daterange" @maskClick="maskClick"/>
|
|
</view>
|
|
|
|
|
|
<view class="top-box" @click="goOrderList">
|
|
<view class="t-top">
|
|
<view class="sis">
|
|
<view class="t-title">订单数量</view>
|
|
<view class="t-num">{{ data2.allNum || 0 }}</view>
|
|
</view>
|
|
<view class="sis">
|
|
<view class="t-title">完成数量</view>
|
|
<view class="t-num">{{ data2.ywcNum || 0 }}</view>
|
|
</view>
|
|
<view class="sis">
|
|
<view class="t-title">检测中数量</view>
|
|
<view class="t-num">{{ data2.jxzNum || 0 }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ping-bottom">
|
|
<view class="dinga">营业额统计</view>
|
|
<view class=""></view>
|
|
<!-- <view class="dinga">选择时间</view> -->
|
|
</view>
|
|
<view style="width: 95%; margin: 5px auto;">
|
|
<uni-datetime-picker v-model="range" type="daterange" @maskClick="maskClick"/>
|
|
</view>
|
|
|
|
<view class="top-box">
|
|
|
|
<view class="t-top">
|
|
<view class="sys">
|
|
<view class="t-title">公示价格</view>
|
|
<view class="t-num">{{ data1.gsAmount || 0 }}</view>
|
|
</view>
|
|
<view class="sys">
|
|
<view class="t-title">应收款</view>
|
|
<view class="t-num">{{ data1.ysAmount || 0 }}</view>
|
|
</view>
|
|
<view class="sys">
|
|
<view class="t-title">已收款</view>
|
|
<view class="t-num">{{ data1.yjsAmount || 0 }}</view>
|
|
</view>
|
|
<view class="sys">
|
|
<view class="t-title">待收款</view>
|
|
<view class="t-num">{{ data1.ysAmount - data1.yjsAmount || 0 }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ping-bottom">
|
|
<view class="dinga">客户来源统计</view>
|
|
<!-- <view class="dinga" @click="goxiangqing(1)">更多<uni-icons type="right" size="12"></uni-icons></view> -->
|
|
</view>
|
|
|
|
<view class="top-box">
|
|
<view class="t-num" style="padding-top: 5%;" v-if="!data3">暂无数据...</view>
|
|
<view class="t-top" v-if="data3" v-for="(item,index) in data3">
|
|
<view class="sys2" @click="goCustomerDetail(item.remark)">
|
|
<view class="t-title">客户来源</view>
|
|
<view class="t-num">{{ item.remark || '' }}</view>
|
|
|
|
</view>
|
|
|
|
<view class="sys2">
|
|
<view class="t-title">数量</view>
|
|
<view class="t-num">{{ item.theNum || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys2">
|
|
<view class="t-title">公示金额</view>
|
|
<view class="t-num">{{ item.theAmount || '' }}</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ping-bottom">
|
|
<view class="dinga">检测车型统计</view>
|
|
<view class="dinga" @click="goxiangqing(2)">更多
|
|
<uni-icons type="right" size="12"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="top-box">
|
|
<view class="t-num" style="padding-top: 5%;" v-if="!data4[0]">暂无数据...</view>
|
|
<view class="t-top">
|
|
<view class="sys" v-if="data4[0]">
|
|
<view class="t-title">{{ data4[0].goodsTitle || '' }}</view>
|
|
<view class="t-num">{{ data4[0].theNum || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data4[1]">
|
|
<view class="t-title">{{ data4[1].goodsTitle || '' }}</view>
|
|
<view class="t-num">{{ data4[1].theNum || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data4[2]">
|
|
<view class="t-title">{{ data4[2].goodsTitle || '' }}</view>
|
|
<view class="t-num">{{ data4[2].theNum || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data4[3]">
|
|
<view class="t-title">{{ data4[3].goodsTitle || '' }}</view>
|
|
<view class="t-num">{{ data4[3].theNum || '' }}</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="ping-bottom">
|
|
<view class="dinga">检测类型统计</view>
|
|
<view class="dinga" @click="goxiangqing(4)">更多
|
|
<uni-icons type="right" size="12"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="top-box">
|
|
|
|
<view class="t-top">
|
|
<view class="sys" v-for="(skuData) in skuList">
|
|
<view class="t-title">{{ skuData.skuName }}</view>
|
|
<view class="t-num">{{ skuData.orderCount || 0 }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="ping-bottom">
|
|
<view class="dinga">待收款</view>
|
|
<view class="dinga" @click="goxiangqing(3)">更多
|
|
<uni-icons type="right" size="12"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="top-box">
|
|
<view class="t-top">
|
|
<view class="t-num" v-if="!data5[0]">暂无数据...</view>
|
|
<view class="sys" v-if="data5[0]">
|
|
<view class="t-title">{{ data5[0].theName || '' }}</view>
|
|
<view class="t-num">{{ data5[0].theAmount || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data5[1]">
|
|
<view class="t-title">{{ data5[1].theName || '' }}</view>
|
|
<view class="t-num">{{ data5[1].theAmount || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data5[2]">
|
|
<view class="t-title">{{ data5[2].theName || '' }}</view>
|
|
<view class="t-num">{{ data5[2].theAmount || '' }}</view>
|
|
|
|
</view>
|
|
<view class="sys" v-if="data5[3]">
|
|
<view class="t-title">{{ data5[3].theName || '' }}</view>
|
|
<view class="t-num">{{ data5[3].theAmount || '' }}</view>
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="cont-box">
|
|
<view class="cont-title">成交金额(已收款)</view>
|
|
<view class="cont-title" style="font-size: 10px; color:#0D2E8D ;">最近7天已收款金额</view>
|
|
<view class="dis-t">
|
|
</view>
|
|
<qiun-data-charts
|
|
:ontouch='true'
|
|
type="line"
|
|
:opts="dopts"
|
|
:chartData="Amount"
|
|
/>
|
|
</view>
|
|
<view class="cont-box">
|
|
<view class="cont-title">检测数量</view>
|
|
<view class="cont-title" style="font-size: 10px; color:#0D2E8D ;">最近7天</view>
|
|
<view class="dis-t">
|
|
</view>
|
|
<qiun-data-charts
|
|
:ontouch='true'
|
|
type="line"
|
|
:opts="dopts"
|
|
:chartData="chartDataNum"
|
|
/>
|
|
</view>
|
|
|
|
<view class="cont-box">
|
|
<view class="cont-title">已收款金额(按车型)</view>
|
|
<view class="dis-t">
|
|
|
|
<view class="lan-you">
|
|
<view class="yi" :class="{'er' : qhindex == index}" v-for="(item,index) in zilist" :key="index"
|
|
@click="gbindex(index,item.unit)"> {{ item.text }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<qiun-data-charts
|
|
:ontouch='true'
|
|
type="column"
|
|
:opts="dopts"
|
|
:chartData="chartData1"
|
|
/>
|
|
</view>
|
|
<view class="cont-box">
|
|
<view class="cont-title">数量统计(按车型)</view>
|
|
<view class="dis-t">
|
|
|
|
<view class="lan-you">
|
|
|
|
<view class="yi" :class="{'er' : qhindex1 == index}" v-for="(item,index) in zilist" :key="index"
|
|
@click="gbindex1(index,item.unit)"> {{ item.text }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<qiun-data-charts
|
|
:ontouch='true'
|
|
type="column"
|
|
:opts="dopts"
|
|
:chartData="chartData2"
|
|
/>
|
|
</view>
|
|
<view class="cont-box">
|
|
<view class="cont-title">检测合格率(按车型)</view>
|
|
<view class="dis-t">
|
|
|
|
<view class="lan-you">
|
|
|
|
<view class="yi" :class="{'er' : qhindex2 == index}" v-for="(item,index) in zilist" :key="index"
|
|
@click="gbindex2(index,item.unit)"> {{ item.text }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<qiun-data-charts
|
|
:ontouch='true'
|
|
type="column"
|
|
:opts="dopts1"
|
|
:chartData="chartData3"
|
|
/>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<u-popup :show="xling" @close="closexl" :round="10" @open="openxl">
|
|
<view class="popup-box">
|
|
<view class="sousuo">
|
|
<uni-icons type="search" size="22"></uni-icons>
|
|
<input type="text" v-model="searchValue" placeholder="请输入机构">
|
|
<text @click="getgetPartnerList()">搜索</text>
|
|
</view>
|
|
<view class="list-box">
|
|
<scroll-view class="list_scroll" scroll-y="true">
|
|
<view class="list-qiu" v-for="(item,index) in qubu" :key="index">
|
|
<view class="">
|
|
<text class="tel">{{ item.partnerName }}</text>
|
|
</view>
|
|
<view class="banniu">
|
|
<text @click="xinxuanze(item.partnerId,item.partnerName)">选择</text>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import config from '@/config'
|
|
import request from '../../utils/request';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
data1: '',
|
|
data2: '',
|
|
data3: [],
|
|
data4: '',
|
|
data5: '',
|
|
//检测类型统计
|
|
skuList: [],
|
|
startTime: '2023-9-28',
|
|
endTime: '2023-9-28',
|
|
name: '全部机构',
|
|
single: '',
|
|
range: ['2023-9-28', '2023-10-7'],
|
|
ranges: ['2023-9-28', '2023-10-7'],
|
|
partnerId: '',
|
|
searchValue: '',
|
|
baseUrl: this.$imgeUrl,
|
|
xling: false,
|
|
earchValue: '',
|
|
countdown: 3,
|
|
qhindex: 0,
|
|
qhindex1: 0,
|
|
qhindex2: 0,
|
|
countNoPass: 0,
|
|
countPass: 0,
|
|
sum: 0,
|
|
qubu: [],
|
|
phb: [],
|
|
threenum: {},
|
|
zilist: [
|
|
{text: '日', unit: 'day'},
|
|
{text: '周', unit: 'week'},
|
|
{text: '月', unit: 'month'},
|
|
{text: '年', unit: 'year'},
|
|
|
|
],
|
|
carlist: [],
|
|
|
|
unit: 'day',
|
|
unit1: 'day',
|
|
unit2: 'day',
|
|
chartData: {},
|
|
//您可以通过修改 config-ucharts.js 文件中下标为 ['ring'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
|
|
|
|
// sdada
|
|
chartData1: {},
|
|
chartData2: {},
|
|
chartData3: {},
|
|
chartDataNum: {},
|
|
Amount: {},
|
|
dopts1: {
|
|
fontSize: 12,
|
|
|
|
color: ["#0D2E8D", "#3CBC6F", "#FF571A", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
|
|
padding: [15, 15, 0, 5],
|
|
touchMoveLimit: 24,
|
|
enableScroll: true,
|
|
legend: {},
|
|
xAxis: {
|
|
disableGrid: true,
|
|
scrollShow: true,
|
|
itemCount: 3,
|
|
fontSize: 10,
|
|
},
|
|
yAxis: {
|
|
data: [
|
|
{
|
|
min: 0,
|
|
max: 100,
|
|
unit: '%'
|
|
}
|
|
]
|
|
},
|
|
extra: {
|
|
column: {
|
|
type: "group",
|
|
width: 35,
|
|
activeBgColor: "#000000",
|
|
activeBgOpacity: 0.08
|
|
}
|
|
}
|
|
},
|
|
dopts: {
|
|
fontSize: 12,
|
|
|
|
color: ["#0D2E8D", "#3CBC6F", "#FF571A", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
|
|
padding: [15, 15, 0, 5],
|
|
touchMoveLimit: 24,
|
|
enableScroll: true,
|
|
legend: {},
|
|
xAxis: {
|
|
disableGrid: true,
|
|
scrollShow: true,
|
|
itemCount: 3,
|
|
fontSize: 10,
|
|
|
|
},
|
|
yAxis: {
|
|
data: [
|
|
{
|
|
min: 0
|
|
|
|
}
|
|
]
|
|
},
|
|
extra: {
|
|
column: {
|
|
type: "group",
|
|
width: 35,
|
|
activeBgColor: "#000000",
|
|
activeBgOpacity: 0.08
|
|
}
|
|
}
|
|
},
|
|
|
|
}
|
|
},
|
|
|
|
watch: {
|
|
range(newval) {
|
|
this.getfive()
|
|
},
|
|
ranges(newval) {
|
|
this.getfive()
|
|
},
|
|
},
|
|
onLoad() {
|
|
this.gettime()
|
|
this.partnerId = uni.getStorageSync('partnerId')
|
|
// this.getServerData();
|
|
this.getServerData1();
|
|
this.getServerData2();
|
|
this.getServerData3();
|
|
this.chartLineInspectionAmount()
|
|
this.chartLineInspectionNum()
|
|
this.getInspectionSku()
|
|
// this.sanxiang()
|
|
this.getfive()
|
|
},
|
|
onShow() {
|
|
// this.getstatisticsTop()
|
|
this.getstatisticsMid()
|
|
this.getgetPartnerList()
|
|
// this.getstatisticsZXT()
|
|
this.getstatisticsOrder()
|
|
},
|
|
methods: {
|
|
goCustomerDetail(remark) {
|
|
uni.navigateTo({
|
|
url: '/pages/statistics/statislist?id=1&remark=' + remark
|
|
})
|
|
},
|
|
gettime() {
|
|
// 获取当前时间
|
|
var now = new Date();
|
|
|
|
// 获取年份
|
|
var year = now.getFullYear();
|
|
|
|
// 获取月份
|
|
var month = now.getMonth() + 1; // 月份从 0 开始，需要加 1
|
|
if (month < 10) {
|
|
var month = "0" + month
|
|
}
|
|
|
|
// 获取日期
|
|
var date = now.getDate();
|
|
|
|
// 格式化时间
|
|
var currentTime = year + '-' + month + '-' + date
|
|
this.range[0] = currentTime
|
|
this.range[1] = currentTime
|
|
this.ranges[0] = currentTime
|
|
this.ranges[1] = currentTime
|
|
},
|
|
// 五条
|
|
async getfive() {
|
|
|
|
let data1 = {
|
|
startTime: this.range[0],
|
|
endTime: this.range[1]
|
|
}
|
|
let res1 = await request({
|
|
url: '/partnerOwn/partner/staticsTable1',
|
|
method: 'get',
|
|
params: data1
|
|
})
|
|
this.data1 = res1.data
|
|
// 2
|
|
let data2 = {
|
|
startTime: this.ranges[0],
|
|
endTime: this.ranges[1]
|
|
}
|
|
let res2 = await request({
|
|
url: '/partnerOwn/partner/staticsTable2',
|
|
method: 'get',
|
|
params: data2
|
|
})
|
|
this.data2 = res2.data
|
|
// 3
|
|
let data3 = {
|
|
startTime: '',
|
|
endTime: ''
|
|
}
|
|
let res3 = await request({
|
|
url: '/partnerOwn/partner/staticsTable3',
|
|
method: 'get',
|
|
params: data3
|
|
})
|
|
this.data3 = res3.data
|
|
// 4
|
|
let data4 = {
|
|
startTime: '',
|
|
endTime: ''
|
|
}
|
|
let res4 = await request({
|
|
url: '/partnerOwn/partner/staticsTable4',
|
|
method: 'get',
|
|
params: data4
|
|
})
|
|
this.data4 = res4.data
|
|
// 5
|
|
let data5 = {
|
|
startTime: '',
|
|
endTime: ''
|
|
}
|
|
let res5 = await request({
|
|
url: '/partnerOwn/partner/staticsTable5',
|
|
method: 'get',
|
|
params: data5
|
|
})
|
|
this.data5 = res5.data
|
|
|
|
},
|
|
//
|
|
goxiangqing(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/statistics/statislist?id=' + id
|
|
})
|
|
},
|
|
goOrderList() {
|
|
uni.navigateTo({
|
|
url: '/pages/index/ordermanage'
|
|
})
|
|
},
|
|
// 检测类型统计
|
|
getInspectionSku() {
|
|
let data = {
|
|
// partnerId: this.partnerId,
|
|
// unit: this.unit,
|
|
}
|
|
request({
|
|
url: '/partnerOwn/partner/queryInspectionSkuList',
|
|
method: 'get',
|
|
// params: data
|
|
}).then((res) => {
|
|
this.skuList = res.data
|
|
})
|
|
},
|
|
maskClick(e) {
|
|
},
|
|
// 折线图
|
|
async chartLineInspectionAmount() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
unit: this.unit,
|
|
}
|
|
let rex = await request({
|
|
url: '/partnerOwn/partner/chartLineInspectionAmount',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
let res = rex.data
|
|
|
|
this.Amount = JSON.parse(JSON.stringify(res));
|
|
|
|
},
|
|
// 折线图
|
|
async chartLineInspectionNum() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
unit: this.unit,
|
|
}
|
|
let rex = await request({
|
|
url: '/partnerOwn/partner/chartLineInspectionNum',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
let res = rex.data
|
|
|
|
this.chartDataNum = JSON.parse(JSON.stringify(res));
|
|
|
|
},
|
|
|
|
gbindex(index, unit) {
|
|
this.qhindex = index
|
|
this.unit = unit
|
|
this.getServerData1()
|
|
},
|
|
gbindex1(index, unit) {
|
|
this.qhindex1 = index
|
|
this.unit1 = unit
|
|
this.getServerData2()
|
|
},
|
|
gbindex2(index, unit) {
|
|
this.qhindex2 = index
|
|
this.unit2 = unit
|
|
this.getServerData3()
|
|
},
|
|
getback() {
|
|
uni.navigateBack()
|
|
},
|
|
xinxuanze(name) {
|
|
this.name = name
|
|
this.xling = false
|
|
this.getServerData1()
|
|
|
|
},
|
|
async sanxiang() {
|
|
let res = await request({
|
|
url: '/partnerOwn/partner/statisticsInfo?partnerId=' + this.partnerId,
|
|
method: 'get',
|
|
})
|
|
let nums = {
|
|
orderAmount: Math.trunc(res.data.orderAmount / 100),
|
|
orderNum: res.data.orderNum,
|
|
todayOrderAmount: res.data.todayOrderAmount / 100,
|
|
todayOrderNum: res.data.todayOrderNum,
|
|
workedNum: res.data.workedNum,
|
|
workingNum: res.data.workingNum
|
|
}
|
|
this.threenum = nums
|
|
},
|
|
async getstatisticsTop() {
|
|
let res = await request({
|
|
url: '/appInspection/order/statisticsTop',
|
|
method: 'get',
|
|
})
|
|
// this.chartData.series[0].data = res.data.list
|
|
},
|
|
async getstatisticsMid() {
|
|
let res = await request({
|
|
url: '/appInspection/order/statisticsMid',
|
|
method: 'get',
|
|
})
|
|
this.carlist = res.data
|
|
},
|
|
|
|
|
|
async getgetPartnerList() {
|
|
let data = {
|
|
partnerName: this.searchValue
|
|
}
|
|
let res = await request({
|
|
url: '/appInspection/order/getPartnerList',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
this.qubu = res.data
|
|
|
|
},
|
|
async getstatisticsZXT() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
type: this.value
|
|
}
|
|
let res = await request({
|
|
url: '/appInspection/order/statisticsZXT',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
|
|
},
|
|
async getstatisticsOrder() {
|
|
let res = await request({
|
|
url: '/appInspection/order/statisticsOrder',
|
|
method: 'get',
|
|
})
|
|
this.phb = res.data
|
|
|
|
},
|
|
// 123123
|
|
closexl(e) {
|
|
this.xling = false
|
|
|
|
},
|
|
openxl(e) {
|
|
},
|
|
|
|
// 金额
|
|
async getServerData1() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
unit: this.unit,
|
|
}
|
|
let rex = await request({
|
|
url: '/partnerOwn/partner/chartInfoAmount',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
let res = rex.data
|
|
|
|
this.chartData1 = JSON.parse(JSON.stringify(res));
|
|
|
|
},
|
|
// 数量
|
|
async getServerData2() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
unit: this.unit1,
|
|
}
|
|
let rex = await request({
|
|
url: '/partnerOwn/partner/chartInfoNum',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
let res = rex.data
|
|
|
|
this.chartData2 = JSON.parse(JSON.stringify(res));
|
|
|
|
},
|
|
// 合格率
|
|
async getServerData3() {
|
|
let data = {
|
|
partnerId: this.partnerId,
|
|
unit: this.unit2,
|
|
}
|
|
let rex = await request({
|
|
url: '/partnerOwn/partner/chartInfoRatio',
|
|
method: 'get',
|
|
params: data
|
|
})
|
|
let res = rex.data
|
|
|
|
this.chartData3 = JSON.parse(JSON.stringify(res));
|
|
|
|
},
|
|
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.content {
|
|
width: 100%;
|
|
height: calc(100vh);
|
|
background-color: #F6F6F6;
|
|
box-sizing: border-box;
|
|
// padding-top: 45px;
|
|
}
|
|
|
|
.ping-bottom {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding: 0px 15px;
|
|
}
|
|
|
|
.c-top {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
padding-top: 55px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
background-color: white;
|
|
}
|
|
|
|
.c-title {
|
|
font-size: 18px;
|
|
font-weight: bold
|
|
}
|
|
|
|
.ail {
|
|
width: 100%;
|
|
background-color: #F6F6F6;
|
|
box-sizing: border-box;
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
.top-box {
|
|
width: 95%;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
// padding: 18px;
|
|
background-color: white;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.cont-box {
|
|
width: 100%;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
padding: 18px;
|
|
background-color: white;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.charts-box {
|
|
width: 100%;
|
|
height: 300px;
|
|
}
|
|
|
|
.t-bottom {
|
|
width: 100%;
|
|
height: 130px;
|
|
border-top: 1px solid #EEEEEE;
|
|
box-sizing: border-box;
|
|
// padding: 20px;
|
|
}
|
|
|
|
.t-top {
|
|
width: 100%;
|
|
// height: 130px;
|
|
display: flex;
|
|
|
|
justify-content: center;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.sis {
|
|
width: 33%;
|
|
}
|
|
|
|
.dinga {
|
|
// margin-left: 25px;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sys {
|
|
width: 25%;
|
|
}
|
|
|
|
.sys2 {
|
|
width: 33%;
|
|
}
|
|
|
|
.t-title {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.t-num {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
color: #0D2E8D;
|
|
line-height: 26px;
|
|
margin: 5px auto;
|
|
}
|
|
|
|
.cont-title {
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
.charts-box {
|
|
width: 100%;
|
|
height: 300px;
|
|
}
|
|
|
|
.wrap-box {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.w-box {
|
|
width: 33%;
|
|
box-sizing: border-box;
|
|
text-align: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.imgicon {
|
|
width: 33px;
|
|
height: 28px;
|
|
margin: 0 auto;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.t-zhong {
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
margin: 3px auto;
|
|
}
|
|
|
|
.lanbnum {
|
|
font-size: 26px;
|
|
font-weight: bold;
|
|
color: #0D2E8D;
|
|
}
|
|
|
|
.b-title {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.b-zuo {
|
|
width: 20%;
|
|
}
|
|
|
|
.b-zhong {
|
|
text-align: left;
|
|
width: 60%;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.b-you {
|
|
width: 20%;
|
|
}
|
|
|
|
.touxiang {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
background-color: salmon;
|
|
overflow: hidden;
|
|
margin-right: 10px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.one {
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 50%;
|
|
background: #FEB947;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white;
|
|
|
|
}
|
|
|
|
.dis-t {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.lank {
|
|
width: 102px;
|
|
height: 27px;
|
|
border-radius: 14px;
|
|
border: 1px solid #0D2E8D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #0D2E8D;
|
|
}
|
|
|
|
.lan-you {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.yi {
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
line-height: 15px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.er {
|
|
width: 25px;
|
|
height: 25px;
|
|
background: #0D2E8D;
|
|
border-radius: 3px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white !important;
|
|
}
|
|
|
|
// ----------------------
|
|
.popup-box {
|
|
overflow: hidden;
|
|
border-radius: 8px;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
width: 100%;
|
|
background-color: white;
|
|
}
|
|
|
|
.sousuo {
|
|
width: 95%;
|
|
margin: 0 auto;
|
|
margin-left: 0px;
|
|
height: 30px;
|
|
background: #F0F0F0;
|
|
border-radius: 50px;
|
|
color: #999999;
|
|
box-sizing: border-box;
|
|
padding: 0 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
input {
|
|
width: 80%;
|
|
}
|
|
}
|
|
|
|
.list-box {
|
|
width: 100%;
|
|
height: 300px;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.list_scroll {
|
|
height: 100%; // 需设置高度
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
}
|
|
|
|
.list-qiu {
|
|
width: 95%;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
box-sizing: border-box;
|
|
padding: 10px 5px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.tel {
|
|
margin-left: 5px;
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
}
|
|
</style>
|