2143 lines
64 KiB
Vue
2143 lines
64 KiB
Vue
<template>
|
||
<view class="main">
|
||
<scroll-view class="pageScroll" :scroll-y="true">
|
||
<view class="topContent">
|
||
<view class="placeBox">
|
||
<view class="placeName">{{ detailObj.title || "-" }}</view>
|
||
|
||
<view class="userBox">
|
||
<view class="userTop">
|
||
<text class="userName">{{ user.Membership_Name || "" }}</text>
|
||
<text class="labelBox">巡查人员</text>
|
||
</view>
|
||
<view class="timeBox">
|
||
<image class="timeIcon" src="/static/images/mbwa/timeIcon.svg" />
|
||
<text class="nowTime">{{ now_time || "-" }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="inspectionContent">
|
||
<view class="contentTop">
|
||
巡检内容<span class="required">*</span>
|
||
</view>
|
||
<textarea v-model="uploadResult" class="contentBox" placeholder="请输入巡查内容，并上传现场照片"
|
||
placeholderStyle="font-size: 24rpx;color: #CDCED1" :auto-height="true"></textarea>
|
||
<view class="uploadImgBox">
|
||
<div class="submitImgBox" @click="submitImg">
|
||
<image class="addIcon" src="/static/images/mbwa/addImageIcon.svg" />
|
||
</div>
|
||
|
||
<div class="imgItem" v-for="(item, index) in imgsList" :key="index">
|
||
<image :src="item" @tap="showImg2(index, imgsList)" mode="aspectFill" />
|
||
<view class="closeBox" @click.stop="deleteImgFunc(item, index)">
|
||
<image class="closeIcon" src="/static/images/mbwa/closeIcon.svg" />
|
||
</view>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="qusetionBox">
|
||
<!-- requestionRadioList -->
|
||
<!-- requestionCheckedList -->
|
||
|
||
<!-- 单选题 -->
|
||
<view v-if="requestionRadioList && requestionRadioList.length > 0">
|
||
<view class="questionItem" v-for="(item, index) in requestionRadioList" :key="index">
|
||
<view class="quetionTitle">
|
||
<!-- @click="handleShowCheckPopup(item, 'radio')" -->
|
||
<view class="quetionLeft">
|
||
{{ item.question.title
|
||
}}<text class="required" v-if="item.isRequired">*</text>
|
||
</view>
|
||
|
||
<!-- <view class="quetionRight">
|
||
<text class="placeSelect" v-if="
|
||
!(item.choiceResponse && item.choiceResponse.length > 0)
|
||
">请选择</text>
|
||
<image class="rightArrow" src="/static/images/mbwa/rightArrow.svg" />
|
||
</view> -->
|
||
</view>
|
||
<!-- v-if="!(item.choiceResponse && item.choiceResponse.length > 0)" -->
|
||
<view class="choiceResList">
|
||
<radio-group @change="handleOutRadioChange($event, item)">
|
||
<label class="choiceItem" v-for="(subItem, subIndex) in item.question.options" :key="subItem.text"
|
||
:style="{ marginBottom: subIndex + 1 === item.question.options.length ? '0' : '' }">
|
||
<view>
|
||
<radio :checked="item.choiceResponse[0] === subItem.text" :value="subItem.text" color="#409eff"
|
||
style="transform: scale(0.8)" />
|
||
<!-- :checked="subIndex === current" -->
|
||
</view>
|
||
<view>{{ subItem.text }}</view>
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
|
||
<!--
|
||
<view class="checkedBottom" v-if="item.choiceResponse && item.choiceResponse.length > 0">
|
||
<view class="bottomItem" v-for="(subItem, subIndex) in item.choiceResponse" :key="subIndex">
|
||
{{ subItem || "" }}
|
||
<image @click="handDeleteChecked(item, subItem, 'radio')" class="closeIcon"
|
||
src="/static/images/mbwa/closeIcon.svg" />
|
||
</view>
|
||
</view> -->
|
||
|
||
<view class="uploadImgBox" v-if="item.showAddImg">
|
||
<div class="submitImgBox" @click="submitImg($event, item, 'response')">
|
||
<image class="addIcon" src="/static/images/mbwa/addImageIcon.svg" />
|
||
</div>
|
||
|
||
<div class="imgItem" v-for="(subItem, subIndex) in item.imageResponse" :key="subIndex">
|
||
<image :src="subItem" @tap="showImg2(subIndex, item.imageResponse)" mode="aspectFill" />
|
||
<view class="closeBox" @click.stop="
|
||
deleteImgFuncResponse(item.imageResponse, subIndex)
|
||
">
|
||
<image class="closeIcon" src="/static/images/mbwa/closeIcon.svg" />
|
||
</view>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 多选题 暂时没有不进行显示 -->
|
||
<!-- <view v-if="requestionCheckedList && requestionCheckedList.length > 0">
|
||
<view class="requestionCheckedItem" v-for="(item, index) in requestionCheckedList" :key="index">
|
||
<view class="checkedTop" @click="handleShowCheckPopup(item, 'checked')">
|
||
<view class="topLeft">
|
||
{{ item.question.title || ""
|
||
}}<text class="required" v-if="item.isRequired">*</text>
|
||
</view>
|
||
<view class="topRight">
|
||
<text class="placeSelect" v-if="!(item.isChecked && item.isChecked.length > 0)">请选择</text>
|
||
<image class="rightArrow" src="/static/images/mbwa/rightArrow.svg" />
|
||
</view>
|
||
</view>
|
||
<view class="checkedBottom" v-if="item.isChecked && item.isChecked.length > 0">
|
||
<view class="bottomItem" v-for="(subItem, subIndex) in item.isChecked" :key="subIndex">
|
||
{{ subItem.text || "" }}
|
||
<image @click="handDeleteChecked(item, subItem, 'checked')" class="closeIcon"
|
||
src="/static/images/mbwa/closeIcon.svg" />
|
||
</view>
|
||
</view> -->
|
||
|
||
<!-- <checkbox-group @change="handleChangeCheck">
|
||
<label
|
||
class="checkItem"
|
||
v-for="(subItem, subIndex) in item.question.options"
|
||
:key="subIndex"
|
||
>
|
||
<view>
|
||
<checkbox :value="subItem.text" />
|
||
</view>
|
||
<view>{{ subItem.text }}</view>
|
||
</label>
|
||
</checkbox-group> -->
|
||
<!-- </view>
|
||
</view> -->
|
||
|
||
|
||
</view>
|
||
|
||
<view class="otherBox">
|
||
<view class="questionItem">
|
||
<view class="quetionTitle">情况类型<text class="required">*</text></view>
|
||
|
||
<radio-group class="radioGroup" @change="handleChangeSituationType">
|
||
<label class="radioItem">
|
||
<view>
|
||
<radio color="#3B72FF" :value="'0'" :checked="0 === current" />
|
||
</view>
|
||
<view style="font-size: 24rpx">情况正常</view>
|
||
</label>
|
||
<label class="radioItem">
|
||
<view>
|
||
<radio color="#3B72FF" :value="'1'" :checked="1 === current" />
|
||
</view>
|
||
<view style="font-size: 24rpx; text-align: left">急需处理</view>
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
</scroll-view>
|
||
|
||
<view class="bottomBtnBox">
|
||
<view class="bottomBtn" @click="submitUpload">提交</view>
|
||
</view>
|
||
<!--
|
||
<view v-if="false">
|
||
<div class="pageHeader">
|
||
<div class="hederContent">
|
||
<img :src="user.Membership_Headimage" alt="" />
|
||
<div>
|
||
<p>{{ user.Membership_Name || "" }}</p>
|
||
<p class="fs12">巡查人员</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="addressBox">
|
||
<div class="contentBox">
|
||
<image src="/static/images/publicity/dingwei.png" mode="aspectFit" class="addressIcon"></image>
|
||
<div>
|
||
<p class="xuncha address">{{ detailObj.title || "-" }}</p>
|
||
<div>
|
||
<span>巡查时间：</span><span>{{ now_time }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="formBox">
|
||
<ul>
|
||
<li>
|
||
<span :class="inputfocus
|
||
? 'circle circleActive circle-first '
|
||
: 'circle circle-first'
|
||
"></span>
|
||
<div class="examineContent">
|
||
<div class="titleBox">
|
||
<i :class="inputfocus ? 'img-zds activezds' : 'img-zds'"></i>
|
||
<div :class="inputfocus ? 'titleTextActive' : 'titleText'" style="display: flex">
|
||
<i style="color: red; margin-right: 5px">*</i>巡查内容
|
||
</div>
|
||
</div>
|
||
|
||
<div class="inputBox">
|
||
<textarea auto-height v-model="uploadResult" placeholder="请输入巡查内容" focus="true"
|
||
@focus="inputfocus = true" @blur="inputfocus = false"></textarea>
|
||
</div>
|
||
|
||
<div class="tagList" v-for="(tags, i) in tagList" :key="i">
|
||
<div class="tagName">
|
||
<span style="display: inline-block; max-width: calc(100% - 10rpx)">
|
||
{{ tags.question.title || "" }}
|
||
</span>
|
||
<span v-if="tags.isRequired" style="color: red">*</span>
|
||
</div>
|
||
<div class="tagsBox">
|
||
<div v-for="(tag, s) in tags.question.options" :key="s" @tap="selectTag(tag, tags.question)"
|
||
:class="tag.ischecked ? 'tagUnit active ' : 'tagUnit'">
|
||
{{ tag.text }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
|
||
<li>
|
||
<span :class="imgfocus ? 'circleActive' : 'circle'"></span>
|
||
<div class="examineContent">
|
||
<div class="titleBox">
|
||
<i :class="imgfocus ? 'img-upload activeupload' : 'img-upload'"></i>
|
||
<div style="display: flex" :class="imgfocus ? 'titleTextActive' : 'titleText'">
|
||
<i style="color: red; margin-right: 5px">*</i>请上传现场图片
|
||
</div>
|
||
</div>
|
||
<div class="uploadBox">
|
||
<div class="uploadList" v-for="(item, index) in imgsList" :key="index">
|
||
<span class="upload-file-remove" @click.stop="deleteImgFunc(item, index)">×</span>
|
||
<image :src="item" @tap="showImg2(index, imgsList)" mode="aspectFill" />
|
||
</div>
|
||
<div class="uploadAdd" @click="submitImg">
|
||
<div class="upload-file-add-container">
|
||
<span class="walk-manage-plus">+</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
|
||
<li>
|
||
<span :class="radiofocus
|
||
? 'circle circleActive circle-last'
|
||
: 'circle circle-last'
|
||
">
|
||
</span>
|
||
<div class="examineContent">
|
||
<radio-group @change="radioChange" style="display: flex" @click="radioFocus" @blur="radiofocus = false">
|
||
<label class="uni-list-cell" v-for="(item, index) in options" :key="item.value">
|
||
<view>
|
||
<radio :value="item.value" color="#409eff" :checked="index === current"
|
||
style="transform: scale(0.8)" />
|
||
</view>
|
||
<view>{{ item.name }}</view>
|
||
</label>
|
||
</radio-group>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
|
||
<button v-if="!submit" class="btn" @click="submitUpload">提交</button>
|
||
</div>
|
||
</view> -->
|
||
|
||
<uniPopup ref="checkPopup" type="bottom" :show="isShowPopup" @hidePopup="handleClosePopup">
|
||
<view class="popupBox">
|
||
<scroll-view class="checkPopupContent" :scroll-y="true">
|
||
<view v-if="questionType === 'checked'">
|
||
<view class="anwersList" v-if="popupShowObj">
|
||
<view class="anwersItem" v-for="(item, index) in popupShowObj.question.options" :key="index"
|
||
@click="handleCheckAnwers(popupShowObj, item)">
|
||
<view :class="item.checked ? 'anwers selectAnwersItem' : 'anwers'">
|
||
{{ item.text || "" }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="questionType === 'radio'">
|
||
<radio-group class="radioGroup" v-if="
|
||
popupShowObj.question &&
|
||
popupShowObj.question.options &&
|
||
popupShowObj.question.options.length > 0
|
||
" @change="radioChange($event, popupShowObj)">
|
||
<label class="radioItem" v-for="(subItem, subIndex) in popupShowObj.question.options" :key="subIndex">
|
||
<view>
|
||
<radio color="#3B72FF" iconColor="#3B72FF" :value="subItem.text"
|
||
:checked="popupShowObj.choiceResponse[0] === subItem.text" />
|
||
</view>
|
||
<view style="font-size: 24rpx; text-align: left">{{
|
||
subItem.text
|
||
}}</view>
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<view class="bottomBtnBox">
|
||
<view class="bottomBtn" @click="handleClosePopup">确认</view>
|
||
</view>
|
||
</view>
|
||
</uniPopup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters } from "vuex";
|
||
import uniPopup from "@/components/uni-popup";
|
||
export default {
|
||
data() {
|
||
let nowTime = this.$util.cutDate(new Date(), "YYYY-MM-DD hh:mm:ss");
|
||
return {
|
||
now_time: nowTime,
|
||
inputfocus: true, // 是否聚焦
|
||
uploadResult: "", // 巡查内容
|
||
tagList: [], // 当前显示的巡查内容
|
||
imgfocus: false, // 是否聚焦图片
|
||
radiofocus: false, // 类型的聚焦
|
||
options: [
|
||
{
|
||
name: "情况正常",
|
||
value: "0",
|
||
},
|
||
{
|
||
name: "急需处理",
|
||
value: "1",
|
||
},
|
||
],
|
||
value: "0",
|
||
current: 0,
|
||
selectAnwersList: [], // 选择的答案列表
|
||
selectAnwersObj: {}, // 已经选择答案的实际对象格式 问题的id: [选项1，选项2]
|
||
detailObj: {}, //点位详情
|
||
imgsList: [],
|
||
submit: false, // 是否提交成功了
|
||
requiredList: [], // 必填项的数组
|
||
|
||
requestionRadioList: [], // 单选题
|
||
requestionCheckedList: [], // 多选题
|
||
isShowPopup: false, // 显示弹出框
|
||
popupShowObj: {},
|
||
questionType: "", // 判断是 单选还是多选
|
||
submiting: false, // 判断是否已经点击过了
|
||
isSubmitted: false,// 判断是否已经提交成功了
|
||
};
|
||
},
|
||
components: {
|
||
uniPopup,
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "getUser",
|
||
}),
|
||
},
|
||
async onLoad(query) {
|
||
// pageType 1的话 就是将缓存信息录入 没有就是重新开始
|
||
console.log("query", query);
|
||
|
||
await this.handleGetModalData(query.id);
|
||
|
||
let CacheObj = uni.getStorageSync('CacheObj')
|
||
if (CacheObj && query.pageType === '1') {
|
||
|
||
this.handleSetCacheDetial(CacheObj)
|
||
}
|
||
},
|
||
onUnload() {
|
||
// 没提交过就走了 说明是需要进行缓存的
|
||
if (!this.isSubmitted) {
|
||
// 巡检内容
|
||
let inspectionContent = this.uploadResult
|
||
// 上面的巡检图片
|
||
let inspectionImgList = this.imgsList
|
||
// 情况类型
|
||
let situation = this.current // 0 正常 1 紧急
|
||
|
||
console.log('dsadasd', this.requestionRadioList);
|
||
|
||
// 把当前已经选择了的问题答案 记录一下
|
||
let chooseAnswer = {}
|
||
|
||
if (this.requestionRadioList && this.requestionRadioList.length > 0) {
|
||
this.requestionRadioList.forEach((item) => {
|
||
if (item.choiceResponse) {
|
||
chooseAnswer[item.id] = {
|
||
choiceResponse: item.choiceResponse,
|
||
imageResponse: item.imageResponse
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
|
||
// 需要缓存的内容
|
||
let CacheObj = {
|
||
inspectionContent: inspectionContent, // 巡检内容
|
||
inspectionImgList: inspectionImgList, // 巡检图片
|
||
situation: situation, // 0 正常 1 紧急
|
||
chooseAnswer: chooseAnswer,// 当前已经选择了的记录问题
|
||
id: this.detailObj.id,// 点位id
|
||
title: this.detailObj.title
|
||
}
|
||
|
||
uni.setStorageSync('CacheObj', CacheObj)
|
||
}
|
||
},
|
||
methods: {
|
||
// 将缓存记录中的内容 再赋值到这条记录里面
|
||
handleSetCacheDetial(CacheObj) {
|
||
// 巡检内容
|
||
this.uploadResult = CacheObj.inspectionContent
|
||
// 巡检图片
|
||
this.imgsList = CacheObj.inspectionImgList
|
||
// 是否异常
|
||
this.current = CacheObj.situation
|
||
|
||
// 把缓存里面已经有了的数据 匹配到问题列表的字段里面
|
||
if (CacheObj.chooseAnswer) {
|
||
let obj = CacheObj.chooseAnswer
|
||
let list = JSON.parse(JSON.stringify(this.requestionRadioList))
|
||
|
||
for (let key in obj) {
|
||
if (list && list.length > 0) {
|
||
list.forEach(item => {
|
||
|
||
if (Number(item.id) === Number(key)) {
|
||
item.choiceResponse = obj[key].choiceResponse
|
||
item.imageResponse = obj[key].imageResponse
|
||
item.showAddImg = obj[key].imageResponse && obj[key].imageResponse.length > 0
|
||
}
|
||
})
|
||
}
|
||
}
|
||
this.requestionRadioList = list
|
||
|
||
}
|
||
|
||
},
|
||
// 新的 在外面选择答案的内容
|
||
handleOutRadioChange(e, obj) {
|
||
console.log('eeee', e);
|
||
console.log('objobjobjobjobj', obj);
|
||
|
||
let requestionList = obj.question.options
|
||
let score = 0
|
||
requestionList.forEach(item => {
|
||
if (item.text === e.detail.value) {
|
||
score = item.mark
|
||
if (item.mark !== 1) {
|
||
obj.showAddImg = true;
|
||
} else {
|
||
obj.showAddImg = false;
|
||
}
|
||
}
|
||
})
|
||
obj.choiceResponse = [e.detail.value]
|
||
obj.score = score
|
||
// obj.question = {
|
||
// ...obj.question,
|
||
// choiceResponse: [e.detail.value],
|
||
// score: score
|
||
// }
|
||
|
||
console.log("requestionRadioList", this.requestionRadioList);
|
||
if (this.requestionRadioList && this.requestionRadioList.length > 0) {
|
||
// 判断有没有选择了 0分的 因为 单选 只要选了就不能改
|
||
// 且 不选之前 mark的值为undefined 选了 就是0 或 1
|
||
let haveError = false;
|
||
this.requestionRadioList.forEach((item) => {
|
||
if (item.score === 0) {
|
||
haveError = true;
|
||
}
|
||
});
|
||
if (haveError) {
|
||
this.current = 1;
|
||
} else {
|
||
this.current = 0;
|
||
}
|
||
}
|
||
this.$forceUpdate()
|
||
},
|
||
// 删除图片
|
||
deleteImgFunc(item, index) {
|
||
this.imgsList.splice(index, 1);
|
||
},
|
||
// 删除答案里面的图片
|
||
deleteImgFuncResponse(item, index) {
|
||
console.log("item", item);
|
||
item = item.splice(index, 1);
|
||
this.$forceUpdate();
|
||
},
|
||
// 提交表单内容
|
||
async submitUpload() {
|
||
console.log("user", this.user);
|
||
console.log("this.detailObj", this.detailObj);
|
||
|
||
if (!this.uploadResult) {
|
||
uni.showToast({
|
||
title: "请输入巡查内容！",
|
||
icon: "none",
|
||
});
|
||
return;
|
||
}
|
||
|
||
if (!(this.imgsList && this.imgsList.length > 0)) {
|
||
uni.showToast({
|
||
title: "请上传现场照片！",
|
||
icon: "none",
|
||
});
|
||
return;
|
||
}
|
||
|
||
let AllOK = true;
|
||
// 判断有没有 异常项选择了
|
||
let haveError = false;
|
||
|
||
let questionResponsesList = [];
|
||
|
||
console.log("this.requestionRadioList", this.requestionRadioList);
|
||
console.log("this.requestionCheckedList", this.requestionCheckedList);
|
||
|
||
// 看单选题中是否有必填的没填
|
||
if (this.requestionRadioList && this.requestionRadioList.length > 0) {
|
||
this.requestionRadioList.forEach((item) => {
|
||
if (item.isRequired) {
|
||
if (item.choiceResponse && item.choiceResponse.length > 0) {
|
||
} else {
|
||
AllOK = false;
|
||
}
|
||
}
|
||
|
||
if (item.showAddImg) {
|
||
if (item.imageResponse && item.imageResponse.length > 0) {
|
||
} else {
|
||
AllOK = false;
|
||
}
|
||
}
|
||
|
||
if (item.choiceResponse && item.choiceResponse.length > 0) {
|
||
questionResponsesList.push({
|
||
questionId: item.questionId,
|
||
textResponse: "",
|
||
choiceResponse: item.choiceResponse,
|
||
imageResponse: item.imageResponse,
|
||
// score: item.choiceResponse[0].mark || (item.mark ? item.mark : 0),
|
||
score: item.score,
|
||
});
|
||
let mark =
|
||
item.choiceResponse[0].mark || (item.mark ? item.mark : 0);
|
||
if (mark === 0) {
|
||
haveError = true;
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
// 看多选题中是否有必填的没填
|
||
if (this.requestionCheckedList && this.requestionCheckedList.length > 0) {
|
||
this.requestionCheckedList.forEach((item) => {
|
||
if (item.isRequired) {
|
||
if (item.isChecked && item.isChecked.length > 0) {
|
||
} else {
|
||
AllOK = false;
|
||
}
|
||
}
|
||
if (item.isChecked && item.isChecked.length > 0) {
|
||
questionResponsesList.push({
|
||
questionId: item.questionId,
|
||
textResponse: "",
|
||
choiceResponse: item.isChecked,
|
||
imageResponse: item.imageResponse,
|
||
score: item.isChecked[0].mark || (item.mark ? item.mark : 0),
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
if (!AllOK) {
|
||
uni.showToast({
|
||
title: "有必填项未填写，请检查！",
|
||
icon: "none",
|
||
});
|
||
return;
|
||
}
|
||
console.log("haveError", haveError);
|
||
if (!haveError && this.current === 1) {
|
||
uni.showToast({
|
||
title: "考核过程均为正常，请检查！",
|
||
icon: "none",
|
||
});
|
||
return;
|
||
}
|
||
|
||
|
||
if (this.submiting) {
|
||
return;
|
||
}
|
||
|
||
this.submiting = true;
|
||
let extendObj = {
|
||
uploadResult: this.uploadResult,
|
||
imgsList: this.imgsList,
|
||
situation: this.current, // 0 正常 1 紧急
|
||
errorStatus: this.current === 1 ? 0 : undefined, // 0是经理选择人 1 是反馈结果
|
||
};
|
||
|
||
const req = {
|
||
...extendObj,
|
||
templateId: this.detailObj.id,
|
||
userId: this.user.UserId,
|
||
userName: this.user.UserName,
|
||
// extend: extendObj ? extendObj : "",
|
||
completed: true,
|
||
placeId: 0,
|
||
placeName: this.detailObj.title,
|
||
provinceId: this.user.ProvinceCode,
|
||
provinceName: "",
|
||
serverPartId: this.detailObj.serverPartId,
|
||
serverPartName: this.detailObj.serverPartName,
|
||
questionResponses: questionResponsesList,
|
||
};
|
||
|
||
console.log("req", req);
|
||
// 原node接口
|
||
// const data = await this.$request.$webNodePOST(
|
||
// `questionnaire-responses`,
|
||
// req
|
||
// );
|
||
// 新java接口
|
||
const data = await this.$request.$webJavaPOST(
|
||
`questionnaire-responses/save`,
|
||
req
|
||
);
|
||
console.log("data", data);
|
||
|
||
|
||
console.log("data", data);
|
||
if (data.Result_Code === 100) {
|
||
this.submit = true;
|
||
uni.showToast({
|
||
title: "提交成功!",
|
||
icon: "none",
|
||
});
|
||
let _this = this;
|
||
_this.isSubmitted = true
|
||
|
||
|
||
let CacheObj = uni.getStorageSync('CacheObj')
|
||
if (CacheObj) {
|
||
uni.setStorageSync('CacheObj', null)
|
||
}
|
||
|
||
setTimeout(() => {
|
||
_this.submiting = false;
|
||
_this.$util.toNextRoute(
|
||
"redirectTo",
|
||
`/pages/walkAroundManager/statusPage?id=${data.Result_Data.id}`
|
||
);
|
||
}, 1000);
|
||
} else {
|
||
uni.showToast({
|
||
title: data.Result_Desc,
|
||
icon: "error",
|
||
});
|
||
}
|
||
},
|
||
// 选中的考核内容
|
||
selectTag(item, detailItem) {
|
||
// 判断当前里面有没有自己选中的答案
|
||
let have = false;
|
||
if (this.selectAnwersList && this.selectAnwersList.length > 0) {
|
||
let haveList = this.selectAnwersList.filter(
|
||
(item) => item.questionId === detailItem.id
|
||
);
|
||
|
||
if (haveList && haveList.length > 0) {
|
||
have = true;
|
||
}
|
||
}
|
||
|
||
// 当have为true的时候 这个问题已经作答过了
|
||
if (have) {
|
||
// 判断这个问题 是不是多选的
|
||
let [type, questionType] = detailItem.type.split("_");
|
||
// 单选
|
||
if (type === "radio") {
|
||
// 那么要去除它之前的答案
|
||
if (detailItem.options && detailItem.options.length > 0) {
|
||
detailItem.options.forEach((itemOption) => {
|
||
if (itemOption.text === item.text) {
|
||
itemOption.ischecked = true;
|
||
} else {
|
||
itemOption.ischecked = false;
|
||
}
|
||
});
|
||
}
|
||
// 这一次选的答案
|
||
let res = {
|
||
questionId: detailItem.id,
|
||
textResponse: "",
|
||
choiceResponse: [item.text],
|
||
imageResponse: item.imageResponse,
|
||
score: item.mark ? item.mark : 0,
|
||
};
|
||
this.selectAnwersObj[detailItem.id] = [item];
|
||
|
||
let newList = [];
|
||
if (this.selectAnwersList && this.selectAnwersList.length > 0) {
|
||
this.selectAnwersList.forEach((listItem) => {
|
||
if (listItem.questionId === detailItem.id) {
|
||
newList.push(res);
|
||
} else {
|
||
newList.push(listItem);
|
||
}
|
||
});
|
||
}
|
||
this.selectAnwersList = newList;
|
||
} else {
|
||
// 判断点击的这个是不是已经选中了
|
||
if (item.ischecked) {
|
||
// 已经选中的话 再次点击应该去除
|
||
let old = JSON.parse(
|
||
JSON.stringify(this.selectAnwersObj[detailItem.id])
|
||
);
|
||
let newList = [];
|
||
if (old && old.length > 0) {
|
||
old.forEach((olditem) => {
|
||
if (olditem.text === item.text) {
|
||
} else {
|
||
newList.push(olditem);
|
||
}
|
||
});
|
||
}
|
||
this.selectAnwersObj[detailItem.id] = newList;
|
||
|
||
let newselectAnwersList = [];
|
||
if (this.selectAnwersList && this.selectAnwersList.length > 0) {
|
||
this.selectAnwersList.forEach((listItem) => {
|
||
if (listItem.questionId === detailItem.id) {
|
||
let old = JSON.parse(JSON.stringify(listItem.choiceResponse));
|
||
let newList = [];
|
||
if (old && old.length > 0) {
|
||
old.forEach((olditem) => {
|
||
if (olditem === item.text) {
|
||
} else {
|
||
newList.push(olditem);
|
||
}
|
||
});
|
||
}
|
||
listItem.choiceResponse = newList;
|
||
if (newList && newList.length > 0) {
|
||
newselectAnwersList.push(listItem);
|
||
}
|
||
// listItem.choiceResponse.push(item.text);
|
||
}
|
||
});
|
||
}
|
||
this.selectAnwersList = newselectAnwersList;
|
||
item.ischecked = false;
|
||
} else {
|
||
item.ischecked = true;
|
||
let old = JSON.parse(
|
||
JSON.stringify(this.selectAnwersObj[detailItem.id])
|
||
);
|
||
old.push(item);
|
||
this.selectAnwersObj[detailItem.id] = old;
|
||
|
||
if (this.selectAnwersList && this.selectAnwersList.length > 0) {
|
||
this.selectAnwersList.forEach((listItem) => {
|
||
if (listItem.questionId === detailItem.id) {
|
||
listItem.choiceResponse.push(item.text);
|
||
}
|
||
});
|
||
}
|
||
}
|
||
}
|
||
} else {
|
||
// have为false 说明第一次作答 记录他点击的答案
|
||
let res = {
|
||
questionId: detailItem.id,
|
||
textResponse: "",
|
||
choiceResponse: [item.text],
|
||
imageResponse: item.imageResponse,
|
||
score: item.mark ? item.mark : 0,
|
||
};
|
||
this.selectAnwersObj[detailItem.id] = [item];
|
||
this.selectAnwersList.push(res);
|
||
item.ischecked = true;
|
||
}
|
||
this.$forceUpdate();
|
||
},
|
||
// 获取单个的模版数据
|
||
async handleGetModalData(id) {
|
||
// const data = await this.$request.$webNodePOST(
|
||
// `questionnaire-templates/${id}`
|
||
// );
|
||
|
||
const data = await this.$request.$webJavaGet(
|
||
"questionnaire-templates/get",
|
||
{
|
||
id: id,
|
||
}
|
||
);
|
||
|
||
let obj = data.Result_Data;
|
||
this.detailObj = obj;
|
||
console.log(
|
||
"this.detailObjthis.detailObjthis.detailObjthis.detailObj",
|
||
this.detailObj
|
||
);
|
||
if (!this.detailObj.status) {
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "该点位已无效，请联系管理员！",
|
||
showCancel: false,
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
}
|
||
|
||
let list = [];
|
||
if (
|
||
obj.questionnaireTemplateQuestions &&
|
||
obj.questionnaireTemplateQuestions.length > 0
|
||
) {
|
||
obj.questionnaireTemplateQuestions.forEach((item) => {
|
||
if (item.isRequired) {
|
||
list.push(item.questionId);
|
||
}
|
||
});
|
||
}
|
||
this.requiredList = list;
|
||
|
||
// 这里是问题列表 我们稍微筛选一下
|
||
// 单选 必填
|
||
let radioRequiredList = [];
|
||
let radioList = [];
|
||
// 多选必填
|
||
let checkRequiredList = [];
|
||
let checkList = [];
|
||
|
||
let requestionList = obj.questionnaireTemplateQuestions;
|
||
console.log(
|
||
"requestionListrequestionListrequestionListrequestionList",
|
||
requestionList
|
||
);
|
||
|
||
if (requestionList && requestionList.length > 0) {
|
||
requestionList.forEach((item) => {
|
||
// type 是单选还是多选 questionType 是题目类型 暂时只有选择题
|
||
let [type, questionType] = item.question.type.split("_");
|
||
if (type === "radio") {
|
||
if (item.isRequired) {
|
||
radioRequiredList.push(item);
|
||
} else {
|
||
radioList.push(item);
|
||
}
|
||
} else if (type === "checked") {
|
||
if (item.isRequired) {
|
||
checkRequiredList.push(item);
|
||
} else {
|
||
checkList.push(item);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
// 全部的单选题
|
||
let requestionRadioList = radioRequiredList.concat(radioList);
|
||
// 全部的多选题
|
||
let requestionCheckedList = checkRequiredList.concat(checkList);
|
||
|
||
this.requestionRadioList = requestionRadioList;
|
||
this.requestionCheckedList = requestionCheckedList;
|
||
|
||
this.tagList = obj.questionnaireTemplateQuestions;
|
||
console.log("this.requestionRadioList", this.requestionRadioList);
|
||
console.log("this.requestionCheckedList", this.requestionCheckedList);
|
||
},
|
||
radioFocus() {
|
||
this.radiofocus = true;
|
||
this.imgfocus = false;
|
||
},
|
||
radioChange(evt, obj) {
|
||
console.log("evt", evt);
|
||
console.log("obj", obj);
|
||
obj.choiceResponse = [evt.detail.value];
|
||
if (obj.question.options && obj.question.options.length > 0) {
|
||
obj.question.options.forEach((item) => {
|
||
if (item.text === evt.detail.value) {
|
||
obj.mark = item.mark || 0;
|
||
}
|
||
});
|
||
}
|
||
// 判断 只要在这里点击了 那就不可能能变回默认了 那么就可以给他赋值显示图片了
|
||
// 只有分数不是1 的时候 才让它显示添加图片
|
||
if (obj.mark !== 1) {
|
||
obj.showAddImg = true;
|
||
} else {
|
||
obj.showAddImg = false;
|
||
}
|
||
|
||
// if(!(obj.mark>0)){
|
||
// this.current = 1;
|
||
// }
|
||
|
||
console.log("requestionRadioList", this.requestionRadioList);
|
||
if (this.requestionRadioList && this.requestionRadioList.length > 0) {
|
||
// 判断有没有选择了 0分的 因为 单选 只要选了就不能改
|
||
// 且 不选之前 mark的值为undefined 选了 就是0 或 1
|
||
let haveError = false;
|
||
this.requestionRadioList.forEach((item) => {
|
||
if (item.mark === 0) {
|
||
haveError = true;
|
||
}
|
||
});
|
||
if (haveError) {
|
||
this.current = 1;
|
||
} else {
|
||
this.current = 0;
|
||
}
|
||
}
|
||
|
||
// this.value = evt.target.value;
|
||
// for (let i = 0; i < this.options.length; i++) {
|
||
// if (this.options[i].value === evt.target.value) {
|
||
// this.current = i;
|
||
// break;
|
||
// }
|
||
// }
|
||
},
|
||
handleChangeCheck(e) {
|
||
console.log("e", e);
|
||
},
|
||
submitImg(e, obj, type) {
|
||
this.imgfocus = true;
|
||
let _this = this;
|
||
uni.chooseImage({
|
||
count: 9, //默认9
|
||
sizeType: ["original", "compressed"],
|
||
sourceType: ["camera"],
|
||
// "album",
|
||
success: function (rs) {
|
||
console.log("rs", rs);
|
||
|
||
let quality = 100;
|
||
if (rs.tempFiles[0].size > 1024 * 200) {
|
||
quality = ((1024 * 200) / rs.tempFiles[0].size) * 100;
|
||
}
|
||
if (quality < 100 && rs.tempFiles[0].path.indexOf(".jpg") > -1) {
|
||
uni.compressImage({
|
||
src: rs.tempFilePaths[0], // 图片路径
|
||
quality: quality, // 压缩质量
|
||
success(res) {
|
||
console.log("res", res);
|
||
let data = {};
|
||
if (res.data) {
|
||
data = JSON.parse(res.data);
|
||
}
|
||
console.log("data", data);
|
||
uni.showLoading({
|
||
title: "图片上传中...",
|
||
});
|
||
|
||
uni.uploadFile({
|
||
url: "https://eshangtech.com:18900/EShangApiMain/Picture/UploadPicture", // 你的接口 URL
|
||
filePath: rs.tempFilePaths[0],
|
||
name: "file", // 表单中的文件字段名
|
||
formData: {
|
||
Tabletype: "1133", // 表单中其他数据
|
||
},
|
||
success: async (uploadRes) => {
|
||
if (uploadRes.data) {
|
||
let res = JSON.parse(uploadRes.data)
|
||
console.log('resresresresres', res);
|
||
let url = res.Result_Data.ImageUrl
|
||
uni.hideLoading();
|
||
|
||
if (type === "response") {
|
||
if (obj.imageResponse && obj.imageResponse.length > 0) {
|
||
obj.imageResponse.push(url);
|
||
} else {
|
||
obj.imageResponse = [url];
|
||
}
|
||
|
||
_this.$forceUpdate();
|
||
} else {
|
||
_this.imgsList.push(url);
|
||
}
|
||
_this.noPost = true;
|
||
}
|
||
},
|
||
fail: (error) => {
|
||
console.log("error", error);
|
||
_this.noPost = true;
|
||
}
|
||
});
|
||
|
||
// uni.uploadFile({
|
||
// // url: "https://eshangtech.com:18999/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
|
||
// // url: "https://es.robot-z.cn/oss/upload",
|
||
// url: "https://es.eshangtech.com/oss/upload",
|
||
// filePath: res.tempFilePath,
|
||
// header: {
|
||
// "Content-Type": "multipart/form-data",
|
||
// },
|
||
// formData: {},
|
||
// fileType: "image",
|
||
// name: "file",
|
||
// success(res) {
|
||
// console.log("res", res);
|
||
// let data = {};
|
||
// if (res.data) {
|
||
// data = JSON.parse(res.data);
|
||
// }
|
||
// console.log("data", data);
|
||
// uni.hideLoading();
|
||
|
||
// if (type === "response") {
|
||
// if (obj.imageResponse && obj.imageResponse.length > 0) {
|
||
// obj.imageResponse.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
// } else {
|
||
// obj.imageResponse = [
|
||
// `https://es.eshangtech.com/${data.data.path}`,
|
||
// ];
|
||
// }
|
||
// console.log(
|
||
// "objobjobjobjobjobjobjobj",
|
||
// _this.requestionRadioList
|
||
// );
|
||
// _this.$forceUpdate();
|
||
// } else {
|
||
// _this.imgsList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
// }
|
||
// },
|
||
// fail(error) {
|
||
// console.log("error", error);
|
||
// _this.noPost = true;
|
||
// },
|
||
// });
|
||
|
||
},
|
||
fail(error) {
|
||
_this.noPost = true;
|
||
},
|
||
});
|
||
} else {
|
||
uni.showLoading({
|
||
title: "图片上传中...",
|
||
// mask: true
|
||
});
|
||
uni.uploadFile({
|
||
url: "https://eshangtech.com:18900/EShangApiMain/Picture/UploadPicture", // 你的接口 URL
|
||
filePath: rs.tempFilePaths[0],
|
||
name: "file", // 表单中的文件字段名
|
||
formData: {
|
||
Tabletype: "1133", // 表单中其他数据
|
||
},
|
||
success: async (uploadRes) => {
|
||
console.log('uploadResuploadRes', uploadRes);
|
||
if (uploadRes.data) {
|
||
let res = JSON.parse(uploadRes.data)
|
||
console.log('resresresresres', res);
|
||
let url = res.Result_Data.ImageUrl
|
||
uni.hideLoading();
|
||
|
||
if (type === "response") {
|
||
if (obj.imageResponse && obj.imageResponse.length > 0) {
|
||
obj.imageResponse.push(url);
|
||
} else {
|
||
obj.imageResponse = [url];
|
||
}
|
||
|
||
_this.$forceUpdate();
|
||
} else {
|
||
_this.imgsList.push(url);
|
||
}
|
||
_this.noPost = true;
|
||
}
|
||
},
|
||
fail: (error) => {
|
||
console.log("error", error);
|
||
_this.noPost = true;
|
||
}
|
||
});
|
||
}
|
||
// uni.uploadFile({
|
||
// url: "https://eshangtech.com:18999/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
|
||
// filePath: imageSrc,
|
||
// fileType: "image",
|
||
// name: "data",
|
||
// success: (res) => {
|
||
// let _data = JSON.parse(res.data);
|
||
|
||
// uni.hideLoading();
|
||
// _this.imgsList.push(imageSrc);
|
||
// _this.imgData.push(_data.Data.IMAGE_PATH);
|
||
// },
|
||
// fail: (err) => {
|
||
// uni.showModal({
|
||
// content: err.errMsg,
|
||
// showCancel: false,
|
||
// });
|
||
// },
|
||
// });
|
||
},
|
||
fail: function (err) { },
|
||
});
|
||
},
|
||
// 显示多选的弹出框
|
||
handleShowCheckPopup(obj, type) {
|
||
this.questionType = type;
|
||
this.isShowPopup = true;
|
||
this.popupShowObj = obj;
|
||
},
|
||
handleClosePopup() {
|
||
this.isShowPopup = false;
|
||
this.popupShowObj = undefined;
|
||
this.questionType = "";
|
||
},
|
||
handleCheckAnwers(detailObj, selectObj) {
|
||
console.log("detailObj", detailObj);
|
||
console.log("selectObj", selectObj);
|
||
|
||
if (selectObj.checked) {
|
||
selectObj.checked = false;
|
||
let old = JSON.parse(JSON.stringify(detailObj.isChecked));
|
||
let res = [];
|
||
if (old && old.length > 0) {
|
||
old.forEach((item) => {
|
||
if (item.checked && item.text !== selectObj.text) {
|
||
res.push(item);
|
||
}
|
||
});
|
||
}
|
||
detailObj.isChecked = res;
|
||
} else {
|
||
if (detailObj.isChecked && detailObj.isChecked.length > 0) {
|
||
detailObj.isChecked.push(selectObj);
|
||
} else {
|
||
detailObj.isChecked = [selectObj];
|
||
}
|
||
selectObj.checked = true;
|
||
}
|
||
|
||
this.$forceUpdate();
|
||
},
|
||
// 点击了多选里面的删除 去掉里面的当前项
|
||
handDeleteChecked(obj, smallObj, type) {
|
||
console.log("obj", obj);
|
||
console.log("smallObj", smallObj);
|
||
if (type === "checked") {
|
||
let list = JSON.parse(JSON.stringify(obj.isChecked));
|
||
let res = [];
|
||
list.forEach((item) => {
|
||
if (item.text === smallObj.text) {
|
||
} else {
|
||
res.push(item);
|
||
}
|
||
});
|
||
if (obj.question.options && obj.question.options.length > 0) {
|
||
obj.question.options.forEach((item) => {
|
||
if (item.text === smallObj.text) {
|
||
item.checked = false;
|
||
}
|
||
});
|
||
}
|
||
|
||
obj.isChecked = res;
|
||
this.$forceUpdate();
|
||
} else {
|
||
obj.choiceResponse = [];
|
||
obj.imageResponse = [];
|
||
obj.showAddImg = false;
|
||
this.$forceUpdate();
|
||
}
|
||
},
|
||
showImg2(index, imgList) {
|
||
uni.previewImage({
|
||
urls: imgList,
|
||
current: index,
|
||
loop: true,
|
||
indicator: "number",
|
||
});
|
||
},
|
||
|
||
// 修改情况类型
|
||
handleChangeSituationType(e) {
|
||
console.log("e", e);
|
||
this.current = Number(e.detail.value);
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.main {
|
||
width: 100%;
|
||
height: 100vh;
|
||
background-color: #fff;
|
||
box-sizing: border-box;
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
padding-bottom: constant(safe-area-inset-bottom);
|
||
|
||
.pageScroll {
|
||
width: 100%;
|
||
height: calc(100% - 120rpx);
|
||
background-color: #f6f7f9;
|
||
box-sizing: border-box;
|
||
padding-bottom: 32rpx;
|
||
|
||
.topContent {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 32rpx 0;
|
||
background: linear-gradient(#e6eefd 0%, #f6f7f9 100%);
|
||
|
||
.placeBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
border-radius: 16rpx;
|
||
background: #fff;
|
||
background-image: url("https://eshangtech.com/minTestImg/placeBg.png");
|
||
background-size: 100% 100%;
|
||
// background-position: 2rpx 2rpx;
|
||
background-repeat: no-repeat;
|
||
|
||
.placeName {
|
||
font-family: "PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
line-height: 36rpx;
|
||
color: #000000;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.userBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
|
||
.userTop {
|
||
.userName {
|
||
font-family: "PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
line-height: 36rpx;
|
||
color: #000000;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.labelBox {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #5D77B5;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
padding: 2rpx 8rpx;
|
||
background: #D4E0FC;
|
||
border-radius: 4rpx;
|
||
}
|
||
}
|
||
|
||
.timeBox {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 8rpx;
|
||
|
||
.timeIcon {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-right: 6rpx;
|
||
}
|
||
|
||
.nowTime {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #676d74;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.inspectionContent {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
|
||
.contentTop {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #010b18;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.required {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #ff0000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
|
||
.contentBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
}
|
||
|
||
.uploadImgBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.submitImgBox {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
background: #f7f7f8;
|
||
border-radius: 8rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 16rpx;
|
||
|
||
.addIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
color: #b4b5ba;
|
||
}
|
||
}
|
||
|
||
.imgItem {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
margin-right: 16rpx;
|
||
position: relative;
|
||
border-radius: 8rpx;
|
||
overflow: hidden;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.closeBox {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
background: rgba(6, 10, 25, 0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.qusetionBox {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx;
|
||
|
||
.questionItem {
|
||
width: 100%;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
border-radius: 16rpx;
|
||
margin-bottom: 24rpx;
|
||
|
||
.quetionTitle {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 30rpx;
|
||
|
||
.quetionLeft {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #010b18;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.required {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #ff0000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
|
||
.quetionRight {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.placeSelect {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #d6d7da;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightArrow {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.checkedBottom {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
margin-top: 16rpx;
|
||
|
||
.bottomItem {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #676d74;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
padding: 8rpx 16rpx;
|
||
border-radius: 6rpx;
|
||
background: #f6f6f7;
|
||
margin-right: 16rpx;
|
||
margin-bottom: 16rpx;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 16rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.radioGroup {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.radioItem {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 8rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
|
||
.uploadImgBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.submitImgBox {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
background: #f7f7f8;
|
||
border-radius: 8rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 16rpx;
|
||
|
||
.addIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
color: #b4b5ba;
|
||
}
|
||
}
|
||
|
||
.imgItem {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
margin-right: 16rpx;
|
||
position: relative;
|
||
border-radius: 8rpx;
|
||
overflow: hidden;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.closeBox {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
background: rgba(6, 10, 25, 0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.choiceResList {
|
||
width: 100%;
|
||
|
||
.choiceItem {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.requestionCheckedItem {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
margin-bottom: 24rpx;
|
||
|
||
.checkedTop {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.topLeft {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #010b18;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.required {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #ff0000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
|
||
.topRight {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.placeSelect {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #d6d7da;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightArrow {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.checkedBottom {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
margin-top: 16rpx;
|
||
|
||
.bottomItem {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #676d74;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
padding: 8rpx 16rpx;
|
||
border-radius: 6rpx;
|
||
background: #f6f6f7;
|
||
margin-right: 16rpx;
|
||
margin-bottom: 16rpx;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 16rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.uploadImgBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.submitImgBox {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
background: #f7f7f8;
|
||
border-radius: 8rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 16rpx;
|
||
|
||
.addIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
color: #b4b5ba;
|
||
}
|
||
}
|
||
|
||
.imgItem {
|
||
width: 148rpx;
|
||
height: 148rpx;
|
||
margin-right: 16rpx;
|
||
position: relative;
|
||
border-radius: 8rpx;
|
||
overflow: hidden;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.closeBox {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
background: rgba(6, 10, 25, 0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.otherBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 32rpx 0;
|
||
|
||
.questionItem {
|
||
width: 100%;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
border-radius: 16rpx;
|
||
margin-bottom: 24rpx;
|
||
|
||
.quetionTitle {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #010b18;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.required {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #ff0000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
|
||
.radioGroup {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.radioItem {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 8rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.bottomBtnBox {
|
||
width: 100%;
|
||
height: 120rpx;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 40rpx;
|
||
background: #fff;
|
||
|
||
.bottomBtn {
|
||
width: 100%;
|
||
height: 100%;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
font-style: normal;
|
||
background: #3b72ff;
|
||
border-radius: 6rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
|
||
.popupBox {
|
||
width: 100%;
|
||
height: 60vh;
|
||
box-sizing: border-box;
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
padding-bottom: constant(safe-area-inset-bottom);
|
||
|
||
.checkPopupContent {
|
||
width: 100%;
|
||
height: calc(100% - 100rpx);
|
||
background: #fff;
|
||
border-radius: 24rpx 24rpx 0rpx 0rpx;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
|
||
.anwersList {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.anwersItem {
|
||
.anwers {
|
||
min-width: calc((100% - 48rpx) / 3);
|
||
background: #f6f6f7;
|
||
border-radius: 6rpx;
|
||
text-align: center;
|
||
padding: 14rpx;
|
||
margin-right: 16rpx;
|
||
margin-bottom: 16rpx;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #010b18;
|
||
line-height: 40rpx;
|
||
font-style: normal;
|
||
}
|
||
|
||
.selectAnwersItem {
|
||
background: #e7eeff;
|
||
color: #3b72ff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.radioGroup {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.radioItem {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 8rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.bottomBtnBox {
|
||
width: 100%;
|
||
height: 100rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 40rpx 0;
|
||
background: #fff;
|
||
|
||
.bottomBtn {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
line-height: 44rpx;
|
||
font-style: normal;
|
||
background: #3b72ff;
|
||
border-radius: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
// .pageHeader {
|
||
// height: 120rpx;
|
||
// width: 100%;
|
||
// background-color: rgb(246, 246, 246);
|
||
// box-shadow: rgb(214, 207, 207) 4rpx 0px 20rpx;
|
||
// background: url("../../static/images/mbwa/bj_logo.png") no-repeat bottom
|
||
// right;
|
||
// background-size: 34%;
|
||
// padding-left: 30rpx;
|
||
// box-sizing: border-box;
|
||
// .hederContent {
|
||
// display: flex;
|
||
// align-items: center;
|
||
// img {
|
||
// width: 100rpx;
|
||
// height: 100rpx;
|
||
// border-radius: 50%;
|
||
// margin-top: 10rpx;
|
||
// margin-right: 20rpx;
|
||
// }
|
||
// }
|
||
// }
|
||
|
||
// .addressBox {
|
||
// color: #727272;
|
||
// padding: 30rpx;
|
||
// .contentBox {
|
||
// display: flex;
|
||
// .addressIcon {
|
||
// display: inline-block;
|
||
// width: 49rpx;
|
||
// height: 48rpx;
|
||
// border-radius: 10rpx;
|
||
// margin-right: 6rpx;
|
||
// }
|
||
// .xuncha {
|
||
// font-size: 26rpx;
|
||
// color: #1b1c20;
|
||
// }
|
||
// }
|
||
// }
|
||
|
||
// .formBox {
|
||
// position: relative;
|
||
// margin-left: 24rpx;
|
||
// box-sizing: border-box;
|
||
// ul {
|
||
// li {
|
||
// width: 100%;
|
||
// position: relative;
|
||
// margin-top: 16rpx;
|
||
|
||
// .circle {
|
||
// background-color: #b2b2b2;
|
||
// height: 16rpx;
|
||
// width: 16rpx;
|
||
// border-radius: 50%;
|
||
// position: absolute;
|
||
// top: 16rpx;
|
||
// left: 1rpx;
|
||
// }
|
||
// .circle-first {
|
||
// top: 14rpx;
|
||
// }
|
||
// .circle-last {
|
||
// top: 46rpx;
|
||
// }
|
||
// .circleActive {
|
||
// height: 16rpx;
|
||
// width: 16rpx;
|
||
// border-radius: 50%;
|
||
// position: absolute;
|
||
// left: 1rpx;
|
||
// background-color: #409eff;
|
||
// }
|
||
|
||
// .examineContent {
|
||
// width: 100%;
|
||
// box-sizing: border-box;
|
||
// padding-left: 40rpx;
|
||
// .titleBox {
|
||
// display: flex;
|
||
// align-items: center;
|
||
|
||
// .img-zds {
|
||
// display: inline-block;
|
||
// width: 32rpx;
|
||
// height: 32rpx;
|
||
// background: url("../../static/images/mbwa/content_img_gray.png")
|
||
// no-repeat center;
|
||
// background-size: contain;
|
||
// margin-right: 6rpx;
|
||
// }
|
||
|
||
// .img-upload {
|
||
// display: inline-block;
|
||
// width: 32rpx;
|
||
// height: 32rpx;
|
||
// background: url("../../static/images/mbwa/pic_img_gray.png")
|
||
// no-repeat center;
|
||
// background-size: contain;
|
||
// margin-right: 6rpx;
|
||
// }
|
||
|
||
// .activezds {
|
||
// background-image: url("../../static/images/mbwa/zdsgl_sm_nr.png");
|
||
// }
|
||
|
||
// .activeupload {
|
||
// background-image: url("../../static/images/mbwa/zdsgl_sm_pic.png");
|
||
// }
|
||
|
||
// .titleText {
|
||
// font-size: 26rpx;
|
||
// color: #7a7a7a;
|
||
// }
|
||
// .titleTextActive {
|
||
// font-size: 26rpx;
|
||
// color: #409eff;
|
||
// }
|
||
// }
|
||
|
||
// .inputBox {
|
||
// color: #939393;
|
||
// font-size: 24rpx;
|
||
// padding-bottom: 40rpx;
|
||
// width: 100%;
|
||
// box-sizing: border-box;
|
||
// textarea {
|
||
// min-height: 50rpx;
|
||
// font-size: 24rpx;
|
||
// line-height: 1.8;
|
||
// border-bottom: 1rpx solid #eee;
|
||
// margin-top: 20rpx;
|
||
// color: #727272;
|
||
// }
|
||
// }
|
||
|
||
// .tagList {
|
||
// display: flex;
|
||
// font-size: 24rpx;
|
||
// color: #606266;
|
||
// width: 100%;
|
||
// box-sizing: border-box;
|
||
// .tagName {
|
||
// width: 200rpx;
|
||
// margin-right: 16rpx;
|
||
// font-size: 22rpx;
|
||
// line-height: 2.9;
|
||
// }
|
||
// .tagsBox {
|
||
// width: calc(100% - 200rpx);
|
||
// // width: 546rpx;
|
||
// padding: 0 24rpx 0 12rpx;
|
||
// }
|
||
// .tagUnit {
|
||
// padding: 4rpx 16rpx;
|
||
// background-color: #f4f4f4;
|
||
// color: #606266;
|
||
// border-radius: 24rpx;
|
||
// margin: 8rpx;
|
||
// font-size: 22rpx;
|
||
// display: inline-block;
|
||
// vertical-align: middle;
|
||
// }
|
||
// .active {
|
||
// color: #ed7043;
|
||
// background-color: #fdf1ec;
|
||
// }
|
||
// }
|
||
|
||
// .uploadBox {
|
||
// display: flex;
|
||
// flex-flow: row wrap;
|
||
// justify-content: flex-start;
|
||
// align-items: flex-start;
|
||
// width: 100%;
|
||
// box-sizing: border-box;
|
||
// padding: 20rpx 0;
|
||
// /* padding-left: 54rpx; */
|
||
// min-height: 160rpx;
|
||
// .uploadList {
|
||
// position: relative;
|
||
// display: flex;
|
||
// flex-flow: row nowrap;
|
||
// justify-content: center;
|
||
// align-items: center;
|
||
// background-color: #f1f1f1;
|
||
// box-sizing: border-box;
|
||
// width: 160rpx;
|
||
// height: 160rpx;
|
||
// border-radius: 6rpx;
|
||
// margin-top: 16rpx;
|
||
// }
|
||
// .uploadList:nth-child(3n-1) {
|
||
// margin-left: 16rpx;
|
||
// margin-right: 16rpx;
|
||
// }
|
||
// .uploadList image {
|
||
// width: 160rpx;
|
||
// height: 160rpx;
|
||
// border-radius: 6rpx;
|
||
// }
|
||
|
||
// .uploadAdd {
|
||
// width: 26%;
|
||
// box-sizing: border-box;
|
||
// .upload-file-add-container {
|
||
// display: flex;
|
||
// flex-flow: column nowrap;
|
||
// justify-content: center;
|
||
// align-items: center;
|
||
// border: 1rpx dashed #c6c6c6;
|
||
// height: 160rpx;
|
||
// width: 160rpx;
|
||
// margin-top: 15rpx;
|
||
// border-radius: 6rpx;
|
||
// margin-left: 12rpx;
|
||
// .walk-manage-plus {
|
||
// line-height: 60rpx;
|
||
// width: 62rpx;
|
||
// height: 62rpx;
|
||
// text-align: center;
|
||
// border-radius: 50%;
|
||
// background-color: #409eff;
|
||
// color: #ffffff;
|
||
// font-size: 48rpx;
|
||
// box-shadow: 0 2rpx 6rpx 0 #eee;
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
|
||
// .uni-list-cell {
|
||
// justify-content: unset;
|
||
// margin-top: 28rpx;
|
||
// }
|
||
|
||
// .uni-list-cell:after {
|
||
// background-color: #f9f9f9;
|
||
// }
|
||
// }
|
||
// }
|
||
|
||
// .active .img-zds {
|
||
// background-image: url("../../static/images/mbwa/zdsgl_sm_nr.png");
|
||
// }
|
||
// }
|
||
|
||
// .btn {
|
||
// width: 80%;
|
||
// margin: 0 auto;
|
||
// margin-top: 50rpx;
|
||
// background-color: #409eff;
|
||
// border-radius: 10rpx;
|
||
// color: #fff;
|
||
// font-size: 28rpx;
|
||
// line-height: 2.8;
|
||
// margin-top: 96rpx;
|
||
// }
|
||
// }
|
||
}
|
||
</style> |