master
tangyi 2022-03-25 18:33:33 +08:00
parent 6caa02508a
commit 3bbd8c3701
14 changed files with 2552 additions and 2448 deletions

View File

@ -1,345 +1,346 @@
<template>
<view class="content">
<statusNav navBarTitle="项目详情"></statusNav>
<view class="head-top">
<view class="details-head">
<view class="swiper-head">
<swiper class="swiper" @change="changeAutoplay" :autoplay="autoplay" :interval="interval"
>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
</swiper>
<view class="indication-point ">
{{index}}/3
</view>
</view>
<view class="title">
湖南工业大学生化学院会议室P2.5全彩LED显示屏
</view>
<view class="code">
XM20220108-1001
</view>
<view class="address">
<image class="img" src="../../static/iocn/im.png" mode=""></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
</view>
<view class="last-date">
<view class="last-date-content">
<image class="icon" src="../../static/iocn/gzzt.png" mode=""></image>
<view class="text">
最近一次故障时间2021-11-18 170016
</view>
</view>
</view>
</view>
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目概况
</view>
</view>
<view class="project-message-content">
<view class="li">
<view class="title-one">
客户名称
</view>
<view class="text">
上海弘焱电子科技有限公司
</view>
</view>
<view class="li">
<view class="title-one">
竣工日期
</view>
<view class="text">
2022/2/26
</view>
</view>
<view class="li">
<view class="title-one">
质保年限
</view>
<view class="text">
1
</view>
</view>
<view class="li">
<view class="title-one">
产品品类
</view>
<view class="text">
单色LED屏
</view>
</view>
<view class="li">
<view class="title-one">
品牌
</view>
<view class="text">
海康威视
</view>
</view>
<view class="li">
<view class="title-one">
维保次数
</view>
<view class="text">
4
</view>
</view>
<view class="li">
<view class="title">
规格型号
</view>
<view class="text">
DS-CK15FI
</view>
</view>
<view class="li">
<view class="title">
尺寸
</view>
<view class="text">
4.57m*2.88m
</view>
</view>
<view class="li">
<view class="title">
合同类型
</view>
<view class="text">
制作安装
</view>
</view>
<view class="li">
<view class="title">
合同开始
</view>
<view class="text">
2021/02/26
</view>
</view>
<view class="li">
<view class="title">
合同结束
</view>
<view class="text">
2021/02/2
</view>
</view>
<view class="li">
<view class="title">
应用场景 </view>
<view class="text">
会议室
</view>
</view>
<view class="li">
<view class="title">
安装位置
</view>
<view class="text">
地下负二层总控电机室
</view>
</view>
</view>
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目材料
</view>
</view>
<view class="project-materials-content">
<view class="project-materials-title">
<view class="text">
名称
</view>
<view class="text">
品牌
</view>
<view class="text">
型号
</view>
<view class="text">
批次
</view>
<view class="text">
尺寸
</view>
<view class="text">
数量
</view>
</view>
<view class="project-materials-text">
<view class="text">
接收卡
</view>
<view class="text">
卡莱特
<statusNav navBarTitle="项目详情"></statusNav>
<container-subgroup-two>
<view slot="content" style="margin: 0 -30rpx;">
<view class="head-top">
<view class="details-head">
<view class="swiper-head">
<swiper class="swiper" @change="changeAutoplay" :autoplay="autoplay" :interval="interval">
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
</swiper>
<view class="indication-point ">
{{index}}/3
</view>
</view>
<view class="title">
湖南工业大学生化学院会议室P2.5全彩LED显示屏
</view>
<view class="code">
XM20220108-1001
</view>
<view class="address">
<image class="img" src="../../static/iocn/im.png" mode=""></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
</view>
<view class="last-date">
<view class="last-date-content">
<image class="icon" src="../../static/iocn/gzzt.png" mode=""></image>
<view class="text">
最近一次故障时间2021-11-18 170016
</view>
</view>
</view>
</view>
<view class="text">
5A-75E
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目概况
</view>
</view>
<view class="text">
1033876
<view class="project-message-content">
<view class="li">
<view class="title-one">
客户名称
</view>
<view class="text">
上海弘焱电子科技有限公司
</view>
</view>
<view class="li">
<view class="title-one">
竣工日期
</view>
<view class="text">
2022/2/26
</view>
</view>
<view class="li">
<view class="title-one">
质保年限
</view>
<view class="text">
1
</view>
</view>
<view class="li">
<view class="title-one">
产品品类
</view>
<view class="text">
单色LED屏
</view>
</view>
<view class="li">
<view class="title-one">
品牌
</view>
<view class="text">
海康威视
</view>
</view>
<view class="li">
<view class="title-one">
维保次数
</view>
<view class="text">
4
</view>
</view>
<view class="li">
<view class="title">
规格型号
</view>
<view class="text">
DS-CK15FI
</view>
</view>
<view class="li">
<view class="title">
尺寸
</view>
<view class="text">
4.57m*2.88m
</view>
</view>
<view class="li">
<view class="title">
合同类型
</view>
<view class="text">
制作安装
</view>
</view>
<view class="li">
<view class="title">
合同开始
</view>
<view class="text">
2021/02/26
</view>
</view>
<view class="li">
<view class="title">
合同结束
</view>
<view class="text">
2021/02/2
</view>
</view>
<view class="li">
<view class="title">
应用场景 </view>
<view class="text">
会议室
</view>
</view>
<view class="li">
<view class="title">
安装位置
</view>
<view class="text">
地下负二层总控电机室
</view>
</view>
</view>
<view class="text">
*
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目材料
</view>
</view>
<view class="text">
1
<view class="project-materials-content">
<view class="project-materials-title">
<view class="text">
名称
</view>
<view class="text">
品牌
</view>
<view class="text">
型号
</view>
<view class="text">
批次
</view>
<view class="text">
尺寸
</view>
<view class="text">
数量
</view>
</view>
<view class="project-materials-text">
<view class="text">
接收卡
</view>
<view class="text">
卡莱特
</view>
<view class="text">
5A-75E
</view>
<view class="text">
1033876
</view>
<view class="text">
*
</view>
<view class="text">
1
</view>
</view>
</view>
</view>
</view>
<view class="record-nav">
<view class="li" @click="recordNav(index)" :class="item.state?'on':''" v-for="(item,index) in recordState">
{{item.title}}
</view>
</view>
<view class="record-nav">
<view class="li" @click="recordNav(index)" :class="item.state?'on':''" v-for="(item,index) in recordState">
{{item.title}}
</view>
</view>
<view class="record-content">
<view class="title">
维修追踪
</view>
<view class="list">
<view class="li on">
<view class="icon">
<view class="icon-con">
</view>
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
</view>
</view>
</view>
</container-subgroup-two>
<view class="record-content">
<view class="title">
维修追踪
</view>
<view class="list">
<view class="li on">
<view class="icon">
<view class="icon-con">
</view>
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text clips1">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import statusNav from "../../components/status-nav.vue"
export default {
components:{
statusNav
},
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import statusNav from "../../components/status-nav.vue"
export default {
components: {
statusNav,
containerSubgroupTwo
},
data() {
return {
autoplay: true,
@ -382,7 +383,7 @@
.content {
padding: 16rpx 0;
padding-top: 100rpx;
}
.swiper {
@ -481,10 +482,10 @@
display: flex;
padding: 0 33rpx;
align-items: center;
border-top:2rpx solid #ebebeb;
border-top: 2rpx solid #ebebeb;
border-bottom: 2rpx solid #ebebeb;
padding-top: 23rpx;
background-color: #FFFFFF;
padding-top: 23rpx;
background-color: #FFFFFF;
padding-bottom: 21rpx;
}
@ -521,7 +522,7 @@
.project-message-content .li {
display: flex;
margin-bottom: 31rpx;
margin-right: 20rpx;
}
@ -539,8 +540,8 @@
.record-nav {
padding: 33rpx 50rpx 33rpx;
display: flex;
margin-top: 10rpx;
background-color: #FFFFFF;
margin-top: 10rpx;
background-color: #FFFFFF;
justify-content: space-between;
border-bottom: 2rpx solid #D5D4D4;
}
@ -568,7 +569,7 @@
}
.record-content {
padding: 0 52rpx;
padding-top: 33rpx;
overflow: hidden;
@ -608,16 +609,18 @@
background-color: #999999;
top: 14rpx;
}
.record-content .list .li .icon:last-child::after{
content: "";
width: 2rpx;
position: absolute;
left: 7rpx;
height: 102rpx;
background-color: #999999;
top: 14rpx;;
}
.record-content .list .li .icon:last-child::after {
content: "";
width: 2rpx;
position: absolute;
left: 7rpx;
height: 102rpx;
background-color: #999999;
top: 14rpx;
;
}
.record-content .list .li .con {
display: flex;
align-items: center;
@ -636,61 +639,70 @@
position: relative;
z-index: 1;
}
.record-content .list .on .icon .icon-con{
background-color: #0084ff;
width: 13rpx;
height: 13rpx;
border-radius: 50%;
}
.record-content .list .on .icon::after {
content: "";
width: 2rpx;
position: absolute;
left: 9rpx;
height: 170rpx;
z-index: -1;
background-color: #0084ff;
top: 20rpx;
}
.record-content .list .on .con{
display: block;
color: #0084ff;
}
.record-content .list .on .con .text{
margin-bottom: 35rpx;
}
.record-content .list .on .con .date{
margin-bottom: 35rpx;
}
.record-content .list .on{
align-items: flex-start;
}
.project-materials-title{
display: flex;
color: #00a2e9;
font-size: 24rpx;
background-color: #FFFFFF;
border-bottom: 2rpx solid #EDEDED;
font-weight: bold;
padding: 26rpx 20rpx;
justify-content: space-between;
}
.project-materials-title .text{
width: 16%;
text-align: center;
}
.project-materials-text{
display: flex;
background-color: #FFFFFF;
border-bottom: 2rpx solid #EDEDED;
padding: 26rpx 20rpx;
font-size: 24rpx;
justify-content: space-between;
}
.project-materials-text .text{
width: 16%;
text-align: center;
}
.record-content .list .on .icon .icon-con {
background-color: #0084ff;
width: 13rpx;
height: 13rpx;
border-radius: 50%;
}
.record-content .list .on .icon::after {
content: "";
width: 2rpx;
position: absolute;
left: 9rpx;
height: 170rpx;
z-index: -1;
background-color: #0084ff;
top: 20rpx;
}
.record-content .list .on .con {
display: block;
color: #0084ff;
}
.record-content .list .on .con .text {
margin-bottom: 35rpx;
}
.record-content .list .on .con .date {
margin-bottom: 35rpx;
}
.record-content .list .on {
align-items: flex-start;
}
.project-materials-title {
display: flex;
color: #00a2e9;
font-size: 24rpx;
background-color: #FFFFFF;
border-bottom: 2rpx solid #EDEDED;
font-weight: bold;
padding: 26rpx 20rpx;
justify-content: space-between;
}
.project-materials-title .text {
width: 16%;
text-align: center;
}
.project-materials-text {
display: flex;
background-color: #FFFFFF;
border-bottom: 2rpx solid #EDEDED;
padding: 26rpx 20rpx;
font-size: 24rpx;
justify-content: space-between;
}
.project-materials-text .text {
width: 16%;
text-align: center;
}
</style>

View File

@ -1,7 +1,8 @@
<template>
<view class="content">
<statusNav navBarTitle="(项目)查询结果"></statusNav>
<container-subgroup-two>
<view slot="content" style="margin: 0 -30rpx;">
<view class="project-list">
<view class="li" @click="projectDetailsFun()">
<view class="message">
@ -118,17 +119,17 @@
</view>
</view>
</view>
<footTabOne :current="1"></footTabOne>
</view>
</container-subgroup-two>
</view>
</template>
<script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
export default {
components:{
footTabOne,
containerSubgroupTwo,
statusNav
},
data() {
@ -175,7 +176,6 @@
}
.content{
padding-top: 100rpx;
}
.project-list-input {
width: 100%;
@ -183,7 +183,10 @@
position: relative;
padding: 20rpx 16rpx;
box-sizing: border-box;
background-color: #FFFFFF
background-color: #FFFFFF;
}
.project-list-input .int {

View File

@ -1,6 +1,8 @@
<template>
<view>
<view class="head">
<view class="text">
查询功能
@ -49,10 +51,10 @@
</view>
</view>
<view class="imgJCon">
<image class="imgJ" src="../../static/iocn/jh.png" mode=""></image>
</view>
<view class="imgJCon">
<image class="imgJ" src="../../static/iocn/jh.png" mode=""></image>
</view>
</view>
</template>
@ -242,14 +244,15 @@
height: 40rpx;
position: fixed;
display: block;
margin: auto;
}
.imgJCon{
.imgJCon {
display: flex;
justify-content: center;
height: 40rpx;
margin-top: 180rpx;
height: 40rpx;
margin-top: 180rpx;
}
</style>

View File

@ -1,187 +1,196 @@
<template>
<view class="content">
<statusNav navBarTitle="故障统计"></statusNav>
<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="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>
<statusNav navBarTitle="故障统计"></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>
<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,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>
</template>
<script>
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import statusNav from '../../components/status-nav.vue';
export default {
components: {
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -263,8 +272,6 @@
<style>
.content {
padding: 0rpx 15rpx;
padding-top: 80rpx;
padding-bottom: 80rpx;
}
@ -410,7 +417,7 @@
width: 100%;
border-radius: 15rpx;
padding-bottom: 120rpx;
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
box-sizing: border-box;
margin-top: 30rpx;
}
@ -473,7 +480,8 @@
background-color: #2d8efd;
border-radius: 25rpx;
}
.percentage-box-ber{
background-color: #ffb503;
.percentage-box-ber {
background-color: #ffb503;
}
</style>

View File

@ -1,322 +1,328 @@
<template>
<view class="content">
<statusNav navBarTitle="数据看板"></statusNav>
<view class="project-overview">
<view class="settlement-type-title">
项目概况
</view>
<view class="project-gross">
<view class="project-gross-title">
累计总项目量
<container-subgroup-two>
<view slot="content" style="margin: 0 -30rpx;">
<view class="project-overview">
<view class="settlement-type-title">
项目概况
</view>
<view class="project-gross">
<view class="project-gross-title">
累计总项目量
</view>
<view class="project-gross-num">
<view class="li">
0
</view>
<view class="li">
2
</view>
<view class="li">
9
</view>
<view class="li">
8
</view>
<view class="li">
5
</view>
</view>
<view class="project-gross-box">
<view class="li">
<view class="date">
今日
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
<view class="li">
<view class="date">
本周
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
<view class="li">
<view class="date">
本月
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="data-icon">
<view class="settlement-type-title">
年度项目数据明细
</view>
<view class="">
<view class="charts-box">
<qiun-data-charts type="mix" :chartData="chartData" background="none" />
</view>
</view>
</view>
<view class="serve-data">
<view class="settlement-type-title">
服务数据
</view>
<view class="serve-data-box">
<view class="serve-data-left">
<view class="title">
本月服务量
</view>
<view class="text-con">
<view class="li">
<view class="text">
维保工单:
</view>
<view class="num">
3
</view>
</view>
<view class="li">
<view class="text">
巡检服务单:
</view>
<view class="num">
65465
</view>
</view>
<view class="li">
<view class="text">
移屏服务单:
</view>
<view class="num">
32132
</view>
</view>
<view class="li">
<view class="text">
拆屏工单:
</view>
<view class="num">
32132
</view>
</view>
</view>
</view>
<view class="serve-data-left">
<view class="title">
累计服务量
</view>
<view class="text-con">
<view class="li">
<view class="text">
维保工单:
</view>
<view class="num">
3
</view>
</view>
<view class="li">
<view class="text">
巡检服务单:
</view>
<view class="num">
65465
</view>
</view>
<view class="li">
<view class="text">
移屏服务单:
</view>
<view class="num">
32132
</view>
</view>
<view class="li">
<view class="text">
拆屏工单:
</view>
<view class="num">
32132
</view>
</view>
</view>
</view>
</view>
</view>
<view class="data-icon">
<view class="settlement-type-title">
年度项目数据明细
</view>
<view class="">
<view class="charts-box">
<qiun-data-charts type="mix" :chartData="chartDataA" background="none" />
</view>
</view>
</view>
<view class="expire-project">
<view class="settlement-type-title settlement-type-titlea">
质保即将到期项目
</view>
<view class="expire-project-box">
<view class="li-title li">
<view class="name">
项目名称
</view>
<view class="work-order">
工单
</view>
<view class="date">
日期
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
</view>
</view>
</view>
<view class="project-gross-num">
<view class="li">
0
</view>
<view class="li">
2
</view>
<view class="li">
9
</view>
<view class="li">
8
</view>
<view class="li">
5
</view>
</view>
<view class="project-gross-box">
<view class="li">
<view class="date">
今日
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
<view class="li">
<view class="date">
本周
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
<view class="li">
<view class="date">
本月
</view>
<view class="date-con">
<view class="date-con-li">
<view class="text">
新增项目量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
新增工单量
</view>
<view class="single-amount">
0
</view>
</view>
<view class="date-con-li">
<view class="text">
项目故障率
</view>
<view class="single-amount">
0
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="data-icon">
<view class="settlement-type-title">
年度项目数据明细
</view>
<view class="">
<view class="charts-box">
<qiun-data-charts type="mix" :chartData="chartData" background="none" />
</view>
</view>
</view>
<view class="serve-data">
<view class="settlement-type-title">
服务数据
</view>
<view class="serve-data-box">
<view class="serve-data-left">
<view class="title">
本月服务量
</view>
<view class="text-con">
<view class="li">
<view class="text">
维保工单:
</view>
<view class="num">
3
</view>
</view>
<view class="li">
<view class="text">
巡检服务单:
</view>
<view class="num">
65465
</view>
</view>
<view class="li">
<view class="text">
移屏服务单:
</view>
<view class="num">
32132
</view>
</view>
<view class="li">
<view class="text">
拆屏工单:
</view>
<view class="num">
32132
</view>
</view>
</view>
</view>
<view class="serve-data-left">
<view class="title">
累计服务量
</view>
<view class="text-con">
<view class="li">
<view class="text">
维保工单:
</view>
<view class="num">
3
</view>
</view>
<view class="li">
<view class="text">
巡检服务单:
</view>
<view class="num">
65465
</view>
</view>
<view class="li">
<view class="text">
移屏服务单:
</view>
<view class="num">
32132
</view>
</view>
<view class="li">
<view class="text">
拆屏工单:
</view>
<view class="num">
32132
</view>
</view>
</view>
</view>
</view>
</view>
<view class="data-icon">
<view class="settlement-type-title">
年度项目数据明细
</view>
<view class="">
<view class="charts-box">
<qiun-data-charts type="mix" :chartData="chartDataA" background="none" />
</view>
</view>
</view>
<view class="expire-project">
<view class="settlement-type-title settlement-type-titlea">
质保即将到期项目
</view>
<view class="expire-project-box">
<view class="li-title li">
<view class="name">
项目名称
</view>
<view class="work-order">
工单
</view>
<view class="date">
日期
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
<view class="li-text li">
<view class="name">
1.五岭新天地二期停车场xxxxxxxxxxxxx
</view>
<view class="work-order">
6
</view>
<view class="date">
22/2/24
</view>
</view>
</view>
</view>
</view>
</container-subgroup-two>
</view>
</template>
<script>
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import statusNav from '../../components/status-nav.vue';
export default {
components: {
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -450,9 +456,7 @@
<style>
.content {
padding: 10rpx;
padding-top: 90rpx;
padding-bottom: 80rpx;
padding:0rpx 10rpx;
}
.charts-box{
width: 100%;

View File

@ -1,70 +1,79 @@
<template>
<view class="content">
<statusNav navBarTitle="意见反馈"></statusNav>
<view class="opinion-type">
意见类型
</view>
<view class="opinion-type-content">
<view class="li" @click="opinionType(index)" :class="item.state?'on':''" v-for="(item,index) in typeData">
{{item.title}}
</view>
</view>
<view class="feedback-input">
<input type="text" class="inputCss" placeholder="请填写您的意见或建议内容" placeholder-class="inputCss-input"
value="" />
<input type="text" class="inputCss" placeholder="请输入联系人姓名" placeholder-class="inputCss-input" value="" />
<input type="text" class="inputCss" placeholder="请输入联系人电话" placeholder-class="inputCss-input" value="" />
<view class="fault-pictures">
<image class="img" src="../../static/iocn/gz.png" mode="aspectFill"></image>
<view class="text">
请上传图片
<view class="">
<statusNav navBarTitle="意见反馈"></statusNav>
<container-subgroup-two>
<view slot="content" style="margin: 0 -30rpx;">
<view class="opinion-type">
意见类型
</view>
</view>
</view>
<view class="feedback-approach">
<view class="feedback-con">
<image class="icon" src="../../static/iocn/tel.png" mode=""></image>
<view class="feedback-tel-con">
<view class="text">
服务监督电话
<view class="opinion-type-content">
<view class="li" @click="opinionType(index)" :class="item.state?'on':''"
v-for="(item,index) in typeData">
{{item.title}}
</view>
</view>
<view class="tel">
156 1566 0510
<view class="feedback-input">
<input type="text" class="inputCss" placeholder="请填写您的意见或建议内容" placeholder-class="inputCss-input"
value="" />
<input type="text" class="inputCss" placeholder="请输入联系人姓名" placeholder-class="inputCss-input"
value="" />
<input type="text" class="inputCss" placeholder="请输入联系人电话" placeholder-class="inputCss-input"
value="" />
<view class="fault-pictures">
<image class="img" src="../../static/iocn/gz.png" mode="aspectFill"></image>
<view class="text">
请上传图片
</view>
</view>
</view>
<view class="feedback-approach">
<view class="feedback-con">
<image class="icon" src="../../static/iocn/tel.png" mode=""></image>
<view class="feedback-tel-con">
<view class="text">
服务监督电话
</view>
<view class="tel">
156 1566 0510
</view>
</view>
</view>
<view class="feedback-con">
<image class="icon" src="../../static/iocn/date.png" mode=""></image>
<view class="feedback-tel-con">
<view class="text">
反馈受理时间
</view>
<view class="tel">
9:00 - 18:00
</view>
</view>
</view>
</view>
<button class="submit-button" type="default">提交反馈</button>
</view>
</view>
<view class="feedback-con">
<image class="icon" src="../../static/iocn/date.png" mode=""></image>
<view class="feedback-tel-con">
<view class="text">
反馈受理时间
</view>
<view class="tel">
9:00 - 18:00
</view>
</view>
</view>
</view>
<button class="submit-button" type="default">提交反馈</button>
<footTabOne :current="3"></footTabOne>
</container-subgroup-two>
<footTabOne :current="3"></footTabOne>
</view>
</template>
<script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
export default {
components:{
components: {
footTabOne,
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -96,12 +105,12 @@
}
},
methods: {
opinionType(index){
for (var i = 0; i < this.typeData.length; i++) {
this.typeData[i].state=false
}
this.typeData[index].state=true
}
opinionType(index) {
for (var i = 0; i < this.typeData.length; i++) {
this.typeData[i].state = false
}
this.typeData[index].state = true
}
}
}
</script>
@ -110,22 +119,19 @@
page {
background-color: #F7F7F7;
}
.content{
padding-top: 76rpx;
padding-bottom: 180rpx;
}
.opinion-type {
width: 100%;
height: 80rpx;
line-height: 80rpx;
padding: 0 40rpx;
border-top: 2rpx solid #EAEAEA;
border-bottom: 2rpx solid #EAEAEA;
margin-top: 24rpx;
background-color: #FFFFFF;
font-size: 36rpx;
font-weight: bold;
}
.opinion-type{
width: 100%;
height: 80rpx;
line-height: 80rpx;
padding: 0 40rpx;
border-top: 2rpx solid #EAEAEA;
border-bottom: 2rpx solid #EAEAEA;
background-color: #FFFFFF;
font-size: 36rpx;
font-weight: bold;
}
.opinion-type-content .li {
width: 214rpx;
@ -197,8 +203,9 @@
color: #9f9898;
}
.feedback-con{
width: 320rpx;
.feedback-con {
width: 320rpx;
height: 100rpx;
border-radius: 8rpx;
background-color: #ffe5e5;
@ -207,27 +214,32 @@
box-sizing: border-box;
padding-left: 26rpx;
}
.feedback-con .icon{
.feedback-con .icon {
width: 40rpx;
height: 40rpx;
margin-right: 18rpx;
}
.feedback-tel-con .text{
.feedback-tel-con .text {
font-size: 24rpx;
margin-bottom: 10rpx;
}
.feedback-tel-con .tel{
.feedback-tel-con .tel {
font-size: 28rpx;
}
.feedback-approach{
.feedback-approach {
padding: 0 40rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 14rpx;
}
.submit-button {
width: 686rpx;
margin-top: 58rpx;

View File

@ -1,234 +1,241 @@
<template>
<view class="content">
<statusNav navBarTitle="项目详情"></statusNav>
<view class="head-top">
<view class="details-head">
<view class="swiper-head">
<swiper class="swiper" @change="changeAutoplay" :autoplay="autoplay" :interval="interval"
:duration="duration">
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<container-subgroup-two>
<view slot="content" style="margin: -25rpx -30rpx;">
<view class="head-top">
<view class="details-head">
<view class="swiper-head">
<swiper class="swiper" @change="changeAutoplay" :autoplay="autoplay" :interval="interval"
>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</swiper-item>
</swiper>
<view class="indication-point ">
{{index}}/3
</view>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<view class="title">
湖南工业大学生化学院会议室P2.5全彩LED显示屏
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item uni-bg-red">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<view class="code">
XM20220108-1001
</view>
</swiper-item>
</swiper>
<view class="indication-point ">
{{index}}/3
<view class="address">
<image class="img" src="../../static/iocn/im.png" mode=""></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
</view>
<view class="last-date">
<view class="last-date-content">
<image class="icon" src="../../static/iocn/gzzt.png" mode=""></image>
<view class="text">
最近一次故障时间2021-11-18 170016
</view>
</view>
</view>
</view>
</view>
<view class="title">
湖南工业大学生化学院会议室P2.5全彩LED显示屏
</view>
<view class="code">
XM20220108-1001
</view>
<view class="address">
<image class="img" src="../../static/iocn/im.png" mode=""></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
</view>
<view class="last-date">
<view class="last-date-content">
<image class="icon" src="../../static/iocn/gzzt.png" mode=""></image>
<view class="text">
最近一次故障时间2021-11-18 170016
</view>
</view>
</view>
</view>
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目概况
<view class="project-message-title">
<view class="icon">
</view>
<view class="text">
项目概况
</view>
</view>
<view class="project-message-content">
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
海康威视
</view>
</view>
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
DS-CK25FI/H
</view>
</view>
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
3.94*2.02m
</view>
</view>
<view class="li">
<view class="title">
安装位置
</view>
<view class="text">
xx综合楼2楼会议室403
</view>
</view>
<view class="li">
<view class="title">
竣工日期
</view>
<view class="text">
2022/01/08
</view>
</view>
</view>
<view class="record-nav">
<view class="li" @click="recordNav(index)" :class="item.state?'on':''" v-for="(item,index) in recordState">
{{item.title}}
</view>
</view>
<view class="record-content">
<view class="title">
维修追踪
</view>
<view class="list">
<view class="li on">
<view class="icon">
<view class="icon-con">
</view>
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
</view>
</view>
</view>
</container-subgroup-two>
</view>
<view class="project-message-content">
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
海康威视
</view>
</view>
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
DS-CK25FI/H
</view>
</view>
<view class="li">
<view class="title-one">
<text></text>
<text></text>
</view>
<view class="text">
3.94*2.02m
</view>
</view>
<view class="li">
<view class="title">
安装位置
</view>
<view class="text">
xx综合楼2楼会议室403
</view>
</view>
<view class="li">
<view class="title">
竣工日期
</view>
<view class="text">
2022/01/08
</view>
</view>
</view>
<view class="record-nav">
<view class="li" @click="recordNav(index)" :class="item.state?'on':''" v-for="(item,index) in recordState">
{{item.title}}
</view>
</view>
<view class="record-content">
<view class="title">
维修追踪
</view>
<view class="list">
<view class="li on">
<view class="icon">
<view class="icon-con">
</view>
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
<view class="li">
<view class="icon">
</view>
<view class="con">
<view class="text">
黑屏故障 某某已处理
</view>
<view class="date">
2020-05-15 16:00
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import statusNav from "../../components/status-nav.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
export default {
components:{
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -272,8 +279,6 @@
.content {
padding: 16rpx 0;
padding-top: 80rpx;
padding-bottom: 80rpx;
}
.swiper {

View File

@ -1,58 +1,65 @@
<template>
<view class="content" :style="{paddingTop: statusHeight + 'px'}">
<statusNav navBarTitle="项目列表" :ifReturn="false"></statusNav>
<view class="project-list-input">
<input type="text" class="int" value="" placeholder="请输入关键字" />
<view class="xian">
<container-subgroup-two>
<view slot="content" style="margin: -100rpx -30rpx;">
</view>
<image class="search" src="../../static/iocn/ss.png" mode="aspectFill" lazy-load></image>
</view>
<view class="screen bbot mar-sx20">
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="li">
<view class="text">产品类型</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill" lazy-load></image>
</view>
</picker>
<picker mode="date" :value="date" @change="bindDateChange">
<view class="li">
<view class="text">竣工日期</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill" lazy-load></image>
</view>
</picker>
<view class="li">
<view class="text">筛选</view>
<image class="imgA" src="../../static/iocn/sx.png" mode="aspectFill" lazy-load></image>
</view>
</view>
<view class="project-list">
<view class="li" @click="projectDetailsFun()" v-for="(item,index) in 10" :key="index">
<view class="message">
<image class="img" src="../../static/del/img001.png" mode="aspectFill" lazy-load></image>
<view class="text disjb fc" style="height: 180rpx;">
<view class="clips1 fon24 bold">湖南工业大学化工学院会议室P2.5全彩LED显示屏</view>
<view class="disjb fc" style="margin-left: -20rpx;height: 80%;">
<view class="serial-number scal09">项目编号20220108-1001</view>
<view class="specification scal09">规格型号DS-CK25FI/H</view>
<view class="specification scal09">产品尺寸3.94*2.02</view>
<view class="installation-site scal09">安装位置xxx综合楼2楼会议室</view>
</view>
</view>
</view>
<view class="project-list-address col6 mar-s20 disjbac">
<view class="address">
<image class="img flexs" src="../../static/iocn/im.png" mode="scaleToFill" lazy-load></image>
<view class="text scal09" style="margin-left: -26rpx;">湖南省长沙市高新开发区谷园路109号像素大厦1205</view>
</view>
<view class="date scal09">2022/01/08</view>
</view>
<!-- <view class="icon iconBera">质保中</view> -->
<view class="icon iconBer">质保到期</view>
</view>
</view>
<view class="project-list-input">
<input type="text" class="int" value="" placeholder="请输入关键字" />
<view class="xian">
</view>
<image class="search" src="../../static/iocn/ss.png" mode="aspectFill" lazy-load></image>
</view>
<view class="screen bbot mar-sx20">
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="li">
<view class="text">产品类型</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill" lazy-load></image>
</view>
</picker>
<picker mode="date" :value="date" @change="bindDateChange">
<view class="li">
<view class="text">竣工日期</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill" lazy-load></image>
</view>
</picker>
<view class="li">
<view class="text">筛选</view>
<image class="imgA" src="../../static/iocn/sx.png" mode="aspectFill" lazy-load></image>
</view>
</view>
<view class="project-list">
<view class="li" @click="projectDetailsFun()" v-for="(item,index) in 10" :key="index">
<view class="message">
<image class="img" src="../../static/del/img001.png" mode="aspectFill" lazy-load></image>
<view class="text disjb fc" style="height: 180rpx;">
<view class="clips1 fon24 bold">湖南工业大学化工学院会议室P2.5全彩LED显示屏</view>
<view class="disjb fc" style="margin-left: -20rpx;height: 80%;">
<view class="serial-number scal09">项目编号20220108-1001</view>
<view class="specification scal09">规格型号DS-CK25FI/H</view>
<view class="specification scal09">产品尺寸3.94*2.02</view>
<view class="installation-site scal09">安装位置xxx综合楼2楼会议室</view>
</view>
</view>
</view>
<view class="project-list-address col6 mar-s20 disjbac">
<view class="address">
<image class="img flexs" src="../../static/iocn/im.png" mode="scaleToFill" lazy-load></image>
<view class="text scal09" style="margin-left: -26rpx;">湖南省长沙市高新开发区谷园路109号像素大厦1205</view>
</view>
<view class="date scal09">2022/01/08</view>
</view>
<!-- <view class="icon iconBera">质保中</view> -->
<view class="icon iconBer">质保到期</view>
</view>
</view>
</view>
</container-subgroup-two>
<footTabOne :current="1"></footTabOne>
</view>
</template>
@ -60,10 +67,12 @@
<script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
export default {
components: {
footTabOne,
statusNav
statusNav,
containerSubgroupTwo
},
data() {
const currentDate = this.getDate({
@ -113,11 +122,6 @@
background-color: #F7F7F7;
}
.content {
/* padding-top: 76rpx; */
padding-bottom: 160rpx;
}
.project-list-input {
width: 100%;
height: 114rpx;

File diff suppressed because it is too large Load Diff

View File

@ -1,64 +1,69 @@
<template>
<view class="content">
<statusNav navBarTitle="工单回访"></statusNav>
<view class="hint">
客户服务重在回访仔细倾听以服务质量求发展
</view>
<view class="payReturnVisit-from">
<view class="payReturnVisit-input">
<view class="title">
<text></text>
<text></text>
<text></text>
<statusNav navBarTitle="工单回访"></statusNav>
<container-subgroup-two>
<view slot="content" style="margin: -25rpx -30rpx 0rpx;">
<view class="hint">
客户服务重在回访仔细倾听以服务质量求发展
</view>
<view class="payReturnVisit-from">
<view class="payReturnVisit-input">
<view class="title">
<text></text>
<text></text>
<text></text>
</view>
<input class="input" placeholder="请填写联系人称呼" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
联系电话
</view>
<input class="input" placeholder="请输入手机号码" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
<text></text>
<text></text>
<text></text>
</view>
<input class="input" placeholder="请输入微信号码" type="text" value="" />
</view>
<view class="payReturnVisit-textarea">
<view class="title">
回访内容
</view>
<textarea class="textarea" value="" placeholder="请输入回访内容" />
</view>
<view class="payReturnVisit-input">
<view class="title">
客服电话
</view>
<input class="input" placeholder="400-765-9876" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
回访时间
</view>
<input class="input" placeholder="2022/02/13 14:18:00" type="text" value="" />
</view>
</view>
<button class="submit-button" type="default">确认发送</button>
</view>
<input class="input" placeholder="请填写联系人称呼" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
联系电话
</view>
<input class="input" placeholder="请输入手机号码" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
<text></text>
<text></text>
<text></text>
</view>
<input class="input" placeholder="请输入微信号码" type="text" value="" />
</view>
<view class="payReturnVisit-textarea">
<view class="title">
回访内容
</view>
<textarea class="textarea" value="" placeholder="请输入回访内容" />
</view>
<view class="payReturnVisit-input">
<view class="title">
客服电话
</view>
<input class="input" placeholder="400-765-9876" type="text" value="" />
</view>
<view class="payReturnVisit-input">
<view class="title">
回访时间
</view>
<input class="input" placeholder="2022/02/13 14:18:00" type="text" value="" />
</view>
</view>
<button class="submit-button" type="default">确认发送</button>
</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 {
@ -72,15 +77,15 @@
</script>
<style>
.content{
padding-top: 80rpx;
}
.hint {
color: #358ff0;
font-size: 24rpx;
padding: 25rpx 30rpx;
}
.submit-button {
.submit-button {
width: 686rpx;
border-radius: 50rpx;
height: 90rpx;
@ -91,13 +96,14 @@
text-align: center;
font-size: 30rpx;
}
.payReturnVisit-input {
background-color: #FFFFFF;
height: 103rpx;
display: flex;
align-items: center;
width: 700rpx;
border-bottom: 2rpx solid #f4f4f4;
border-bottom: 2rpx solid #f4f4f4;
margin: auto;
}
@ -118,26 +124,30 @@
font-size: 30rpx;
margin-top: 2rpx;
}
.payReturnVisit-from{
.payReturnVisit-from {
background-color: #FFFFFF;
}
.payReturnVisit-textarea{
.payReturnVisit-textarea {
width: 700rpx;
border-bottom: 2rpx solid #f4f4f4;
border-bottom: 2rpx solid #f4f4f4;
margin: auto;
padding-bottom: 30rpx;
}
.payReturnVisit-textarea .title{
.payReturnVisit-textarea .title {
padding: 30rpx 0rpx;
font-size: 30rpx;
font-weight: bold;
font-weight: bold;
}
.payReturnVisit-textarea .textarea {
width: 100%;
height: 200rpx;
background-color: #F5F5F5;
border-radius: 10rpx;
padding: 20rpx;
box-sizing: border-box;
}
.payReturnVisit-textarea .textarea{
width: 100%;
height: 200rpx;
background-color: #F5F5F5;
border-radius: 10rpx;
padding: 20rpx;
box-sizing: border-box;
}
</style>

View File

@ -1,152 +1,160 @@
<template>
<view class="content">
<statusNav navBarTitle="处理工单"></statusNav>
<view class="work-order-schedule">
<view class="li">
<view class="icon on icon-after">
1
</view>
<view class="text">
签到执行
</view>
<container-subgroup-two>
<view slot="content" style="margin: 0 -25rpx;">
<view class="work-order-schedule">
<view class="li">
<view class="icon on icon-after">
1
</view>
<view class="li">
<view class="icon icon-after">
2
</view>
<view class="text">
填写维保单
</view>
</view>
<view class="li">
<view class="icon">
3
</view>
<view class="text">
结算审核
</view>
<view class="text">
签到执行
</view>
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
工单编号
</view>
<input type="text" class="input" placeholder="" value="GD20211203-001" />
<view class="li">
<view class="icon icon-after">
2
</view>
<view class="li">
<view class="title">
项目编号
</view>
<input type="text" class="input" placeholder="" value="GD20211203-001" />
<view class="text">
填写维保单
</view>
<view class="li">
<view class="title">
项目名称
</view>
<input type="text" class="input input-black
" placeholder="" value="湖南省林业科学院11楼会议室P2.5" />
</view>
<view class="li">
<view class="icon">
3
</view>
<view class="li">
<view class="title">
产品类型
</view>
<input type="text" class="input" placeholder="" value="Q2.5-E" />
<view class="text">
结算审核
</view>
<view class="li">
<view class="title">
</view>
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
工单编号
</view>
<input type="text" class="input" placeholder="" value="GD20211203-001" />
</view>
<view class="li">
<view class="title">
项目编号
</view>
<input type="text" class="input" placeholder="" value="GD20211203-001" />
</view>
<view class="li">
<view class="title">
项目名称
</view>
<input type="text" class="input input-black
" placeholder="" value="湖南省林业科学院11楼会议室P2.5" />
</view>
<view class="li">
<view class="title">
产品类型
</view>
<input type="text" class="input" placeholder="" value="Q2.5-E" />
</view>
<view class="li">
<view class="title">
安装位置
</view>
<input type="text" class="input" placeholder="" value="详细地址+某某栋11楼会议室" />
</view>
<view class="li">
<view class="title">
故障类型
</view>
<input type="text" class="input" placeholder="" value="供电不足" />
<input type="text" class="input" placeholder="" value="详细地址+某某栋11楼会议室" />
</view>
<view class="li">
<view class="title">
故障类型
</view>
<view class="li">
<view class="title">
紧急程度
</view>
<input type="text" class="input" placeholder="" value="紧急" />
<input type="text" class="input" placeholder="" value="供电不足" />
</view>
<view class="li">
<view class="title">
紧急程度
</view>
<view class="li">
<view class="title">
故障说明
</view>
<textarea auto-height class="input" value="*********************************************************************************************************" placeholder="" />
<input type="text" class="input" placeholder="" value="紧急" />
</view>
<view class="li">
<view class="title">
故障说明
</view>
<view class="li">
<view class="title">
故障图片
</view>
<view class="input">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
<textarea auto-height class="input"
value="*********************************************************************************************************"
placeholder="" />
</view>
<view class="li">
<view class="title">
故障图片
</view>
<view class="input">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
</view>
<input type="text" class="input" placeholder="" value="林某" />
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
</view>
<view class="li">
<view class="title">
报单时间
</view>
<input type="text" class="input" placeholder="" value="2021/12/3 12:00:05" />
<input type="text" class="input" placeholder="" value="林某" />
</view>
<view class="li">
<view class="title">
报单时间
</view>
<view class="li">
<view class="title">
服务方式
</view>
<input type="text" class="input input-black" placeholder="" value="上门服务" />
<input type="text" class="input" placeholder="" value="2021/12/3 12:00:05" />
</view>
<view class="li">
<view class="title">
服务方式
</view>
<view class="li">
<view class="title">
定位地址
</view>
<input type="text" class="input" placeholder="" value="*******************************" />
<input type="text" class="input input-black" placeholder="" value="上门服务" />
</view>
<view class="li">
<view class="title">
定位地址
</view>
</view>
<button class="submit-button" type="default">签到</button>
<input type="text" class="input" placeholder="" value="*******************************" />
</view>
</view>
<button class="submit-button" type="default">签到</button>
</view>
</container-subgroup-two>
</view>
</template>
<script>
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
export default {
components: {
footTabOne,
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -160,11 +168,8 @@
</script>
<style>
.content {
padding-top: 80rpx;
padding-bottom: 80rpx;
}
.submit-button {
.submit-button {
width: 686rpx;
border-radius: 50rpx;
height: 90rpx;
@ -175,6 +180,7 @@
text-align: center;
font-size: 30rpx;
}
.work-order-schedule {
display: flex;
padding: 22rpx 29rpx;
@ -231,7 +237,7 @@
.work-order-from .li .title {
font-size: 26rpx;
width: 133rpx;
}
@ -241,12 +247,14 @@
flex: 1;
padding-left: 15rpx;
}
.work-order-from .li .input .img{
width: 169rpx;
height: 127rpx;
margin-right: 10rpx;
}
.work-order-from .li .input-black {
color: #292929;
}
.work-order-from .li .input .img {
width: 169rpx;
height: 127rpx;
margin-right: 10rpx;
}
.work-order-from .li .input-black {
color: #292929;
}
</style>

View File

@ -1,218 +1,225 @@
<template>
<view class="content">
<status-nav navBarTitle="工单列表" returnColor="#c2c2c2"></status-nav>
<view class="project-list-input">
<input type="text" class="int" value="" placeholder="请输入关键字" />
<image class="search" src="../../static/iocn/ss.png" mode=""></image>
<view class="xian">
<container-subgroup-two>
<view slot="content" style="margin: 0 -25rpx;">
<view class="project-list-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="screen">
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="li">
<view class="text">
工单状态
</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
</view>
</picker>
<picker mode="date" :value="date" @change="bindDateChange">
<view class="li">
<view class="text">
工单日期
</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
</view>
</picker>
<view class="li">
<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()">
<view class="work-order-code">
工单编号222226666558
</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">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon">
待维修
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
</view>
</view>
</view>
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
</view>
</view>
</view>
<view class="li" @click="projectDetailsFun()">
<view class="work-order-code">
工单编号222226666558
</view>
<view class="message">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
</view>
<view class="screen">
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="li">
<view class="text">
工单状态
</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
</view>
</picker>
<picker mode="date" :value="date" @change="bindDateChange">
<view class="li">
<view class="text">
工单日期
</view>
<image class="img" src="../../static/iocn/xla.png" mode="aspectFill"></image>
</view>
</picker>
<view class="li">
<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()">
<view class="work-order-code">
工单编号222226666558
</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">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon">
待维修
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
</view>
</view>
</view>
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
<view class="title">
<view class="text clips1">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon icon1">
已完成
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
</view>
</view>
</view>
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
</view>
</view>
</view>
<view class="li" @click="projectDetailsFun()">
<view class="work-order-code">
工单编号222226666558
</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">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon icon1">
已完成
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
</view>
</view>
</view>
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="li" @click="projectDetailsFun()">
<view class="work-order-code">
工单编号222226666558
</view>
<view class="message">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
<view class="title">
<view class="text clips1">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon icon3">
等待派工
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
</view>
</view>
</view>
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
</view>
</view>
</view>
</view>
<view class="li" @click="projectDetailsFun()">
<view class="work-order-code">
工单编号222226666558
</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">
长沙市望城区xxxxxx项目名称
</view>
<view class="icon icon3">
等待派工
</view>
</view>
<view class="serial-number">
<view class="type">
#网络故障#
</view>
<view class="date">
已故障2小时37分
</view>
</view>
<view class="specification">
紧急程度<view class="text"> 加急
</view>
</view>
<view class="specification">
主负责人陈志远
</view>
<view class="installation-site clips2">
故障描述LED显示屏开机后闪屏不显示内容主控电
脑提示网络不通
</view>
</view>
</view>
<view class="project-list-address">
<view class="address clips2">
<image class="img" src="../../static/iocn/dz2.png" mode="aspectFill"></image>
<view class="text">
湖南省长沙市高新开发区谷园路109号像素大厦1205
</view>
</view>
<view class="date">
催一催 <image class="img" src="../../static/iocn/ld.png" mode=""></image>
</view>
</view>
</view>
</view>
</view>
</container-subgroup-two>
<footTabOne :current="1"></footTabOne>
</view>
</template>
<script>
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
export default {
components: {
footTabOne,
statusNav
statusNav,
containerSubgroupTwo
},
data() {
const currentDate = this.getDate({
@ -263,10 +270,7 @@
background-color: #F7F7F7;
}
.content {
padding-top: 76rpx;
padding-bottom: 140rpx;
}
.project-list-input .xian {
width: 3rpx;
height: 35rpx;
@ -473,7 +477,6 @@
height: 30rpx;
margin-right: 10rpx;
}
.project-list-address .address {
display: flex;
align-items: center;

View File

@ -1,220 +1,228 @@
<template>
<view class="content">
<statusNav navBarTitle="处理工单"></statusNav>
<view class="work-order-schedule">
<view class="li">
<view class="icon icon-after">
1
</view>
<view class="text">
签到执行
</view>
</view>
<view class="li">
<view class="icon icon-after">
2
</view>
<view class="text">
填写维保单
</view>
</view>
<view class="li">
<view class="icon on">
3
</view>
<view class="text">
结算审核
</view>
</view>
</view>
<view class="clearing-form">
<view class="title">
结算方式
</view>
<view class="clearing-form-content">
<view class="li" @click="clearingFormFun(index)" v-for="(item,index) in clearingForm">
<image class="icon" v-if="item.state" src="../../static/iocn/xuanz.png" mode=""></image>
<image class="icon" v-else src="../../static/iocn/xuan.png" mode=""></image>
{{item.title}}
</view>
</view>
</view>
<view class="work-order-from">
<picker mode="date" :value="date" @change="serveDate">
<view class="serve-date">
<view class="text">
请选择服务时间
</view>
<image class="icon" src="../../static/iocn/jt.png" mode=""></image>
</view>
</picker>
<view class="total-cost">
<view class="li">
<view class="text">
上门费
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text on">
税金
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text">
材料费
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text">
其他费用
</view>
<view class="price">
120.00
</view>
</view>
</view>
<view class="total-price">
费用合计<text class="money">580.00</text>
</view>
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="serve-date">
<view class="text">
请选择付款方式
</view>
<image class="icon" src="../../static/iocn/jt.png" mode=""></image>
</view>
</picker>
<view class="is-invoice">
<view class="text">
是否开票
</view>
<view class="radio" @click="isInvoiceFun(true)">
<image v-if="isInvoice" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
<view class="radio" @click="isInvoiceFun(false)">
<image v-if="!isInvoice" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
</view>
<view class="is-invoice">
<view class="text">
是否收款
</view>
<view class="radio" @click="isMoneyFun(true)">
<image v-if="isMoney" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
<view class="radio" @click="isMoneyFun(false)">
<image v-if="!isMoney" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
</view>
<view class="customerSignature">
<view class="title">
客户签名
</view>
<view class='contents'>
<canvas class='firstCanvas' canvas-id="firstCanvas" @touchmove='move' @touchstart='start($event)'
@touchend='end' @touchcancel='cancel' @longtap='tap' disable-scroll='true' @error='error'>
</canvas>
<!-- <button @click='clearClick'>清除</button> -->
<!-- <button @click='saveClick'>保存图片</button> -->
</view>
<view class="text" v-if="isCanvas">
请在此签名
</view>
</view>
<view class="money-receiving-code">
<view class="title">
<image src="../../static/iocn/shoukuan.png" class="icon" mode=""></image>
<view class="text">
微信支付宝等收款码
</view>
</view>
<image src="../../static/iocn/jt.png" mode="" class="img"></image>
</view>
<view class="address">
<image class="icon" src="../../static/iocn/dizi.png" mode=""></image>
<view class="text ">
湖南省株洲市荷塘区红旗中路456号(五矿二十三冶)
</view>
</view>
<view class="remark">
<view class="title">
备注内容
</view>
<container-subgroup-two>
<view slot="content" style="margin: 0 -25rpx;">
<view class="work-order-schedule">
<view class="li">
<view class="icon icon-after">
1
</view>
<view class="text">
签到执行
</view>
</view>
<view class="li">
<view class="icon icon-after">
2
</view>
<view class="text">
填写维保单
</view>
</view>
<view class="li">
<view class="icon on">
3
</view>
<view class="text">
结算审核
</view>
</view>
</view>
<view class="clearing-form">
<view class="title">
结算方式
</view>
<view class="clearing-form-content">
<view class="li" @click="clearingFormFun(index)" v-for="(item,index) in clearingForm">
<image class="icon" v-if="item.state" src="../../static/iocn/xuanz.png" mode=""></image>
<image class="icon" v-else src="../../static/iocn/xuan.png" mode=""></image>
{{item.title}}
</view>
</view>
</view>
<view class="work-order-from">
<picker mode="date" :value="date" @change="serveDate">
<view class="serve-date">
<view class="text">
请选择服务时间
</view>
<image class="icon" src="../../static/iocn/jt.png" mode=""></image>
</view>
</picker>
<view class="total-cost">
<view class="li">
<view class="text">
上门费
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text on">
税金
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text">
材料费
</view>
<view class="price">
120.00
</view>
</view>
<view class="li">
<view class="text">
其他费用
</view>
<view class="price">
120.00
</view>
</view>
</view>
<view class="total-price">
费用合计<text class="money">580.00</text>
</view>
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="serve-date">
<view class="text">
请选择付款方式
</view>
<image class="icon" src="../../static/iocn/jt.png" mode=""></image>
</view>
</picker>
<view class="is-invoice">
<view class="text">
是否开票
</view>
<view class="radio" @click="isInvoiceFun(true)">
<image v-if="isInvoice" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
<view class="radio" @click="isInvoiceFun(false)">
<image v-if="!isInvoice" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
</view>
<view class="is-invoice">
<view class="text">
是否收款
</view>
<view class="radio" @click="isMoneyFun(true)">
<image v-if="isMoney" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
<view class="radio" @click="isMoneyFun(false)">
<image v-if="!isMoney" src="../../static/iocn/xz.png" class="icon" mode=""></image>
<view v-else class="icon1">
</view>
<text></text>
</view>
</view>
<view class="customerSignature">
<view class="title">
客户签名
</view>
<view class='contents'>
<canvas class='firstCanvas' canvas-id="firstCanvas" @touchmove='move' @touchstart='start($event)'
@touchend='end' @touchcancel='cancel' @longtap='tap' disable-scroll='true' @error='error'>
</canvas>
<!-- <button @click='clearClick'>清除</button> -->
<!-- <button @click='saveClick'>保存图片</button> -->
</view>
<view class="text" v-if="isCanvas">
请在此签名
</view>
</view>
<view class="money-receiving-code">
<view class="title">
<image src="../../static/iocn/shoukuan.png" class="icon" mode=""></image>
<view class="text">
微信支付宝等收款码
</view>
</view>
<image src="../../static/iocn/jt.png" mode="" class="img"></image>
</view>
<view class="address">
<image class="icon" src="../../static/iocn/dizi.png" mode=""></image>
<view class="text ">
湖南省株洲市荷塘区红旗中路456号(五矿二十三冶)
</view>
</view>
<view class="remark">
<view class="title">
备注内容
</view>
<textarea class="textarea" value="" placeholder="请输入备注内容" />
</view>
</view>
<button class="submit-button" type="default">提交审核</button>
<textarea class="textarea" value="" placeholder="请输入备注内容" />
</view>
</view>
</container-subgroup-two>
<button class="submit-button" type="default">提交审核</button>
</view>
</template>
<script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
var content = null;
var touchs = [];
var canvasw = 0;
@ -230,7 +238,7 @@
components: {
footTabOne,
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -379,10 +387,7 @@
</script>
<style>
.content {
padding-top: 80rpx;
padding-bottom: 80rpx;
}
.submit-button {
width: 686rpx;
@ -604,8 +609,8 @@
content {
width: 100%;
}
.customerSignature .text {
.customerSignature .text {
position: absolute;
top: 50%;
width: 100%;
@ -634,67 +639,76 @@
width: 100%;
height: 80rpx;
display: flex;
padding: 0rpx 13rpx;
padding: 0rpx 13rpx;
align-items: center;
margin-top: 13rpx;
box-sizing: border-box;
background-color: #FFFFFF;
justify-content: space-between;
justify-content: space-between;
}
.money-receiving-code .title{
.money-receiving-code .title {
display: flex;
align-items: center;
}
.money-receiving-code .title .icon{
.money-receiving-code .title .icon {
width: 22rpx;
height: 22rpx;
margin-right: 30rpx;
}
.money-receiving-code .title .text{
.money-receiving-code .title .text {
font-size: 26rpx;
color: #333333;
}
.money-receiving-code .img{
.money-receiving-code .img {
width: 22rpx;
height: 12rpx;
transform: rotateZ(-90deg);
}
.address{
.address {
width: 100%;
height: 80rpx;
background-color: #FFFFFF;
display: flex;
align-items: center;
margin-top: 13rpx;
box-sizing: border-box;
padding: 0rpx 13rpx;
margin-top: 13rpx;
box-sizing: border-box;
padding: 0rpx 13rpx;
}
.address .icon{
.address .icon {
width: 24rpx;
height: 32rpx;
margin-right: 30rpx;
}
.address .text{
.address .text {
font-size: 26rpx;
color: #5d5c5c;
}
.remark{
width: 100%;
margin-top: 13rpx;
background-color: #FFFFFF;
padding: 20rpx 14rpx;
height: 360rpx;
box-sizing: border-box;
.remark {
width: 100%;
margin-top: 13rpx;
background-color: #FFFFFF;
padding: 20rpx 14rpx;
height: 360rpx;
box-sizing: border-box;
}
.remark .title{
.remark .title {
margin-bottom: 30rpx;
font-size: 28rpx;
font-weight: bold;
}
.remark .textarea{
.remark .textarea {
width: 100%;
box-sizing: border-box;
background-color: #f5f5f5;

View File

@ -1,7 +1,8 @@
<template>
<view class="content">
<statusNav navBarTitle="处理工单"></statusNav>
<container-subgroup-two>
<view slot="content" style="margin: 0 -25rpx;">
<view class="work-order-schedule">
<view class="li">
<view class="icon icon-after">
@ -28,64 +29,64 @@
</view>
</view>
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
工单编号
</view>
<input type="text" class="input" placeholder="" value="GD20211203-001" />
</view>
<view class="li">
<view class="title">
项目编号
</view>
<input type="text" class="input" placeholder="" value="XM20211203-001" />
</view>
<view class="li">
<view class="title">
项目名称
</view>
<input type="text" class="input input-black" placeholder="" value="湖南省林业科学院11楼会议室P2.5" />
</view>
<view class="li">
<view class="title">
产品类型
</view>
<input type="text" class="input input-black" placeholder="" value="Q2.5-E" />
</view>
<view class="li">
<view class="title">
安装位置
</view>
<input type="text" class="input input-black" placeholder="" value="详细地址+某某栋11楼会议室" />
</view>
<view class="li">
<view class="title">
故障类型
</view>
<input type="text" class="input input-black" placeholder="" value="供电不足" />
</view>
<view class="li">
<view class="title">
服务方式
</view>
<input type="text" class="input input-black" placeholder="" value="上门服务" />
</view>
<view class="li">
<view class="title">
故障说明
</view>
<textarea auto-height class="input input-black"
value="*********************************************************************************************************"
placeholder="" />
@ -94,61 +95,61 @@
<view class="title">
故障图片
</view>
<view class="input add-display">
<view class="">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
<view class="add-img">
<image class="icon" src="../../static/iocn/jia.png" mode=""></image>
</view>
</view>
</view>
<view class="li">
<view class="title">
开始时间
</view>
<input type="text" class="input " placeholder="" value="2022-01-25 09:39" />
</view>
<view class="li">
<view class="title">
结束时间
</view>
<input type="text" class="input input-black" placeholder="" value="2022-01-25 15:30" />
</view>
<view class="li">
<view class="title">
维保用时
</view>
<input type="text" class="input " placeholder="" value="5小时51分钟" />
</view>
<view class="li">
<view class="title">
维保费用
</view>
<input type="text" class="input input-black" placeholder="" value="¥500.00元" />
</view>
<view class="li">
<view class="title">
等待时长
</view>
<input type="text" class="input " placeholder="" value="1天6小时35分钟" />
</view>
<view class="li">
<view class="title">
主维保人
</view>
<input type="text" class="input input-black" placeholder="" value="陈志远" />
</view>
<view class="li">
<view class="title">
@ -176,36 +177,36 @@
</view>
</view>
</view>
</view>
</view>
<view class="work-order-from">
<view class="li">
<view class="title">
工作描述
</view>
<textarea auto-height class="input input-black"
value="*********************************************************************************************************"
placeholder="" />
</view>
<view class="li">
<view class="title">
维保图片
</view>
<view class="input add-display">
<view class="">
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
<image class="img" src="../../static/del/img001.png" mode="aspectFill"></image>
</view>
<view class="add-img">
<image class="icon" src="../../static/iocn/jia.png" mode=""></image>
</view>
@ -213,10 +214,10 @@
</view>
<view class="li">
<view class="title">
故障原因
</view>
<textarea auto-height class="input input-black"
value="*********************************************************************************************************"
placeholder="" />
@ -226,7 +227,7 @@
维保人员
</view>
<input type="text" class="input input-black" placeholder="" value="罗帅 陈志远" />
</view>
</view>
<view class="cost-breakdown">
@ -239,7 +240,7 @@
</view>
</view>
</view>
<view class="cost-breakdown-content">
<view class="title">
<view class="li">
@ -271,16 +272,22 @@
</view>
</view>
<button class="submit-button" type="default">下一步</button>
</view>
</container-subgroup-two>
</view>
</template>
<script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
export default {
components: {
footTabOne,
statusNav
statusNav,
containerSubgroupTwo
},
data() {
return {
@ -318,11 +325,7 @@ isrideoFun(is){
</script>
<style>
.content {
padding-top: 80rpx;
padding-bottom: 20rpx;
}
.submit-button {
width: 686rpx;
border-radius: 50rpx;