意见反馈

master
tangyi 2022-03-17 16:16:14 +08:00
parent f3499c031f
commit 71e25e28ae
7 changed files with 567 additions and 16 deletions

View File

@ -116,13 +116,13 @@
// //
switch (index){ switch (index){
case 1: case 1:
uni.reLaunch({url:'/pages/tabbar/project-list/project-list'}) uni.reLaunch({url:'/pages/project/projectList'})
break; break;
case 2: case 2:
// uni.reLaunch({url:'/pages/tabbar/project-list/project-list'}) // uni.reLaunch({url:'/pages/tabbar/project-list/project-list'})
break; break;
case 3: case 3:
uni.reLaunch({url:'/pages/tabbar/feedback/feedback'}) uni.reLaunch({url:'/pages/feedback/feedback'})
break; break;
case 4: case 4:
uni.reLaunch({url:'/pages/tabbar/my/my'}) uni.reLaunch({url:'/pages/tabbar/my/my'})

View File

@ -78,7 +78,8 @@
"path": "pages/project/projectList", "path": "pages/project/projectList",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "",
"enablePullDownRefresh": false "enablePullDownRefresh": false,
"navigationStyle": "custom" //
} }
}, { }, {
@ -96,6 +97,15 @@
} }
} }
,{
"path" : "pages/feedback/feedback",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
], ],
"subPackages": [{ //A "subPackages": [{ //A
"root": "pagesA", "root": "pagesA",

162
pages/feedback/feedback.vue Normal file
View File

@ -0,0 +1,162 @@
<template>
<view>
<view class="opinion-type">
意见类型
</view>
<view class="opinion-type-content">
<view class="li" :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>
</view>
</view>
<view class="feedback-approach">
<view class="feedback-tel">
</view>
<view class="feedback-date">
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
typeData: [{
title: "未解决问题",
state: false
},
{
title: "处理不及时",
state: false
},
{
title: "软件问题",
state: false
},
{
title: "报修问题",
state: true
},
{
title: "服务投诉",
state: false
},
{
title: "其他问题反馈",
state: false
},
]
}
},
methods: {
}
}
</script>
<style>
page {
background-color: #F7F7F7;
}
.opinion-type {
width: 100%;
height: 80rpx;
line-height: 80rpx;
padding: 0 40rpx;
margin-top: 24rpx;
background-color: #FFFFFF;
font-size: 36rpx;
font-weight: bold;
}
.opinion-type-content .li {
width: 214rpx;
height: 68rpx;
background-color: #FFFFFF;
text-align: center;
line-height: 68rpx;
color: #dddddd;
border-radius: 8rpx;
margin-bottom: 24rpx;
}
.opinion-type-content {
padding: 22rpx 40rpx 0rpx;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.opinion-type-content .on {
background-color: #00A2E9;
color: #FFFFFF;
}
.inputCss {
height: 78rpx;
width: 100%;
box-sizing: border-box;
padding: 0rpx 17rpx;
font-size: 30rpx;
border-radius: 10rpx;
background-color: #FFFFFF;
color: #9f9898;
display: flex;
margin-bottom: 16rpx;
align-items: center;
}
.inputCss-input {
font-size: 26rpx;
color: #9f9898;
}
.feedback-input {
padding: 0 40rpx;
}
.fault-pictures {
display: flex;
align-items: center;
justify-content: center;
margin-top: 18rpx;
height: 388rpx;
box-sizing: border-box;
width: 100%;
background-color: #FFFFFF;
flex-direction: column;
}
.fault-pictures .img {
width: 62rpx;
margin-bottom: 27rpx;
height: 62rpx;
}
.fault-pictures .text {
font-size: 26rpx;
color: #9f9898;
}
</style>

View File

@ -44,10 +44,177 @@
</view> </view>
<view class="last-date"> <view class="last-date">
<view class="last-date-content"> <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="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> </view>
</template> </template>
@ -58,12 +225,31 @@
autoplay: true, autoplay: true,
interval: 3000, interval: 3000,
index: 1, index: 1,
recordState: [{
title: '维修记录',
state: true
},
{
title: '保养记录',
state: false
},
{
title: '巡检记录',
state: false
},
]
} }
}, },
methods: { methods: {
changeAutoplay(data) { changeAutoplay(data) {
console.log() console.log()
this.index = data.detail.current - 0 + 1 this.index = data.detail.current - 0 + 1
},
recordNav(index) {
for (var i = 0; i < this.recordState.length; i++) {
this.recordState[i].state = false
}
this.recordState[index].state = true
} }
} }
} }
@ -142,16 +328,201 @@
font-size: 24rpx; font-size: 24rpx;
color: #666666; color: #666666;
} }
.last-date { .last-date {
width: 100%; width: 100%;
padding: 10rpx 13rpx 10rpx; padding: 10rpx 13rpx 10rpx;
box-shadow: 0rpx 10rpx 10rpx rgba(0,0,0,0.1); box-shadow: 0rpx 5rpx 3rpx rgba(0, 0, 0, 0.1);
} }
.last-date-content { .last-date-content {
width: 100%; width: 100%;
height: 57rpx; height: 57rpx;
display: flex;
padding-left: 20rpx;
align-items: center;
border-radius: 10rpx; border-radius: 10rpx;
background: linear-gradient(to right, #FFEBEB, #F7F7F7); background: linear-gradient(to right, #FFEBEB, #F7F7F7);
} }
.last-date-content .icon {
width: 30rpx;
height: 30rpx;
margin-right: 20rpx;
}
.last-date-content .text {
font-size: 22rpx;
color: #333333;
}
.project-message-title {
display: flex;
padding: 0 33rpx;
align-items: center;
border-bottom: 2rpx solid #ebebeb;
margin-top: 23rpx;
padding-bottom: 21rpx;
}
.project-message-title .icon {
width: 8rpx;
height: 27rpx;
margin-right: 15rpx;
border-radius: 50rpx;
background: linear-gradient(#00A2e9, #bbe6f9);
}
.project-message-title .text {
font-size: 13rpx
}
.project-message-content {
display: flex;
box-shadow: 0rpx 5rpx 5rpx rgba(0, 0, 0, 0.1);
padding: 30rpx 25rpx 0rpx;
flex-wrap: wrap;
justify-content: space-between;
}
.project-message-content .title-one {
color: #4d4c4c;
font-size: 24rpx;
font-weight: bold;
width: 93rpx;
display: flex;
justify-content: space-between;
}
.project-message-content .li {
display: flex;
margin-bottom: 31rpx;
}
.project-message-content .title {
color: #4d4c4c;
font-weight: bold;
font-size: 24rpx
}
.project-message-content .text {
color: #4d4c4c;
font-size: 24rpx
}
.record-nav {
padding: 55rpx 50rpx 33rpx;
display: flex;
justify-content: space-between;
border-bottom: 2rpx solid #D5D4D4;
}
.record-nav .li {
font-size: 24rpx;
width: 128rpx;
text-align: center;
font-weight: bold;
position: relative;
}
.record-nav .on {
color: #00b1ff;
}
.record-nav .on::after {
content: "";
width: 100%;
height: 2rpx;
position: absolute;
background-color: #00B1FF;
top: 65rpx;
left: 0rpx;
}
.record-content {
margin-top: 33rpx;
padding: 0 52rpx;
}
.record-content .title {
color: #333333;
margin-left: 12rpx;
font-size: 24rpx;
margin-bottom: 33rpx;
}
.record-content .list .li {
display: flex;
align-items: center;
margin-bottom: 40rpx;
}
.record-content .list .li .icon {
width: 14rpx;
height: 14rpx;
margin-right: 50rpx;
border-radius: 50%;
background-color: #999999;
margin-left: 5rpx;
position: relative;
}
.record-content .list .li .icon::after {
content: "";
width: 1rpx;
position: absolute;
left: 7rpx;
height: 64rpx;
background-color: #999999;
top: 14rpx;
}
.record-content .list .li .con {
display: flex;
align-items: center;
font-size: 26rpx;
color: #999999;
}
.record-content .list .on .icon {
background-color: #5caefb;
width: 21rpx;
height: 21rpx;
margin-left: 1rpx;
display: flex;
align-items: center;
justify-content: center;
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: 1rpx;
position: absolute;
left: 9rpx;
height: 167rpx;
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;
}
</style> </style>

View File

@ -1,5 +1,6 @@
<template> <template>
<view class="content"> <view class="content">
<statusNav navBarTitle="项目列表"></statusNav>
<view class="project-list-input"> <view class="project-list-input">
<input type="text" class="int" value="" placeholder="请输入关键字" /> <input type="text" class="int" value="" placeholder="请输入关键字" />
<image class="search" src="../../static/ss.png" mode=""></image> <image class="search" src="../../static/ss.png" mode=""></image>
@ -114,12 +115,18 @@
</view> </view>
</view> </view>
<footTabOne :current="1"></footTabOne>
</view> </view>
</template> </template>
<script> <script>
import statusNav from '../../components/status-nav.vue';
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
export default { export default {
components:{
footTabOne,
statusNav
},
data() { data() {
const currentDate = this.getDate({ const currentDate = this.getDate({
format: true format: true

View File

@ -202,6 +202,7 @@
<image class="flexs mar-z20" :src="item.imgsrc" style="width: 280rpx;height: 112rpx;" mode="widthFix" lazy-load></image> <image class="flexs mar-z20" :src="item.imgsrc" style="width: 280rpx;height: 112rpx;" mode="widthFix" lazy-load></image>
</view> </view>
</view> </view>
<!-- 底部tab --> <!-- 底部tab -->
<foot-tab></foot-tab> <foot-tab></foot-tab>
</view> </view>

BIN
static/iocn/gzzt.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 511 B