回测页面
parent
fe4b5e8c85
commit
d99bdbb3d0
|
|
@ -22,8 +22,8 @@
|
|||
default:'暂无内容'
|
||||
},
|
||||
currentType:{ // 暂无更多 icon 图标
|
||||
type:Number,
|
||||
default: 0
|
||||
type:String,
|
||||
default: '0'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
|
@ -33,7 +33,7 @@
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.nothing{position: fixed;top: 0;bottom: 0;left: 0;right: 0;display: flex;justify-content: center;align-items: center;}
|
||||
.nothing{position: fixed;top: 0;bottom: 0;left: 0;right: 0;display: flex;justify-content: center;align-items: center;z-index: -1;}
|
||||
.nothing-box{display: flex;justify-content: center;flex-direction: column;align-items: center;}
|
||||
.nothing-box .nothing-img{width: 470rpx;height: 270rpx;}
|
||||
.iconImg {font-size: 280rpx;color: #999999;}
|
||||
|
|
|
|||
|
|
@ -89,7 +89,6 @@ const request = (method, url, options) => {
|
|||
if(options!=undefined) params = options;
|
||||
// params.token = uni.getStorageSync('token');
|
||||
return new Promise((resolve, reject) => {
|
||||
console.log(hostapi,91);
|
||||
uni.request({
|
||||
url: `${hostapi}${url}`,
|
||||
method: methods,
|
||||
|
|
@ -124,7 +123,7 @@ const uploadFile = (url, options) => {
|
|||
return new Promise((resolve, reject) => {
|
||||
uni.uploadFile({
|
||||
url: `${hostapi}${url}`,
|
||||
filePath: tempData.file,
|
||||
filePath: tempData.form,
|
||||
name: 'image',
|
||||
fileType:'image',
|
||||
formData: tempData,
|
||||
|
|
|
|||
|
|
@ -1,487 +1,410 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<statusNav navBarTitle="故障统计"></statusNav>
|
||||
<view class="content">
|
||||
<statusNav navBarTitle="故障统计" returnColor="#c2c2c2"></statusNav>
|
||||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<view class="faultStatistics-nav">
|
||||
<view class="li" @click="navlistIndexFun(index)" :class="navlistIndex==index?'on':''"
|
||||
v-for="(item,index) in navlist">
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="settlement-type">
|
||||
<view class="settlement-type-title">结算类型</view>
|
||||
|
||||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<view class="faultStatistics-nav">
|
||||
<view class="li" @click="navlistIndexFun(index)" :class="navlistIndex==index?'on':''"
|
||||
v-for="(item,index) in navlist">
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="settlement-type">
|
||||
<view class="settlement-type-title">
|
||||
结算类型
|
||||
</view>
|
||||
<view class="settlement-type-content">
|
||||
<view class="li liB">
|
||||
<view class="text">单次收费</view>
|
||||
<view class="num">20</view>
|
||||
</view>
|
||||
|
||||
<view class="settlement-type-content">
|
||||
<view class="li liB">
|
||||
<view class="text">
|
||||
单次收费
|
||||
</view>
|
||||
<view class="num">
|
||||
20
|
||||
</view>
|
||||
</view>
|
||||
<view class="li liC">
|
||||
<view class="text">验收扫尾</view>
|
||||
<view class="num">3</view>
|
||||
</view>
|
||||
<view class="li liD">
|
||||
<view class="text">质保免费</view>
|
||||
<view class="num">46</view>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="text">包年签单</view>
|
||||
<view class="num">10</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fault-type">
|
||||
<view class="settlement-type-title">故障类型</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="ring" :chartData="chartData" background="none" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="brand-analysis">
|
||||
<view class="settlement-type-title">品牌分析</view>
|
||||
<view class="brand-analysis-box">
|
||||
<view class="li">
|
||||
<view class="serial-number">1</view>
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">海康威视</view>
|
||||
<view class="cor">10</view>
|
||||
<view class="cor1">23.3%</view>
|
||||
</view>
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,900)}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">2</view>
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">海康威视</view>
|
||||
<view class="cor">10</view>
|
||||
<view class="cor1">23.3%</view>
|
||||
</view>
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,900)}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">3</view>
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">海康威视</view>
|
||||
<view class="cor">10</view>
|
||||
<view class="cor1">23.3%</view>
|
||||
</view>
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,100)}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">4</view>
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">海康威视</view>
|
||||
<view class="cor">10</view>
|
||||
<view class="cor1">23.3%</view>
|
||||
</view>
|
||||
<view class="percentage">
|
||||
<view class="percentage-box percentage-box-ber"
|
||||
:style="{width:getPercentage(33,80)}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
|
||||
<view class="li liC">
|
||||
<view class="text">
|
||||
验收扫尾
|
||||
</view>
|
||||
<view class="num">
|
||||
3
|
||||
</view>
|
||||
</view>
|
||||
<view class="li liD">
|
||||
<view class="text">
|
||||
质保免费
|
||||
</view>
|
||||
<view class="num">
|
||||
46
|
||||
</view>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="text">
|
||||
包年签单
|
||||
</view>
|
||||
<view class="num">
|
||||
10
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fault-type">
|
||||
<view class="settlement-type-title">
|
||||
故障类型
|
||||
</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="ring" :chartData="chartData" background="none" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="brand-analysis">
|
||||
<view class="settlement-type-title">
|
||||
品牌分析
|
||||
</view>
|
||||
|
||||
<view class="brand-analysis-box">
|
||||
<view class="li">
|
||||
<view class="serial-number">
|
||||
1
|
||||
</view>
|
||||
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">
|
||||
海康威视
|
||||
</view>
|
||||
<view class="cor">
|
||||
10
|
||||
</view>
|
||||
<view class="cor1">
|
||||
23.3%
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,900)}">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">
|
||||
2
|
||||
</view>
|
||||
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">
|
||||
海康威视
|
||||
</view>
|
||||
<view class="cor">
|
||||
10
|
||||
</view>
|
||||
<view class="cor1">
|
||||
23.3%
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,900)}">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">
|
||||
3
|
||||
</view>
|
||||
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">
|
||||
海康威视
|
||||
</view>
|
||||
<view class="cor">
|
||||
10
|
||||
</view>
|
||||
<view class="cor1">
|
||||
23.3%
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="percentage">
|
||||
<view class="percentage-box" :style="{width:getPercentage(33,900)}">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
<view class="li">
|
||||
<view class="serial-number">
|
||||
4
|
||||
</view>
|
||||
|
||||
<view class="brand-analysis-center">
|
||||
<view class="title-box">
|
||||
<view class="title">
|
||||
海康威视
|
||||
</view>
|
||||
<view class="cor">
|
||||
10
|
||||
</view>
|
||||
<view class="cor1">
|
||||
23.3%
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="percentage">
|
||||
<view class="percentage-box percentage-box-ber" :style="{width:getPercentage(33,80)}">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="icon" src="../../static/iocn/xl.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view> </container-subgroup-two>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
|
||||
import statusNav from '../../components/status-nav.vue';
|
||||
export default {
|
||||
components: {
|
||||
statusNav,
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navlistIndex: 0,
|
||||
navlist: [{
|
||||
title: "全部",
|
||||
},
|
||||
import statusNav from '../../components/status-nav.vue';
|
||||
export default {
|
||||
components: {
|
||||
statusNav,
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navlistIndex: 0,
|
||||
navlist: [{
|
||||
title: "全部",
|
||||
},
|
||||
|
||||
{
|
||||
title: "按时间段",
|
||||
},
|
||||
{
|
||||
title: "昨日",
|
||||
},
|
||||
{
|
||||
title: "本周",
|
||||
},
|
||||
{
|
||||
title: "本月",
|
||||
},
|
||||
],
|
||||
{
|
||||
title: "按时间段",
|
||||
},
|
||||
{
|
||||
title: "昨日",
|
||||
},
|
||||
{
|
||||
title: "本周",
|
||||
},
|
||||
{
|
||||
title: "本月",
|
||||
},
|
||||
],
|
||||
|
||||
|
||||
chartData: {
|
||||
series: [{
|
||||
chartData: {
|
||||
series: [{
|
||||
|
||||
format: "tooltipDemo1",
|
||||
data: [{
|
||||
name: "网络故障",
|
||||
value: 50,
|
||||
style: "straight",
|
||||
color: "#7F90A4"
|
||||
},
|
||||
{
|
||||
name: "模组故障",
|
||||
value: 30,
|
||||
style: "straight",
|
||||
color: "#67E0FF",
|
||||
style: "straight",
|
||||
},
|
||||
{
|
||||
name: "网络错误",
|
||||
value: 20,
|
||||
style: "straight",
|
||||
color: "#2D8DFE"
|
||||
},
|
||||
{
|
||||
name: "信息错误",
|
||||
value: 18,
|
||||
color: "#44D2C1",
|
||||
style: "straight",
|
||||
},
|
||||
{
|
||||
name: "供电不足",
|
||||
value: 8,
|
||||
style: "straight",
|
||||
color: "#F47936"
|
||||
}
|
||||
]
|
||||
}]
|
||||
},
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
console.log(this.getPercentage(33, 66))
|
||||
},
|
||||
methods: {
|
||||
navlistIndexFun(index) {
|
||||
this.navlistIndex = index
|
||||
},
|
||||
getPercentage(num, max) {
|
||||
return Math.ceil(((num - 0) / (max - 0)) * 100) + "%"
|
||||
}
|
||||
format: "tooltipDemo1",
|
||||
data: [{
|
||||
name: "网络故障",
|
||||
value: 50,
|
||||
style: "straight",
|
||||
color: "#7F90A4"
|
||||
},
|
||||
{
|
||||
name: "模组故障",
|
||||
value: 30,
|
||||
style: "straight",
|
||||
color: "#67E0FF",
|
||||
style: "straight",
|
||||
},
|
||||
{
|
||||
name: "网络错误",
|
||||
value: 20,
|
||||
style: "straight",
|
||||
color: "#2D8DFE"
|
||||
},
|
||||
{
|
||||
name: "信息错误",
|
||||
value: 18,
|
||||
color: "#44D2C1",
|
||||
style: "straight",
|
||||
},
|
||||
{
|
||||
name: "供电不足",
|
||||
value: 8,
|
||||
style: "straight",
|
||||
color: "#F47936"
|
||||
}
|
||||
]
|
||||
}]
|
||||
},
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
console.log(this.getPercentage(33, 66))
|
||||
},
|
||||
methods: {
|
||||
navlistIndexFun(index) {
|
||||
this.navlistIndex = index
|
||||
},
|
||||
getPercentage(num, max) {
|
||||
return Math.ceil(((num - 0) / (max - 0)) * 100) + "%"
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
padding: 0rpx 15rpx;
|
||||
}
|
||||
.content {
|
||||
padding: 0rpx 15rpx;
|
||||
}
|
||||
|
||||
|
||||
.faultStatistics-nav {
|
||||
display: flex;
|
||||
font-size: 30rpx;
|
||||
margin-top: 25rpx;
|
||||
color: #958b8b;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.faultStatistics-nav {
|
||||
display: flex;
|
||||
font-size: 30rpx;
|
||||
margin-top: 25rpx;
|
||||
color: #958b8b;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.faultStatistics-nav .li {
|
||||
padding: 8rpx 13rpx;
|
||||
box-sizing: border-box;
|
||||
border: 2rpx solid #F5F5F5;
|
||||
}
|
||||
.faultStatistics-nav .li {
|
||||
padding: 8rpx 13rpx;
|
||||
box-sizing: border-box;
|
||||
border: 2rpx solid #F5F5F5;
|
||||
}
|
||||
|
||||
.faultStatistics-nav .on {
|
||||
color: #FF5400;
|
||||
border: 2rpx solid #FF5400;
|
||||
border-radius: 15rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.faultStatistics-nav .on {
|
||||
color: #FF5400;
|
||||
border: 2rpx solid #FF5400;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.settlement-type {
|
||||
width: 100%;
|
||||
border-radius: 25rpx;
|
||||
height: 400rpx;
|
||||
margin-top: 29rpx;
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.settlement-type {
|
||||
width: 100%;
|
||||
border-radius: 25rpx;
|
||||
height: 400rpx;
|
||||
margin-top: 29rpx;
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.settlement-type-title {
|
||||
font-size: 32rpx;
|
||||
color: #2c2c2c;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
.settlement-type-title {
|
||||
font-size: 32rpx;
|
||||
color: #2c2c2c;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.settlement-type-title::before {
|
||||
content: "";
|
||||
margin-right: 22rpx;
|
||||
width: 6rpx;
|
||||
display: block;
|
||||
height: 32rpx;
|
||||
border-radius: 50rpx;
|
||||
background: linear-gradient(#307ade, #08adf8)
|
||||
}
|
||||
.settlement-type-title::before {
|
||||
content: "";
|
||||
margin-right: 22rpx;
|
||||
width: 6rpx;
|
||||
display: block;
|
||||
height: 32rpx;
|
||||
border-radius: 50rpx;
|
||||
background: linear-gradient(#307ade, #08adf8)
|
||||
}
|
||||
|
||||
.settlement-type-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.settlement-type-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.settlement-type-content .li {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
padding-bottom: 20rpx;
|
||||
padding-top: 26rpx;
|
||||
position: relative;
|
||||
}
|
||||
.settlement-type-content .li {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
padding-bottom: 20rpx;
|
||||
padding-top: 26rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.settlement-type-content .li .text {
|
||||
color: #888888;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
.settlement-type-content .li .text {
|
||||
color: #888888;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
|
||||
.settlement-type-content .li .num {
|
||||
color: #0ba9f8;
|
||||
font-size: 46rpx;
|
||||
.settlement-type-content .li .num {
|
||||
color: #0ba9f8;
|
||||
font-size: 46rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.settlement-type-content .liB::after {
|
||||
content: "";
|
||||
width: 2rpx;
|
||||
height: 88rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: 0rpx;
|
||||
}
|
||||
.settlement-type-content .liB::after {
|
||||
content: "";
|
||||
width: 2rpx;
|
||||
height: 88rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: 0rpx;
|
||||
}
|
||||
|
||||
.settlement-type-content .liB::before {
|
||||
content: "";
|
||||
width: 245rpx;
|
||||
height: 2rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -123rpx;
|
||||
bottom: 0rpx;
|
||||
}
|
||||
.settlement-type-content .liB::before {
|
||||
content: "";
|
||||
width: 245rpx;
|
||||
height: 2rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -123rpx;
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
.settlement-type-content .liC::before {
|
||||
content: "";
|
||||
width: 245rpx;
|
||||
height: 2rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -123rpx;
|
||||
bottom: 0rpx;
|
||||
}
|
||||
.settlement-type-content .liC::before {
|
||||
content: "";
|
||||
width: 245rpx;
|
||||
height: 2rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -123rpx;
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
.settlement-type-content .liD::before {
|
||||
content: "";
|
||||
width: 2rpx;
|
||||
height: 88rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
margin-left: -123rpx;
|
||||
bottom: 10rpx;
|
||||
}
|
||||
.settlement-type-content .liD::before {
|
||||
content: "";
|
||||
width: 2rpx;
|
||||
height: 88rpx;
|
||||
background-color: #E5E5E5;
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
margin-left: -123rpx;
|
||||
bottom: 10rpx;
|
||||
}
|
||||
|
||||
.fault-type {
|
||||
width: 100%;
|
||||
padding: 24rpx 21rpx;
|
||||
box-sizing: border-box;
|
||||
height: 500rpx;
|
||||
border-radius: 15rpx;
|
||||
margin-top: 30rpx;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.fault-type {
|
||||
width: 100%;
|
||||
padding: 24rpx 21rpx;
|
||||
box-sizing: border-box;
|
||||
height: 500rpx;
|
||||
border-radius: 15rpx;
|
||||
margin-top: 30rpx;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.charts-box {
|
||||
margin: auto;
|
||||
margin-top: 50rpx;
|
||||
width: 100%;
|
||||
height: 330rpx;
|
||||
}
|
||||
.charts-box {
|
||||
margin: auto;
|
||||
margin-top: 50rpx;
|
||||
width: 100%;
|
||||
height: 330rpx;
|
||||
}
|
||||
|
||||
.brand-analysis {
|
||||
padding: 24rpx 21rpx;
|
||||
background-color: #FFFFFF;
|
||||
width: 100%;
|
||||
border-radius: 15rpx;
|
||||
padding-bottom: 120rpx;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
box-sizing: border-box;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.brand-analysis {
|
||||
padding: 24rpx 21rpx;
|
||||
background-color: #FFFFFF;
|
||||
width: 100%;
|
||||
border-radius: 15rpx;
|
||||
padding-bottom: 120rpx;
|
||||
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||
box-sizing: border-box;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.brand-analysis-box .li {
|
||||
border-bottom: 2rpx solid #EEEEEE;
|
||||
padding: 27rpx 0rpx;
|
||||
padding-left: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.brand-analysis-box .li {
|
||||
border-bottom: 2rpx solid #EEEEEE;
|
||||
padding: 27rpx 0rpx;
|
||||
padding-left: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.brand-analysis-box .li .serial-number {
|
||||
color: #958b8b;
|
||||
font-size: 28rpx;
|
||||
margin-right: 34rpx;
|
||||
}
|
||||
.brand-analysis-box .li .serial-number {
|
||||
color: #958b8b;
|
||||
font-size: 28rpx;
|
||||
margin-right: 34rpx;
|
||||
}
|
||||
|
||||
.brand-analysis-center {
|
||||
flex: 1;
|
||||
}
|
||||
.brand-analysis-center {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.brand-analysis-center .title-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
font-size: 24rpx
|
||||
}
|
||||
.brand-analysis-center .title-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
font-size: 24rpx
|
||||
}
|
||||
|
||||
.brand-analysis-center .title-box .title {
|
||||
color: #333333;
|
||||
font-size: 26rpx
|
||||
}
|
||||
.brand-analysis-center .title-box .title {
|
||||
color: #333333;
|
||||
font-size: 26rpx
|
||||
}
|
||||
|
||||
.cor {
|
||||
color: #2d8dfe;
|
||||
}
|
||||
.cor {
|
||||
color: #2d8dfe;
|
||||
}
|
||||
|
||||
.cor1 {
|
||||
color: #999999;
|
||||
}
|
||||
.cor1 {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.percentage {
|
||||
width: 100%;
|
||||
margin-top: 11rpx;
|
||||
background-color: #EDEDED;
|
||||
height: 20rpx;
|
||||
border-radius: 25rpx;
|
||||
}
|
||||
.percentage {
|
||||
width: 100%;
|
||||
margin-top: 11rpx;
|
||||
background-color: #EDEDED;
|
||||
height: 20rpx;
|
||||
border-radius: 25rpx;
|
||||
}
|
||||
|
||||
.brand-analysis-box .icon {
|
||||
width: 16rpx;
|
||||
height: 31rpx;
|
||||
margin-left: 37rpx;
|
||||
}
|
||||
.brand-analysis-box .icon {
|
||||
width: 16rpx;
|
||||
height: 31rpx;
|
||||
margin-left: 37rpx;
|
||||
}
|
||||
|
||||
.percentage-box {
|
||||
height: 100%;
|
||||
background-color: #2d8efd;
|
||||
border-radius: 25rpx;
|
||||
}
|
||||
.percentage-box {
|
||||
height: 100%;
|
||||
background-color: #2d8efd;
|
||||
border-radius: 25rpx;
|
||||
}
|
||||
|
||||
.percentage-box-ber {
|
||||
background-color: #ffb503;
|
||||
}
|
||||
.percentage-box-ber {
|
||||
background-color: #ffb503;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -237,7 +237,7 @@
|
|||
|
||||
<view class="data-icon">
|
||||
<view class="settlement-type-title">
|
||||
年度项目数据明细
|
||||
年度服务数据汇总
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="charts-box">
|
||||
|
|
|
|||
|
|
@ -1,83 +1,68 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view>
|
||||
<statusNav returnColor="#c2c2c2" navBarTitle="人员状态"></statusNav>
|
||||
<view class="peopleManagement-input">
|
||||
<input type="text" class="int" value="" placeholder="请输入关键字" />
|
||||
<image class="search" src="../../static/iocn/ss.png" mode=""></image>
|
||||
<view class="xian">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="peopleManagement-content">
|
||||
<view class="li" v-for="(item,index) in dataList">
|
||||
<view class="head">
|
||||
<view class="name" @click="listStateFun(item)">
|
||||
<view class="icon" v-if="item.state">
|
||||
|
||||
</view>
|
||||
<image class="iconImg" v-else src="../../static/iocn/pxz.png" mode=""></image>
|
||||
<view class="">
|
||||
{{item.title}}<text class="cor" v-if="item.isJob">(正在作业)</text>
|
||||
<text class="cor1" v-else>(空闲中)</text>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="state">
|
||||
已审核
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="con">
|
||||
<image class="img" src="../../static/del/500478055.png" mode=""></image>
|
||||
|
||||
<view class="text scal09">
|
||||
<view class="code">
|
||||
<view class="">
|
||||
编号: YG20211207-001
|
||||
</view>
|
||||
<view class="iconCon">
|
||||
<view v-for="(item,index) in 5">
|
||||
<image class="icon" v-if="index<=2" src="../../static/iocn/6.png" ></image>
|
||||
<image class="icon" v-else src="../../static/iocn/7.png" ></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="p">
|
||||
<view class="one">
|
||||
待处理：1单
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
已处理：1305单
|
||||
</view>
|
||||
</view>
|
||||
<view class="address">
|
||||
当前定位：湖南省株洲市xxxxxxxx小区1栋202室
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="bottom-content">
|
||||
联系电话： <text class="cor3">157xxxx8279</text>
|
||||
</view>
|
||||
<view class="bottom-content">
|
||||
注册时间： <text class="cor3">2018-12-12</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<button class="submit-button" type="default">派发工单</button>
|
||||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: -30rpx;">
|
||||
<view class="peopleManagement-input">
|
||||
<input type="text" class="int" value="" placeholder="请输入关键字" placeholder-style="color:#999999;" />
|
||||
<image class="search" src="../../static/iocn/ss.png" mode=""></image>
|
||||
<view class="xian"></view>
|
||||
</view>
|
||||
<view class="peopleManagement-content">
|
||||
<view class="li" v-for="(item,index) in dataList">
|
||||
<view class="head">
|
||||
<view class="name" @click="listStateFun(item)">
|
||||
<view class="icon" v-if="item.state"></view>
|
||||
<image class="iconImg" v-else src="../../static/iocn/pxz.png" mode=""></image>
|
||||
<view class="">
|
||||
{{item.title}}<text class="cor" v-if="item.isJob">(正在作业)</text>
|
||||
<text class="cor1" v-else>(空闲中)</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="state">已审核</view>
|
||||
</view>
|
||||
<view class="con">
|
||||
<image class="img" src="../../static/del/500478055.png" mode=""></image>
|
||||
<view class="text scal09">
|
||||
<view class="code">
|
||||
<view class="">编号: YG20211207-001</view>
|
||||
<view class="iconCon">
|
||||
<view v-for="(item,index) in 5">
|
||||
<image class="icon" v-if="index<=2" src="../../static/iocn/6.png" ></image>
|
||||
<image class="icon" v-else src="../../static/iocn/7.png" ></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="p">
|
||||
<view class="one">待处理：1单 </view>
|
||||
<view class="">已处理：1305单 </view>
|
||||
</view>
|
||||
<view class="address">当前定位：湖南省株洲市xxxxxxxx小区1栋202室</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="bottom-content">
|
||||
联系电话： <text class="cor3">157xxxx8279</text>
|
||||
</view>
|
||||
<view class="bottom-content">
|
||||
注册时间： <text class="cor3">2018-12-12</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<button class="submit-button" type="default">派发工单</button>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import statusNav from '../../components/status-nav.vue';
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
export default {
|
||||
components: {
|
||||
statusNav,
|
||||
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -114,10 +99,6 @@
|
|||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
padding-top: 80rpx;
|
||||
padding-bottom: 80rpx;
|
||||
}
|
||||
.submit-button {
|
||||
width: 686rpx;
|
||||
border-radius: 50rpx;
|
||||
|
|
@ -144,6 +125,7 @@
|
|||
height: 67rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 36rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.peopleManagement-input .xian {
|
||||
width: 3rpx;
|
||||
|
|
@ -224,9 +206,9 @@
|
|||
}
|
||||
|
||||
.peopleManagement-content .li .con .img {
|
||||
width: 129rpx;
|
||||
height: 114rpx;
|
||||
margin-right: 16rpx;
|
||||
width: 140rpx;
|
||||
height: 130rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.peopleManagement-content .li .con .text {
|
||||
|
|
@ -242,6 +224,7 @@
|
|||
.peopleManagement-content .li .con .text .icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.peopleManagement-content .li .con .text .code {
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<view id="swi1">
|
||||
<view class="work-order-from">
|
||||
<view class="state" :style="{backgroundColor: statusColor}">状态：{{statusText}}</view>
|
||||
<view class="li">
|
||||
<view class="li" style="margin-top: 20rpx;">
|
||||
<view class="title">工单编号：</view>
|
||||
<input type="text" disabled class="input" placeholder="" value="GD20211203-001" />
|
||||
</view>
|
||||
|
|
@ -85,7 +85,7 @@
|
|||
<view id="swi2">
|
||||
<view class="work-order-from">
|
||||
<view class="state" :style="{backgroundColor: statusColor}">状态：{{statusText}}</view>
|
||||
<view class="li">
|
||||
<view class="li" style="margin-top: 20rpx;">
|
||||
<view class="title">开始时间：</view>
|
||||
<input type="text" disabled class="input " placeholder="" value="2022-01-25 09:39" />
|
||||
</view>
|
||||
|
|
@ -116,13 +116,13 @@
|
|||
<view class="icon " :class="isrideo?'on':''">
|
||||
<view class="icon-content"></view>
|
||||
</view>
|
||||
<view class="">是</view>
|
||||
<view class="fon24" style="color: #8b8b8b;">是</view>
|
||||
</view>
|
||||
<view class="isrideo">
|
||||
<view class="icon" :class="isrideo?'':'on'">
|
||||
<view class="icon-content"></view>
|
||||
</view>
|
||||
<view class="">否</view>
|
||||
<view class="fon24" style="color: #8b8b8b;">否</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -218,8 +218,8 @@
|
|||
<view class="record-content">
|
||||
<view class="title">过程追踪</view>
|
||||
<view class="list">
|
||||
<view class="li pad-z40 fon27 col9" :class="index==0 ? 'activeTrack' : ''" v-for="(item,index) in 10" :key="index">
|
||||
<view class="disac fw line-h60">
|
||||
<view class="li pad-z40 fon27 col9 pad-x20" :class="index==0 ? 'activeTrack' : ''" v-for="(item,index) in 10" :key="index">
|
||||
<view class="disac fw line-h40">
|
||||
<view class="text">“部分模组不显示”故障【陈志远】已处理。</view>
|
||||
<view class="date">2020-05-15 16:00</view>
|
||||
</view>
|
||||
|
|
@ -400,7 +400,7 @@
|
|||
font-size: 26rpx;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
/* flex: 1; */
|
||||
}
|
||||
|
||||
.work-order-from .li .input {
|
||||
|
|
@ -488,11 +488,11 @@ flex: 1;
|
|||
|
||||
.course-nav .code .btn {
|
||||
background-color: #eeeeee;
|
||||
width: 73rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 10rpx;
|
||||
text-align: center;
|
||||
line-height: 40rpx;
|
||||
padding: 4rpx 20rpx;
|
||||
margin-left: 28rpx;
|
||||
border: solid #999999 2rpx;
|
||||
}
|
||||
|
|
@ -509,12 +509,6 @@ flex: 1;
|
|||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.record-content .title {
|
||||
color: #333333;
|
||||
margin-left: 12rpx;
|
||||
font-size: 30rpx;
|
||||
margin-bottom: 33rpx;
|
||||
}
|
||||
|
||||
.record-content .list .li {
|
||||
display: flex;
|
||||
|
|
@ -717,8 +711,8 @@ flex: 1;
|
|||
|
||||
.record-content .title {
|
||||
color: #333333;
|
||||
margin-left: 12rpx;
|
||||
font-size: 30rpx;
|
||||
margin-left: -10rpx;
|
||||
font-size: 36rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
|
|
@ -763,9 +757,9 @@ flex: 1;
|
|||
background-color: #999999;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.record-content .list .activeTrack .line-h60 {
|
||||
margin-top: -26rpx;
|
||||
margin-bottom: 20rpx;
|
||||
.record-content .list .activeTrack .line-h40 {
|
||||
margin-top: -20rpx;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
.record-content .list .date {
|
||||
margin-left: 20rpx;
|
||||
|
|
|
|||
|
|
@ -5,41 +5,41 @@
|
|||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: -25rpx -25rpx -0rpx;">
|
||||
<view class="project-list-input" :style="{top:statusBarHeight + 'px'}">
|
||||
<input type="text" @keydown.enter="getDatalist()" class="int" v-model="dataPage.keyword" value="" placeholder="请输入关键字" />
|
||||
<image @click="getDatalist()" class="search" src="../../static/iocn/ss.png" mode=""></image>
|
||||
<input type="text" @keydown.enter="getDatalist" @confirm="getDatalist" class="int" v-model="dataPage.keyword" value="" placeholder="请输入关键字" />
|
||||
<image @click="getDatalist" class="search" src="../../static/iocn/ss.png" mode=""></image>
|
||||
<view class="xian"></view>
|
||||
</view>
|
||||
<view class="screen">
|
||||
<!-- 筛选状态查询、日期查询 -->
|
||||
<picker @change="bindPickerChange" :value="workeOrderStatusIndex" :range="array" :range-key="'name'">
|
||||
<picker class="width30 disjcac" @change="bindPickerChange" :value="workeOrderStatusIndex" :range="array" :range-key="'name'">
|
||||
<view class="li">
|
||||
<view class="text" v-if="workeOrderStatus!=''">{{workeOrderStatus}}</view>
|
||||
<view class="text" v-else>{{array[workeOrderStatusIndex].name}}</view>
|
||||
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</picker>
|
||||
<picker mode="date" :value="date" @change="bindDateChange">
|
||||
<picker class="width30 disjcac" mode="date" :value="date" @change="bindDateChange">
|
||||
<view class="li">
|
||||
<view class="text">工单日期</view>
|
||||
<view class="text" v-if="dataPage.order_times==''">工单日期</view>
|
||||
<view class="text" v-else>{{dataPage.order_times}}</view>
|
||||
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</picker>
|
||||
<view class="li">
|
||||
<view class="li width30 disjcac">
|
||||
<view class="text">筛选</view>
|
||||
<image class="imgA" src="../../static/iocn/sx.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="project-list">
|
||||
<!-- 列表循环体 -->
|
||||
<view class="li" @click="projectDetailsFun(item.status,item.id,item.statusText,item.backgroundColor)" v-for="(item,index) in dataList" :key="index">
|
||||
<view class="li" @click="projectDetailsFun(item.order_status,item.order_id,item.statusText,item.backgroundColor)" v-for="(item,index) in dataList" :key="index">
|
||||
<view class="work-order-code">工单编号：{{item.order_number}}</view>
|
||||
<view class="message">
|
||||
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
|
||||
<view class="text">
|
||||
<view class="title">
|
||||
<view class="text clips1">{{item.project_name}}</view>
|
||||
<view class="icon" :style="{backgroundColor: item.attributes.color}">{{item.attributes.text
|
||||
}}</view>
|
||||
<view class="icon" :style="{backgroundColor: item.attributes.color}">{{item.attributes.text}}</view>
|
||||
</view>
|
||||
<view class="disjb fc" style="margin-left: -20rpx;height: 70%;">
|
||||
<view class="serial-number scal09">
|
||||
|
|
@ -66,6 +66,7 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nothing-page v-if="total==dataList.length" content="暂无更多列表数据" currentType="0"></nothing-page>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
|
||||
|
|
@ -98,14 +99,12 @@
|
|||
dataPage:{
|
||||
list_rows:10,
|
||||
page:1,
|
||||
// order_status:"",
|
||||
// order_times:"",
|
||||
// keyword:""
|
||||
order_status:"",
|
||||
order_times:"",
|
||||
keyword:""
|
||||
},
|
||||
dataList:[
|
||||
|
||||
]
|
||||
|
||||
total:0,
|
||||
dataList:[]
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
|
|
@ -127,21 +126,16 @@
|
|||
this.workeOrderStatusIndex = this.array.findIndex(item=>item.id==option.status);
|
||||
if(this.workeOrderStatusIndex!=-1) this.workeOrderStatus = '';
|
||||
}
|
||||
|
||||
this.getDatalist();
|
||||
} else {
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取工单列表
|
||||
getDatalist(){
|
||||
this.$requst.get('/universal/api.order/order_list',this.dataPage).then(res => {
|
||||
// this.$toolAll.tools.showToast(res.msg);
|
||||
if (res.code) {
|
||||
this.dataList = res.data.data
|
||||
} else if(res.code == 0){
|
||||
this.dataList = res.data.data
|
||||
this.total = res.data.total;
|
||||
this.dataList = res.data.data;
|
||||
}
|
||||
})
|
||||
},
|
||||
|
|
@ -187,9 +181,7 @@
|
|||
},
|
||||
bindDateChange(date) {
|
||||
this.dataPage.order_times=date.detail.value
|
||||
|
||||
this.getDatalist()
|
||||
|
||||
this.getDatalist()
|
||||
},
|
||||
getDate(type) {
|
||||
const date = new Date();
|
||||
|
|
|
|||
|
|
@ -27,6 +27,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
const app = getApp();
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -44,14 +45,18 @@
|
|||
},
|
||||
methods: {
|
||||
getEletronic(){
|
||||
|
||||
this.$requst.get('/universal/api.user/electronic_badge').then(res=>{
|
||||
if(res.code==1){
|
||||
this.userId=res.data.id
|
||||
this.userName=res.data.name
|
||||
this.userPhone=res.data.phone
|
||||
this.userEmail=res.data.email
|
||||
this.website=res.data.website
|
||||
if(res.code){
|
||||
let userData = res.data;
|
||||
if(userData.avatar) {
|
||||
this.userImg = app.globalData.hostapi + '/' + userData.avatar;
|
||||
}
|
||||
this.userId = userData.id;
|
||||
this.userName = userData.name;
|
||||
this.userContent = userData.affiliation;
|
||||
this.userPhone = userData.phone;
|
||||
this.userEmail = userData.email;
|
||||
this.website = userData.website;
|
||||
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -87,6 +87,14 @@
|
|||
sourceType:['album','camera'],
|
||||
sizeType:['compressed'],
|
||||
success: (res) => {
|
||||
let params = {
|
||||
dir:'images',
|
||||
from:res.tempFilePaths[0]
|
||||
}
|
||||
console.log(params,95);
|
||||
this.$requst.post('/universal/api.upload/upload',params).then(res=>{
|
||||
|
||||
})
|
||||
this.imgList[index].imgsrc = res.tempFilePaths[0];
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue