Skip to content

A
applet
提交 00cecbbe authored 作者: 何忠建's avatar 何忠建
浏览文件
操作

维修页面

上级 7deae3d6
隐藏空白字符变更
内嵌 并排
正在显示 包含 636 行增加 和 0 行删除
pages/maintenance/index.vue 0 → 100644
浏览文件 @ 00cecbbe
<template>
<view class="container">
<view class="page">
<view class="maintenance">
<view class="information">
<view class="title green">浴霸不出水了<view class="tag">待派单</view>
</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区101栋2单元401</view>
</view>
<view class="item">
<view class="name">报修物品</view>
<view class="detail">水暖-浴霸</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2021/09/09 13：00 - 14：00</view>
</view>
</view>
</view>
<view class="information">
<view class="title red">浴霸不出水了<view class="tag">维修中</view>
</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区101栋2单元401</view>
</view>
<view class="item">
<view class="name">报修物品</view>
<view class="detail">水暖-浴霸</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2021/09/09 13：00 - 14：00</view>
</view>
<view class="item">
<view class="name">维修员</view>
<view class="detail">张三</view>
</view>
<view class="item">
<view class="name">联系方式</view>
<view class="detail">15415234562</view>
</view>
</view>
</view>
<view class="information">
<view class="title gray">浴霸不出水了<view class="tag">已完成</view>
</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区101栋2单元401</view>
</view>
<view class="item">
<view class="name">报修物品</view>
<view class="detail">水暖-浴霸</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2021/09/09 13：00 - 14：00</view>
</view>
<view class="item">
<view class="name">维修员</view>
<view class="detail">张三</view>
</view>
<view class="item">
<view class="name">联系方式</view>
<view class="detail">15415234562</view>
</view>
</view>
</view>
</view>
</view>
<view class="form-submit-fixed">
<view class="form-submit" @click="toEditor()">维修上报</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
methods: {
toEditor() {
uni.navigateTo({
url: '/pages/maintenanceAdd/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
background-color: #F8F6F9;
}
.maintenance {
.information {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
font-size: 32rpx;
color: #373737;
font-weight: bold;
margin-bottom: 30rpx;
.tag {
font-size: 22rpx;
padding: 2rpx 20rpx;
border-radius: 30rpx;
display: inline-block;
float: right;
}
}
.red {
border-left: 2px solid #F42E2E;
.tag {
color: #F42E2E;
border: 1px solid #F42E2E;
background-color: #FFF5F5;
}
}
.green {
border-left: 2px solid #10D680;
.tag {
color: #10D680;
border: 1px solid #10D680;
background-color: #F1FFF9;
}
}
.gray {
border-left: 2px solid #B6B6BA;
.tag {
color: #B6B6BA;
border: 1px solid #B6B6BA;
background-color: #F8F8F8;
}
}
.content {
border-top: 1px solid #F0F0F2;
padding-top: 20rpx;
.item {
display: flex;
height: 70rpx;
line-height: 70rpx;
.name {
width: 35%;
font-size: 28rpx;
color: #CECED3;
}
.detail {
font-size: 28rpx;
color: #373737;
}
}
}
}
}
.form-submit-fixed {
position: fixed;
width: 100%;
bottom: 10rpx;
}
.form-submit {
margin: 0 30rpx;
box-sizing: border-box;
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
}
</style>
\ No newline at end of file
pages/maintenanceAaudit/index.vue 0 → 100644
浏览文件 @ 00cecbbe
<template>
<view class="container">
<view class="page">
<view class="housing">
<view class="audit">
<view class="uni-icons"><uni-icons type="checkmarkempty" size="25" color="#F6C864"></uni-icons>
</view>
<view class="name">您的维修提交成功，请耐心等待</view>
</view>
<view class="steps-landscape">
<view class="title">维修流程</view>
<uni-steps :options="list2" active-color="#6A59F2" :active="active" direction="column" />
</view>
<view class="information">
<view class="title">报修信息</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区01栋2单元402</view>
</view>
<view class="item">
<view class="name">维修物品</view>
<view class="detail">电梯</view>
</view>
<view class="item">
<view class="name">标题</view>
<view class="detail">电梯坏了</view>
</view>
<view class="item">
<view class="name">手机号码</view>
<view class="detail">16589000078</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2022/09/09 14: 00 -16：00</view>
</view>
<view class="item text">
<view class="name">问题描述</view>
<view class="detail">9月9号上午电梯突然无法运行9月9号上午电梯突然无法运行9月9号上午电梯突然无法运行</view>
</view>
<view class="item text">
<view class="name">附件</view>
<view class="image">
<image src="../../static/images/img02.png" class="icon"></image>
<image src="../../static/images/img03.png" class="icon"></image>
</view>
</view>
</view>
</view>
<view class="form-submit" @click="toEditor()">修改</view>
<view class="form-delete" @click="deleteDialog">删除</view>
</view>
</view>
<uni-popup ref="popup" type="dialog">
<uni-popup-dialog type="error" cancelText="关闭" confirmText="同意" title="删除信息" content="确定要删除此信息吗？!"
@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
active: 1,
list2: [{
title: '提交维修申请',
desc: '提交成功'
}, {
title: '物业派单中',
desc: '物业派单中'
}]
}
},
methods: {
deleteDialog() {
this.$refs.popup.open()
},
dialogConfirm() {},
dialogClose() {
this.$refs.popup.close()
},
toEditor() {
uni.navigateTo({
url: '/pages/maintenanceAdd/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style lang="scss" scoped>
.page {
padding: 30rpx;
background-color: #F8F6F9;
min-height: 95vh;
}
.housing {
.audit {
display: flex;
flex-wrap: wrap;
justify-content: center;
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.uni-icons {
background-color: #F8F6F9;
text-align: center;
width: 100rpx;
height: 100rpx;
border-radius: 100rpx;
border: 2px dashed #6A59F2;
line-height: 100rpx;
}
.name {
margin-top: 20rpx;
font-size: 28rpx;
color: #373737;
width: 100%;
text-align: center;
}
}
.steps-landscape {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
border-left: 3px solid #6852F0;
font-size: 32rpx;
color: #373737;
margin-bottom: 20rpx;
}
}
}
.information {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
border-left: 3px solid #6852F0;
font-size: 32rpx;
color: #373737;
}
.content {
margin-top: 20rpx;
.item {
display: flex;
height: 70rpx;
line-height: 70rpx;
.name {
width: 35%;
font-size: 28rpx;
color: #CECED3;
}
.detail {
width: 65%;
font-size: 28rpx;
color: #373737;
}
}
.text {
height: auto;
.detail {
line-height: 52rpx;
}
.image {
display: flex;
.icon {
width: 120rpx;
height: 120rpx;
border-radius: 10rpx;
margin-right: 10rpx;
}
}
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 30rpx;
}
.form-delete {
height: 80rpx;
line-height: 80rpx;
background-color: #ffffff;
border: 1px solid #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #6A59F2;
}
</style>
\ No newline at end of file
pages/maintenanceAdd/index.vue 0 → 100644
浏览文件 @ 00cecbbe
<template>
<view class="container">
<view class="page">
<view class="maintenance">
<view class="form">
<uni-forms>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk">*</view>报修位置
</view>
<view class="form-item-fr">
<view class="form-item-tit">汉江之星小区</view>
<uni-icons type="forward" color="#E4E4EA"></uni-icons>
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk">*</view>报修物品
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入报修物品" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk"></view>标题
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入标题" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk"></view>证件号码
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入证件号码" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk">*</view>手机号码
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入手机号码" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk">*</view>预约上门时间
</view>
<view class="form-item-fr">
<uni-datetime-picker type="datetime" v-model="datetimesingle" :border="false" />
<uni-icons type="forward" color="#E4E4EA"></uni-icons>
</view>
</view>
<view class="form-item-text">
<view class="title">问题描述</view>
<view class="textarea">
<uni-easyinput type="textarea" v-model="baseFormData.introduction"
placeholder="请输入问题描述" /></uni-easyinput>
</view>
</view>
<view class="form-item-text">
<view class="title">问题图片(最多传三张)</view>
<view class="picker">
<uni-file-picker limit="3"></uni-file-picker>
</view>
</view>
</uni-forms>
</view>
<view class="form-submit" @click="toAudit()">下一步</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
formData: {
name: '',
},
datetimesingle: '',
}
},
methods: {
toAudit() {
uni.navigateTo({
url: '/pages/maintenanceAaudit/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx;
}
.maintenance {
.form {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.form-item {
display: flex;
align-items: center;
justify-content: space-between;
height: 84rpx;
line-height: 84rpx;
border-bottom: 1px solid #F8F6F9;
overflow: hidden;
}
.form-item-fl {
font-size: 28rpx;
color: #373737;
display: flex;
.asterisk {
color: #F42E2E;
width: 10rpx;
margin-right: 6rpx;
}
}
.form-item-fr {
display: flex;
flex: 2;
align-items: center;
justify-content: flex-end;
margin-left: 20rpx;
text-align: right;
}
.form-item-tit {
font-size: 28rpx;
color: #666;
margin-right: 20rpx;
text-align: right;
}
.form-item-text{
.title{
height: 84rpx;
line-height: 84rpx;
font-size: 28rpx;
color: #373737;
margin-left: 10rpx;
}
.textarea{
background-color: #F8F8F8;
}
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论