style: 计划列表格式化
This commit is contained in:
parent
8ea14a72c9
commit
1c5771d6ed
|
@ -40,7 +40,7 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="arealist">
|
||||
<view class="arealist" v-if="dataInfo.areas.length > 0">
|
||||
<view class="block-info" v-for="item in dataInfo.areas" :key="item.id">
|
||||
<view v-if="!item.isCompleted" class="schedule schedule-wait"
|
||||
>待保洁</view
|
||||
|
@ -67,12 +67,11 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<button @click="nfcResFn">
|
||||
{{errorShow}}
|
||||
</button>
|
||||
<button @click="nfcResFn(true)">刷卡成功</button>
|
||||
<button @click="nfcResFn(false)">刷卡失败</button>
|
||||
<!-- nfc刷卡成功弹窗 -->
|
||||
<u-popup v-model="successShow" mode="center" :round="30" >
|
||||
<view class="success-box">
|
||||
<u-popup v-model="successShow" mode="center" :round="30">
|
||||
<view class="success-box">
|
||||
<view class="box-content">
|
||||
<view class="logo"></view>
|
||||
<view class="content-title">刷卡成功</view>
|
||||
|
@ -81,11 +80,11 @@
|
|||
<view class="btn-success" @click="uploadFn">上传图片</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</u-popup>
|
||||
<!-- nfc刷卡失败弹窗 -->
|
||||
<u-popup v-model="errorShow" mode="center" :round="30" >
|
||||
<view class="error-box">
|
||||
<u-popup v-model="errorShow" mode="center" :round="30">
|
||||
<view class="error-box">
|
||||
<view class="box-content">
|
||||
<view class="logo"></view>
|
||||
<view class="content-title">刷卡失败</view>
|
||||
|
@ -94,8 +93,8 @@
|
|||
<view class="btn-success" @click="exceptionReportFn">异常上报</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
@ -141,11 +140,12 @@ export default {
|
|||
|
||||
paramsId: "",
|
||||
// 刷卡成功弹窗
|
||||
successShow:false,
|
||||
successShow: false,
|
||||
// 刷卡失败弹窗
|
||||
errorShow:false,
|
||||
errorShow: false,
|
||||
dataInfo: {
|
||||
planName: "",
|
||||
areas: [],
|
||||
},
|
||||
};
|
||||
},
|
||||
|
@ -173,29 +173,33 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
minutesToTime,
|
||||
nfcResFn(data){
|
||||
if(false){
|
||||
console.log('%c%s', 'color:red', 'nfc刷卡成功');
|
||||
minutesToTime,
|
||||
|
||||
nfcResFn(data) {
|
||||
if (data) {
|
||||
console.log("%c%s", "color:red", "nfc刷卡成功");
|
||||
this.successShow = true;
|
||||
}else{
|
||||
console.log('%c%s', 'color:red', '刷卡失败');
|
||||
} else {
|
||||
console.log("%c%s", "color:red", "刷卡失败");
|
||||
this.errorShow = true;
|
||||
}
|
||||
},
|
||||
// 上传图片
|
||||
uploadFn(){
|
||||
console.log('%c%s', 'color:red', '上传图片');
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/uploadPhoto",
|
||||
});
|
||||
uploadFn() {
|
||||
console.log("%c%s", "color:red", "上传图片");
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/uploadPhoto",
|
||||
});
|
||||
},
|
||||
// 异常上报
|
||||
exceptionReportFn(){
|
||||
console.log('%c%s', 'color:red', '异常上报');
|
||||
exceptionReportFn() {
|
||||
console.log("%c%s", "color:red", "异常上报");
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/list",
|
||||
});
|
||||
},
|
||||
openFn(){},
|
||||
closeFn(){},
|
||||
openFn() {},
|
||||
closeFn() {},
|
||||
changeTab(i) {
|
||||
this.selectIdx = i;
|
||||
|
||||
|
@ -363,128 +367,128 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
.success-box{
|
||||
.success-box {
|
||||
// overflow:hidden;
|
||||
width:650rpx;
|
||||
padding-top:50rpx;
|
||||
background-color:transparent;
|
||||
.box-content{
|
||||
height:450rpx;
|
||||
width: 650rpx;
|
||||
padding-top: 50rpx;
|
||||
background-color: transparent;
|
||||
.box-content {
|
||||
height: 450rpx;
|
||||
background-color: #ffffff;
|
||||
background: linear-gradient(to bottom, #A7DAFC, white 60%, white);
|
||||
border-radius:30rpx;
|
||||
background: linear-gradient(to bottom, #a7dafc, white 60%, white);
|
||||
border-radius: 30rpx;
|
||||
// border:1px solid red;
|
||||
position:relative;
|
||||
.logo{
|
||||
position:absolute;
|
||||
top:-50rpx;
|
||||
left:50%;
|
||||
transform:translateX(-50%);
|
||||
width:200rpx;
|
||||
height:200rpx;
|
||||
background-color:red;
|
||||
position: relative;
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: -50rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
background-color: red;
|
||||
}
|
||||
.content-title{
|
||||
position:absolute;
|
||||
top:40%;
|
||||
width:100%;
|
||||
color:black;
|
||||
font-size:40rpx;
|
||||
text-align:center;
|
||||
.content-title {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
width: 100%;
|
||||
color: black;
|
||||
font-size: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.btn-box{
|
||||
position:absolute;
|
||||
bottom:10%;
|
||||
width:100%;
|
||||
display:flex;
|
||||
justify-content:space-evenly;
|
||||
.btn-cancel{
|
||||
width:200rpx;
|
||||
height:70rpx;
|
||||
background-color:#F3F6F7;
|
||||
border-radius:50rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:30rpx;
|
||||
color:#32353B;
|
||||
.btn-box {
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
.btn-cancel {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background-color: #f3f6f7;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: #32353b;
|
||||
}
|
||||
.btn-success{
|
||||
width:200rpx;
|
||||
height:70rpx;
|
||||
background-color:#4278F4;
|
||||
border-radius:50rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:30rpx;
|
||||
color:white;
|
||||
.btn-success {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background-color: #4278f4;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.error-box{
|
||||
.error-box {
|
||||
// overflow:hidden;
|
||||
width:650rpx;
|
||||
padding-top:50rpx;
|
||||
background-color:transparent;
|
||||
.box-content{
|
||||
height:450rpx;
|
||||
width: 650rpx;
|
||||
padding-top: 50rpx;
|
||||
background-color: transparent;
|
||||
.box-content {
|
||||
height: 450rpx;
|
||||
background-color: #ffffff;
|
||||
background: linear-gradient(to bottom, #A7DAFC, white 60%, white);
|
||||
border-radius:30rpx;
|
||||
background: linear-gradient(to bottom, #a7dafc, white 60%, white);
|
||||
border-radius: 30rpx;
|
||||
// border:1px solid red;
|
||||
position:relative;
|
||||
.logo{
|
||||
position:absolute;
|
||||
top:-50rpx;
|
||||
left:50%;
|
||||
transform:translateX(-50%);
|
||||
width:200rpx;
|
||||
height:200rpx;
|
||||
background-color:red;
|
||||
position: relative;
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: -50rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
background-color: red;
|
||||
}
|
||||
.content-title{
|
||||
position:absolute;
|
||||
top:40%;
|
||||
width:100%;
|
||||
color:black;
|
||||
font-size:40rpx;
|
||||
text-align:center;
|
||||
.content-title {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
width: 100%;
|
||||
color: black;
|
||||
font-size: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.btn-box{
|
||||
position:absolute;
|
||||
bottom:10%;
|
||||
width:100%;
|
||||
display:flex;
|
||||
justify-content:space-evenly;
|
||||
.btn-cancel{
|
||||
width:200rpx;
|
||||
height:70rpx;
|
||||
background-color:#F3F6F7;
|
||||
border-radius:50rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:30rpx;
|
||||
color:#32353B;
|
||||
.btn-box {
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
.btn-cancel {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background-color: #f3f6f7;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: #32353b;
|
||||
}
|
||||
.btn-success{
|
||||
width:200rpx;
|
||||
height:70rpx;
|
||||
background-color:#4278F4;
|
||||
border-radius:50rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:30rpx;
|
||||
color:white;
|
||||
.btn-success {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background-color: #4278f4;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .u-mode-center-box{
|
||||
margin-top:-500rpx !important;
|
||||
background-color:transparent !important;
|
||||
::v-deep .u-mode-center-box {
|
||||
margin-top: -500rpx !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue