Merge branch 'main' of http://sl.vrgon.com:3000/LuYaShi/InspectionCleaning
This commit is contained in:
commit
6e79d1658d
|
@ -74,7 +74,11 @@
|
|||
<view class="success-box">
|
||||
<view class="box-content">
|
||||
<view class="logo">
|
||||
<image style="width: 100%; height: 100%; " src="/static/images/msg-success.png" alt="" /></image>
|
||||
<image
|
||||
style="width: 100%; height: 100%"
|
||||
src="/static/images/msg-success.png"
|
||||
alt=""
|
||||
/>
|
||||
</view>
|
||||
<view class="content-title">刷卡成功</view>
|
||||
<view class="btn-box">
|
||||
|
@ -89,9 +93,15 @@
|
|||
<view class="error-box">
|
||||
<view class="box-content">
|
||||
<view class="logo">
|
||||
<image style="width: 100%; height: 100%; " src="/static/images/msg-error.png" alt="" /></image>
|
||||
<image
|
||||
style="width: 100%; height: 100%"
|
||||
src="/static/images/msg-error.png"
|
||||
alt=""
|
||||
/>
|
||||
</view>
|
||||
<view class="content-title">
|
||||
NFC卡异常或丢失,可尝试重新刷卡或提交卡片异常信息
|
||||
</view>
|
||||
<view class="content-title">刷卡失败</view>
|
||||
<view class="btn-box">
|
||||
<view class="btn-cancel" @click="errorShow = false">暂不</view>
|
||||
<view class="btn-success" @click="exceptionReportFn">异常上报</view>
|
||||
|
@ -191,7 +201,7 @@ export default {
|
|||
// 上传图片
|
||||
uploadFn() {
|
||||
console.log("%c%s", "color:red", "上传图片");
|
||||
|
||||
|
||||
// 先关闭弹窗再跳转
|
||||
this.successShow = false;
|
||||
uni.navigateTo({
|
||||
|
@ -388,14 +398,14 @@ export default {
|
|||
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;
|
||||
position: relative;
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: -50rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
.content-title {
|
||||
position: absolute;
|
||||
|
@ -444,25 +454,27 @@ export default {
|
|||
.box-content {
|
||||
height: 450rpx;
|
||||
background-color: #ffffff;
|
||||
background: linear-gradient(to bottom, #FFEDDF, white 60%, white);
|
||||
border-radius:30rpx;
|
||||
background: linear-gradient(to bottom, #ffeddf, 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;
|
||||
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%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 80%;
|
||||
color: black;
|
||||
font-size: 40rpx;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.btn-box {
|
||||
|
@ -482,16 +494,16 @@ export default {
|
|||
font-size: 30rpx;
|
||||
color: #32353b;
|
||||
}
|
||||
.btn-success{
|
||||
width:200rpx;
|
||||
height:70rpx;
|
||||
background-color:#F76590;
|
||||
border-radius:50rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:30rpx;
|
||||
color:white;
|
||||
.btn-success {
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
background-color: #f76590;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,29 +2,58 @@
|
|||
<view class="content">
|
||||
<view class="top">
|
||||
<u-cell-group>
|
||||
<u-cell-item :arrow="false" title="保洁人员" value="小饼"></u-cell-item>
|
||||
<u-cell-item
|
||||
:arrow="false"
|
||||
title="保洁人员"
|
||||
:value="baseInfo.cleaner"
|
||||
:title-style="{
|
||||
color: '#303133',
|
||||
fontSize: '32rpx',
|
||||
}"
|
||||
:value-style="{
|
||||
color: '#303133',
|
||||
fontSize: '32rpx',
|
||||
}"
|
||||
></u-cell-item>
|
||||
<u-cell-item
|
||||
:arrow="false"
|
||||
title="上报时间"
|
||||
value="2025.4.1"
|
||||
:value="baseInfo.reportTime"
|
||||
:title-style="{
|
||||
color: '#303133',
|
||||
fontSize: '32rpx',
|
||||
}"
|
||||
:value-style="{
|
||||
color: '#303133',
|
||||
fontSize: '32rpx',
|
||||
}"
|
||||
></u-cell-item>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
|
||||
<view class="title">保洁区域</view>
|
||||
<!-- <view class="title">保洁区域</view> -->
|
||||
|
||||
<view class="bottom">
|
||||
<u-form :model="form" :rules="rules" ref="uForm" label-width="200">
|
||||
<u-form
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
ref="uForm"
|
||||
label-width="200"
|
||||
:label-style="{ fontSize: '32rpx' }"
|
||||
>
|
||||
<!-- 区域选择(多选) -->
|
||||
<u-form-item label="东大门操场" prop="areas" required>
|
||||
<u-input v-model="form.cleaner" placeholder="请输入故障" />
|
||||
<u-form-item :label="baseInfo.area" prop="areas">
|
||||
<!-- <u-input v-model="form.cleaner" placeholder="请输入故障" /> -->
|
||||
<view style="width: 100%; font-size: 32rpx; text-align: right"
|
||||
>NFC卡损坏</view
|
||||
>
|
||||
</u-form-item>
|
||||
|
||||
<!-- 备注(文本域) -->
|
||||
<u-form-item label="备注" prop="notes" label-position="top">
|
||||
<u-input
|
||||
v-model="form.notes"
|
||||
placeholder="请输入备注信息"
|
||||
placeholder="请对故障进行描述"
|
||||
autoHeight
|
||||
maxlength="200"
|
||||
count
|
||||
|
@ -33,41 +62,60 @@
|
|||
</u-form-item>
|
||||
|
||||
<!-- 图片上传 -->
|
||||
<u-form-item
|
||||
label="现场照片"
|
||||
prop="images"
|
||||
required
|
||||
label-position="top"
|
||||
>
|
||||
<u-upload
|
||||
<u-form-item label="图片" prop="images" label-position="top">
|
||||
<!-- <u-upload
|
||||
v-model="form.images"
|
||||
:max-count="3"
|
||||
:previewFullImage="true"
|
||||
:multiple="true"
|
||||
@afterRead="handleImageUpload"
|
||||
@delete="handleImageDelete"
|
||||
></u-upload>
|
||||
></u-upload> -->
|
||||
<view v-if="!form.url" class="upload-box" @click="takePhoto">
|
||||
<image
|
||||
src="/static/images/icon-camera.png"
|
||||
mode="aspectFit"
|
||||
style="width: 49rpx; height: 43rpx"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view v-else class="upload-image">
|
||||
<image
|
||||
:src="form.url"
|
||||
mode="aspectFit"
|
||||
style="width: 100%; height: 100%"
|
||||
/>
|
||||
<view class="delete-icon" @click="handleDelete">×</view>
|
||||
</view>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</view>
|
||||
|
||||
<!-- 提交按钮 -->
|
||||
<u-button @click="submitForm" style="margin-top: 40rpx" type="primary"
|
||||
<u-button
|
||||
shape="circle"
|
||||
type="primary"
|
||||
style="margin-top: 40rpx"
|
||||
@click="submitForm"
|
||||
>保存</u-button
|
||||
>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ReportingNFCDanger } from "@/api/apiList";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseInfo: {
|
||||
cleaner: "小饼", // 保洁人员
|
||||
reportTime: "2025.4.1", // 上报时间
|
||||
area: "东大门操场", // 清洁区域
|
||||
},
|
||||
form: {
|
||||
cleaner: "", // 保洁人员
|
||||
reportTime: "", // 上报时间
|
||||
areas: [], // 清洁区域
|
||||
notes: "", // 备注
|
||||
images: [], // 图片列表
|
||||
url: "", // 图片
|
||||
},
|
||||
areaOptions: [
|
||||
{ label: "东大门操场", value: "east_gate" },
|
||||
|
@ -97,7 +145,7 @@ export default {
|
|||
trigger: ["change"],
|
||||
},
|
||||
],
|
||||
images: [
|
||||
url: [
|
||||
{
|
||||
type: "array",
|
||||
min: 1,
|
||||
|
@ -122,37 +170,119 @@ export default {
|
|||
this.form.images.splice(index, 1);
|
||||
},
|
||||
|
||||
// 表单提交
|
||||
submitForm() {
|
||||
this.$refs.uForm.validate().then((valid) => {
|
||||
if (valid) {
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
icon: "success",
|
||||
});
|
||||
// 这里添加实际提交逻辑
|
||||
}
|
||||
// 拍照获取图片
|
||||
takePhoto() {
|
||||
uni.chooseImage({
|
||||
count: 1, // 每次拍摄1张
|
||||
sourceType: ["camera"], // 仅限拍照
|
||||
sizeType: ["compressed"], // 压缩图片
|
||||
success: async (res) => {
|
||||
console.log("拍照成功", res);
|
||||
this.form.url = res.tempFilePaths[0];
|
||||
|
||||
// this.uploadFiles(res.tempFilePaths[0]);
|
||||
},
|
||||
fail: (err) => {
|
||||
uni.showToast({ title: "拍照失败,请重试", icon: "none" });
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 删除图片
|
||||
handleDelete() {
|
||||
this.form.url = "";
|
||||
},
|
||||
|
||||
// 表单提交
|
||||
async submitForm() {
|
||||
if (!this.form.url) {
|
||||
uni.showToast({ title: "请上传图片", icon: "none" });
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(this.form);
|
||||
|
||||
return;
|
||||
|
||||
const res = await ReportingNFCDanger({
|
||||
...this.form,
|
||||
|
||||
// 以下数据待获取
|
||||
id: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
|
||||
userId: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
|
||||
reportingTime: "2025-04-10T08:02:40.917Z",
|
||||
note: "string",
|
||||
url: "string",
|
||||
planInfoId: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
|
||||
});
|
||||
|
||||
if (res.succeed) {
|
||||
console.log(res);
|
||||
uni.showToast({ title: "上报成功", icon: "success" });
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f3f5fa;
|
||||
}
|
||||
.content {
|
||||
height: auto;
|
||||
min-height: 100vh;
|
||||
// min-height: 100vh;
|
||||
padding: 24rpx 32rpx;
|
||||
background-color: #f3f5fa;
|
||||
|
||||
.bottom,
|
||||
.top {
|
||||
background: #ffffff;
|
||||
border-radius: 22rpx;
|
||||
padding: 0rpx 32rpx;
|
||||
padding: 0rpx 10rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
background: #ffffff;
|
||||
border-radius: 22rpx;
|
||||
padding: 0rpx 40rpx;
|
||||
margin-bottom: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
.upload-box {
|
||||
border: 1px dashed #526fa3;
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
background-color: #edf2ff;
|
||||
border-radius: 16rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.upload-image {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 16rpx;
|
||||
|
||||
position: relative;
|
||||
.delete-icon {
|
||||
position: absolute;
|
||||
right: -10rpx;
|
||||
top: -10rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
background: rgba(110, 110, 110, 0.6);
|
||||
border-radius: 50%;
|
||||
color: white;
|
||||
text-align: center;
|
||||
line-height: 36rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 38rpx;
|
||||
color: #1a1a1b;
|
||||
|
|
|
@ -121,7 +121,7 @@ export default {
|
|||
planList: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
onShow() {
|
||||
this.getPlanList();
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -281,7 +281,7 @@ page {
|
|||
top: -10rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
background: #6d6d6d;
|
||||
background: rgba(110, 110, 110, 0.6);
|
||||
border-radius: 50%;
|
||||
color: white;
|
||||
text-align: center;
|
||||
|
|
Loading…
Reference in New Issue