1029 lines
26 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="dangerbig-details">
<view class="fixedheader">
<headers :showBack="true">
<view class="headerName">
焊工考核申请详情
</view>
</headers>
</view>
<view :style="{ 'padding-top': ((statusBarHeight * 2) + 45) * 1.5 + 'rpx' }">
<view class="detail-content">
<view class="list">
<view class="list-info">
编号<text class="detail-data">{{detailData.number}}</text>
</view>
<view class="list-info">
申请单位/代码<text class="detail-data">{{detailData.applicantCode}}</text>
</view>
<view class="list-info">
申请考核时间<text class="detail-data">{{detailData.applicationAssessmentTime}}</text>
</view>
<view class="list-info">
承接装置工程<text class="detail-data">{{detailData.undertakenDeviceEngineeringName}}</text>
</view>
<view class="list-info">
工程建设模式<text class="detail-data">
{{ detailData.engineeringConstructionMode ? contractModelList[detailData.engineeringConstructionMode - 1].contractModelName : '--' }}</text>
</view>
<!-- <view class="list-info">
附件<text style="color: #1684FC;margin-left: 10rpx;" class="detail-data" @click="downloadFn(item)"
v-for="item in detailData.testingReportAttachment"
:key="item.id">{{item.name}}</text>
</view> -->
<!-- <view class="list-info">
作业时间:<text class="detail-data"
v-if="detailData.jobStartTime && detailData.jobEndTime">{{detailData.jobStartTime+'-'+detailData.jobEndTime}}</text>
</view> -->
<view class="" v-if="isShow">
<view class="other-safe">
<view class="other-head">
<view class="other-icon"></view>
<view class="other-text">申请项目</view>
</view>
<view class="gasanalysis-table">
<table>
<thead>
<tr>
<th>序号</th>
<th>代号</th>
<th>厚度/管径(mm)</th>
<th>设备名称</th>
<th>型号规格</th>
<th>数量(台)</th>
<th>考核场地(m2)</th>
<th>考核工位(个)</th>
</tr>
</thead>
<tbody>
<tr v-for="(ele, eIndex) in detailData.tableList" :key="ele.id">
<td>
{{ eIndex + 1 }}
</td>
<!-- <td>
{{weldingListUp(ele.weldingNumber)}}
</td> -->
<td>
{{ ele.code ? ele.code : '--' }}
</td>
<td>
{{ ele.pipeDiameter ? ele.pipeDiameter : '--' }}
</td>
<td>
{{ ele.deviceName ? ele.deviceName : '--' }}
</td>
<td>
{{ ele.typeSpecification ? ele.typeSpecification : '--' }}
</td>
<td>
{{ ele.quantity ? ele.quantity : '--' }}
</td>
<td>
{{ ele.examinationSite ? ele.examinationSite : '--' }}
</td>
<td>
{{ ele.examinationStation ? ele.examinationStation : '--' }}
</td>
<!-- <td>
<view class="download" v-for="item in ele.fileList" :key="ele.uid">
<image :src="url_config+'image/'+item.url" class="img"
@click="previewImage(url_config+'image/'+item.url)"></image>
</view>
</td>
<td>
{{ isAffirmListUp(ele.appearanceStandard) }}
</td> -->
</tr>
</tbody>
</table>
</view>
<view class="other-head">
<view class="other-icon"></view>
<view class="other-text">考核人员情况</view>
</view>
<view class="gasanalysis-table">
<table>
<thead>
<tr>
<th>序号</th>
<th>姓名</th>
<th>性别</th>
<th>焊工合格证书号</th>
<th>焊工钢印</th>
<th>原证有效期</th>
<th>焊工作业证编号</th>
<th>备注</th>
<th>焊工证合格证项目</th>
</tr>
</thead>
<tbody>
<tr v-for="(ele, eIndex) in detailData.tableList2" :key="ele.id">
<td>
{{ ele.serialNumber ? ele.serialNumber : '--' }}
</td>
<td>
{{workerListOptionsUp(ele.name)}}
</td>
<td>
{{ ele.sex ? ele.sex : '--' }}
</td>
<td>
{{ ele.welderCertificateNumber ? ele.welderCertificateNumber : '--' }}
</td>
<td>
{{ ele.welderSteelMark ? ele.welderSteelMark : '--' }}
</td>
<td>
{{ ele.periodValidity ? ele.periodValidity : '--' }}
</td>
<td>
{{ ele.certificateNumber ? ele.certificateNumber : '--' }}
</td>
<td>
{{ ele.remark ? ele.remark : '--' }}
</td>
<td>
<table>
<thead>
<tr>
<th>焊工证合格证项目</th>
<th>焊工考核项目</th>
<th>现场考核日期</th>
<th>考核结果</th>
</tr>
</thead>
<tbody>
<tr v-for="(option, eIndex) in ele.certificateProjectList"
:key="ele.id">
<td>
{{ option.certificateProjectName ? option.certificateProjectName : '--' }}
</td>
<td>
{{ option.assessmentItem ? option.assessmentItem : '--' }}
</td>
<td>
{{ option.siteTestDate ? option.siteTestDate : '--' }}
</td>
<td>
{{ option.evaluationResult ? evaluationResultList[option.evaluationResult - 1].evaluationResultName : '--' }}
</td>
</tr>
</tbody>
</table>
</td>
<!-- <td>
<view class="download" v-for="item in ele.fileList" :key="ele.uid">
<image :src="url_config+'image/'+item.url" class="img"
@click="previewImage(url_config+'image/'+item.url)"></image>
</view>
</td>
<td>
{{ isAffirmListUp(ele.appearanceStandard) }}
</td> -->
</tr>
</tbody>
</table>
</view>
</view>
<!-- <view class="other-safe">
<view class="other-head">
<view class="other-icon"></view>
<view class="other-text">签字</view>
</view>
<view class="list-info">
不合格事实陈述:<text class="detail-data">{{detailData.nonConformingFact}}</text>
</view>
<view class="list-info">
附件:<text style="color: #1684FC;" class="detail-data" @click="downloadFn(item)"
v-for="item in detailData.testingReportAttachment"
:key="item.id">{{item.name}}</text>
</view>
</view> -->
<!--
<view class="safe-mesure">
<view class="safe-btn" @click="goSafeMesure">查看安全措施</view>
</view>
<view class="other-safe">
<view class="other-head">
<view class="other-icon"></view>
<view class="other-text">安全技术交底</view>
</view>
<view class="other-content">
<view class="content-1"><text style="float: right;">安全交底人:</text></view>
<view class="content-2">{{detailData.safetyInformantName}}</view>
<view class="content-3"><text style="float: right;">接受交底人:</text></view>
<view class="content-4">{{detailData.acceptTheInformantName}}</view>
</view>
<view class="other-content">
<view class="content-1"><text style="float: right;">监护人:</text></view>
<view class="content-2">{{detailData.guardianName}}</view>
</view>
</view> -->
</view>
</view>
<view v-if="COMPANY != 'longguang'" class="more-btn" @click="isShow=!isShow">
<text>{{isShow ? "收起详情":"展开详情"}}</text>
<image class="detail_icon_up" :class="{'detail_icon_down': isShow}"
src="/static/bthgIcon/detail_icon.png"></image>
</view>
</view>
<!-- <view class="detail-nav" v-if="COMPANY != 'longguang'">
<scroll-view class="scrollx-wrap" scroll-x>
<view class="nav-list">
<view class="nav-item" :class="{'active-nav': activeIndex == item.id}"
v-for="(item,index) in navList" :key="index" @click="checkNav(item)">
{{item.name}}
</view>
</view>
</scroll-view>
<view class="detail-wrap">
<plan ref="list" v-if="componentName == 'plan'" :detailId="detailId" :info="detailData"></plan>
<safe ref="list" v-if="componentName == 'safe'" :detailId="detailId" :info="detailData"></safe>
<side ref="list" v-if="componentName == 'side'" :detailId="detailId" :info="detailData"></side>
<workFinally ref="list" v-if="componentName =='workFinally'" :detailId="detailId"
:info="detailData"></workFinally>
</view>
</view> -->
<!-- <view class="add-btn" v-if="activeIndex != 7 && activeIndex != 2 && !(activeIndex == 1 && detailData.engineeringState == 3) -->
<!-- <view class="add-btn" v-if="activeIndex != 7 && userInfo.userId === detailData.assignmentPersonInCharge
&& COMPANY != 'longguang' && detailData.finalAcceptanceStatus !== 2 && isShowBtn && btnAuth" @click="addForm">
<uni-icons2 v-if="activeIndex == 5" type="camera" size="30" color="#fff"></uni-icons2>
<uni-icons2 v-else type="plusempty" size="30" color="#fff"></uni-icons2>
<span>+</span>
</view> -->
</view>
<view class="fixed" :class="{show:showIframe}" v-if="show" @click="show=false">
<view class="iframeMain" @click.stop="show=true">
<video v-if="getType(iframeUrl) == 'video'" class="iframe" :src="iframeUrl"></video>
<image v-else-if="getType(iframeUrl) == 'image'" class="iframe" :src="iframeUrl" mode="aspectFit">
</image>
<iframe v-else class="iframe" ref="iframe" :src="iframeUrl" frameborder="0"></iframe>
</view>
</view>
</view>
</template>
<script>
// import plan from './plan.vue'
// import safe from './safe.vue'
// import side from './side.vue'
// import workFinally from './workFinally.vue'
import {
isVideoLink,
isImageLink,
openOutsideFile,
openLocalFile,
removeNetWorkFileTemp,
isJSON
} from '@/utils/tool.js'
export default {
// components: {
// plan,
// safe,
// side,
// workFinally,
// },
data() {
return {
statusBarHeight: 0,
isShow: true,
componentName: "plan",
navList: [{
id: 1,
name: "当前进度"
}, {
id: 2,
name: "安全检查"
}, {
id: 3,
name: "施工旁站"
}, {
id: 4,
name: "最终验收"
}],
activeIndex: 1,
detailId: "",
detailData: {},
isShowBtn: null,
userInfo: {},
btnAuth: true,
showIframe: false,
show: false,
iframeUrl: "",
contractModelList: [{
contractModelId: 1,
contractModelName: 'EPC'
},
{
contractModelId: 2,
contractModelName: 'E+P+C'
}
], // 合同模式
disposalProposalList: [{
id: 1,
disposalProposalName: '报废'
},
{
id: 2,
disposalProposalName: '返工'
},
{
id: 3,
disposalProposalName: '返修'
}
],
workCategoryList: [{
id: 1,
workCategoryName: "一级"
}, {
id: 2,
workCategoryName: "二级"
}, {
id: 3,
workCategoryName: "三级"
}],
workerListOptions: [],
workTypeList: [{
id: 1,
workTypeName: "受限空间作业"
}, {
id: 2,
workTypeName: "类受限空间作业"
}],
detectionMethodList: [{
id: 1,
detectionMethodName: "RT(射线检测)"
}, {
id: 2,
detectionMethodName: "PT(渗透检测)"
}, {
id: 3,
detectionMethodName: "MT(磁粉检测)"
}, {
id: 4,
detectionMethodName: "UT(超声检测)"
}, {
id: 5,
detectionMethodName: "TOFD(衍射时差法超声检测)"
}, {
id: 6,
detectionMethodName: "GP(光谱检测)"
}, {
id: 7,
detectionMethodName: "YD(硬度检测)"
}, {
id: 8,
detectionMethodName: "CH(超声测厚)"
}, {
id: 9,
detectionMethodName: "TCH(涂层测厚)"
}, {
id: 10,
detectionMethodName: "DHH(电火花检测)"
}, {
id: 11,
detectionMethodName: "WL(涡流检测)"
}, {
id: 12,
detectionMethodName: "TST(铁素体检测)"
}],
weldingListAll: [],
evaluationResultList: [{
id: 1,
evaluationResultName: '合格'
}, {
id: 2,
evaluationResultName: '不合格'
}]
}
},
onReachBottom() {
console.log(1, this.$refs['list'])
},
onPullDownRefresh() {
console.log(2)
},
onShow() {
this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
// this.initData()
this.getWork()
this.getDutyPerson();
this.getWeldingListAll();
let that = this;
// setTimeout(function() {
// console.log(that.$refs, 777)
// console.log(that.$refs.listBox, 777)
// if (that.$refs['list'] && that.$refs['list'].initData) {
// console.log(777888)
// that.$refs['list'].initData()
// }
// }, 200)
},
onLoad(val) {
this.btnAuth = this.checkBtnPermission({
key: 'towerOverWork_add',
menuPath: '/project/specialWork/towerOverWork'
})
this.detailId = val.id
},
onUnload() {
removeNetWorkFileTemp();
},
mounted() {},
methods: {
getType(url) {
if (isImageLink(url)) {
return "image"
} else if (isVideoLink(url)) {
return "video"
} else {
return ''
}
},
downloadFile(url) {
// 下载所有的文件
let name = url.substring(url.lastIndexOf('/') + 1);
console.log(name, "文件名称");
if (isVideoLink(url) || isImageLink(url)) {
// 是图片和视频
this.show = true;
this.showIframe = true;
this.iframeUrl = this.url_config + 'image/' + url;
} else {
// openOutsideFile(`${this.url_config}image/${url}`)
openLocalFile(name, `${this.url_config}image/${url}`)
}
return;
},
//预览图片
previewImage(url) {
uni.previewImage({
urls: [url]
})
},
getWork() {
this.sendRequest({
url: 'xmgl/welderAssessmentRequest/queryById',
method: 'get',
data: {
id: this.detailId
},
success: res => {
uni.hideLoading()
// if(res.code==200){
// this.listData = res.result.records
// }
this.detailData = {
...res.result,
testingReportAttachment: isJSON(res.result.uploadAttachment) ? JSON
.parse(res.result.uploadAttachment) : [],
// hotWorkExecutionTime: [
// res.result.jobStartTime ? res.result.jobStartTime : '',
// res.result.jobEndTime ? res.result.jobEndTime : '',
// ],
tableList: res.result.applicationAssessmentDetailsTable != null ?
JSON.parse(res.result.applicationAssessmentDetailsTable).reduce((prev,
item) => {
prev.push({
id: 'id-' + Math.random().toString(36).substr(2, 9),
code: item['field9226498463854'],
pipeDiameter: item['field5649098552937'],
deviceName: item['field7069298503592'],
typeSpecification: item['field9680998508539'],
quantity: item['field4745598560972'],
examinationSite: item['field2585498541669'],
examinationStation: item['field5660598577366'],
});
return prev;
}, []) : [],
tableList2: res.result.assessmentPersonnel != null ?
JSON.parse(res.result.assessmentPersonnel).reduce((prev, item) => {
const resultList = Array.isArray(item["field9890898665453"]) &&
item["field9890898665453"].map(ele => {
return {
certificateProjectName: ele['field1494098725099'],
assessmentItem: Array.isArray(ele[
'field4501024932536']) ?
ele[
'field4501024932536'][0] : ele[
'field4501024932536'],
siteTestDate: ele['field7688098758155'],
evaluationResult: ele['field1125873837893']instanceof Array ? ele['field1125873837893'][0] : ele['field1125873837893'],
}
});
prev.push({
id: 'id-' + Math.random().toString(36).substr(2, 9),
serialNumber: item['field6891598604404'],
name: item['field5383524265804'],
sex: item['field2464798620721'],
welderCertificateNumber: item['field1723198628254'],
welderSteelMark: item['field8518898654288'],
periodValidity: item['field5004498659255'],
certificateNumber: item['field5695598702021'],
remark: item['field4547398747381'],
certificateProjectList: resultList,
});
return prev;
}, []) : []
}
// this.getApply()
}
})
},
downloadFn(row) {
let that = this;
let src = row.url.includes('http://') ? row.url : that.url_config + 'image/' + row.url;
uni.downloadFile({
url: src, //仅为示例,并非真实的资源
success: (res) => {
console.log(res)
if (res.statusCode === 200) {
// uni.showToast({
// title:'下载成功'
// })
var filePath = res.tempFilePath;
if (!filePath) return
uni.openDocument({
filePath: filePath,
success: function(res) {
console.log(res);
console.log('打开文档成功');
uni.showToast({
title: '打开文档成功'
})
}
});
} else {
uni.showToast({
title: '下载失败'
})
}
}
});
},
countName(list, rowIndex) {
return list.reduce((prev, item, index) => {
// console.log(index == rowIndex, prev);
if (index < rowIndex) {
prev += item.detailList.length;
return prev;
}
return prev;
}, 0);
},
goSafeMesure() {
uni.navigateTo({
url: "./safeMesure?detailId=" + this.detailId
})
},
getApply() {
console.log("=====================================================detail");
console.log(this.detailData);
this.sendRequest({
url: 'xmgl/xzDangerousEngineeringAcceptance/list',
method: 'get',
data: {
engineeringId: this.detailData.id,
projectSn: JSON.parse(uni.getStorageSync('projectDetail')).projectSn,
type: 5
},
success: res => {
uni.hideLoading()
console.log("xmgl/xzDangerousEngineeringAcceptance/list", res);
let result = res.result
if (res.result.length > 0) {
if (res.result[0].acceptanceResult === null) this.isShowBtn = false
if (res.result[0].acceptanceResult === 1) this.isShowBtn = false
if (res.result[0].acceptanceResult === 2) this.isShowBtn = true
} else {
this.isShowBtn = true
}
}
})
},
checkNav(val) {
this.activeIndex = val.id
if (val.id == 1) {
this.componentName = "plan"
} else if (val.id == 2) {
this.componentName = "safe"
} else if (val.id == 3) {
this.componentName = "side"
} else if (val.id == 4) {
this.componentName = "workFinally"
}
},
addForm() {
if (this.activeIndex == 1) {
uni.navigateTo({
url: './addPlan?id=' + this.detailId
})
} else if (this.activeIndex == 2) {
if (uni.getStorageSync('dangerData')) {
uni.removeStorageSync('dangerData');
}
if (uni.getStorageSync('detailData')) {
uni.removeStorageSync('detailData');
}
uni.navigateTo({
// url:'../safeManage/addExamine?type=1&engineeringId='+this.detailId + '&moduleType=safeCheck'
url: '../../safeSame/addIssue?type=5&engineeringId=' + this.detailId +
'&moduleType=safeCheck'
})
} else if (this.activeIndex == 3) {
uni.navigateTo({
url: './addSide?id=' + this.detailId
})
} else if (this.activeIndex == 4) {
if (this.isShowBtn) {
uni.navigateTo({
url: './addWorkFinally?id=' + this.detailId + '&workTicketCode=' + this.detailData
.workTicketCode
})
} else {
uni.showToast({
title: '请勿重复操作',
icon: "none",
duration: 2000
});
}
}
},
getWeldingListAll() {
let data = {
projectSn: JSON.parse(uni.getStorageSync('projectDetail')).projectSn,
pageNo: 1,
pageSize: -1
}
this.sendRequest({
url: 'xmgl/pipelineWeldingRecord/page',
method: 'get',
data,
success: res => {
if (res.code == 200) {
this.weldingListAll = res.result.records
}
}
})
},
getDutyPerson() {
let data = {
projectSn: JSON.parse(uni.getStorageSync('projectDetail')).projectSn,
// isFilterQualityRegionEnterprise: 1
}
this.sendRequest({
url: 'xmgl/workerInfo/selectWorkerInfoList',
method: 'post',
data,
success: res => {
if (res.code == 200) {
this.workerListOptions = res.result.records
console.log('获取施工人员下拉', this.workerListOptions)
}
}
})
},
},
computed: {
isAffirmListUp() {
return row => {
const obj = {
1: '是',
0: '否'
};
return Array.isArray(row) ? row.map(item => (obj[item] ? obj[item] : '--')).join(',') : obj[
row] ? obj[row] : '--';
};
},
weldingListUp() {
return row => {
return this.weldingListAll
.filter(item => row.includes(item.id))
.map(item => item.weldingNumber)
.join(',');
};
},
workerListOptionsUp() {
return (workerName) => {
const find = this.workerListOptions.find(item => item.id == workerName);
return find ? find.workerName : '--';
}
},
}
}
</script>
<style lang="scss" scoped>
.download {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 10rpx;
// justify-content: center;
}
.img {
width: 120rpx;
height: 120rpx;
}
.gasanalysis-table {
table {
width: 100%;
// height: 100%;
font-size: 24rpx;
margin-bottom: 20rpx;
margin-top: 20rpx;
}
tr {
height: 100rpx;
}
td {
text-align: center;
// min-width: 80rpx;
}
table,
td,
th {
border: 2rpx solid #CDCDCD;
border-collapse: collapse;
// color: white;
}
th {
background-color: #EEEEEE;
font-size: 28rpx;
}
}
.fixed {
position: fixed;
z-index: 9999;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .3);
display: none;
&.show {
display: initial;
}
}
.iframeMain {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 650rpx;
font-size: 0;
.iframe {
width: 100%;
height: 500rpx;
}
}
.other-safe {
background-color: #fff;
// margin-top: 50rpx;
padding: 15rpx 15rpx;
line-height: 40rpx;
.other-head {
display: flex;
.other-icon {
width: 10rpx;
height: 40rpx;
background-color: #2b8df3;
border-radius: 100rpx;
}
.other-text {
margin-left: 20rpx;
}
}
.other-content {
font-size: 22rpx;
width: auto;
min-height: 50rpx;
// background-color: darkred;
// border: 1rpx solid black;
margin: 0 30rpx;
margin-top: 15rpx;
display: flex;
.content-1 {
width: 22%;
}
.content-2 {
width: 24%;
}
.content-3 {
width: 23%;
// margin-left: 10%;
}
.content-4 {
width: 26%;
}
}
}
.safe-mesure {
width: 100%;
height: 100rpx;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
.safe-btn {
text-align: center;
width: 80%;
line-height: 70rpx;
// background-color: darkred;
border: 4rpx solid #2b8df3;
color: #2b8df3;
border-radius: 20rpx;
font-weight: bold;
}
}
.table-info {
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
.teble-list {
display: flex;
justify-content: flex-start;
width: 100%;
font-size: 18rpx;
background-color: gainsboro;
.teble-item {
width: 24.8%;
line-height: 40rpx;
// border: 1rpx solid black;
// background-color: darkred;
.item-col {
// margin: 0 5rpx;
margin-left: 5rpx;
margin-top: 5rpx;
padding: 3rpx;
text-align: center;
background-color: #fff;
}
}
}
.u-td {
height: auto;
}
}
.dangerbig-details {
min-height: 100%;
// background: #F6F6F6;
.fixedheader {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 2;
background-color: white;
}
.detail-content {
padding-top: 20rpx;
}
.list {
margin-bottom: 20rpx;
}
.list-info {
background: #fff;
// border-bottom: 1px solid #F6F6F6;
font-size: 26rpx;
padding: 20rpx 30rpx;
display: flex;
flex-wrap: wrap;
// align-items: center;
}
.list-info {
.source-box {
display: flex;
flex-direction: column;
text {
color: #8F8FF7;
text-decoration: underline;
margin-top: 20rpx;
}
}
}
.list-info ul {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 20rpx;
}
.list-info ul li {
width: 30%;
height: 100px;
margin: 0 10rpx;
margin-bottom: 20rpx;
}
.list-info ul li image {
width: 100%;
height: 100%;
}
.more-btn {
text-align: center;
font-size: 28rpx;
// height: 50rpx;
background: #F1F7FE;
line-height: 50rpx;
border-top: 2rpx dashed #CCCCCC;
border-bottom: 2rpx dashed #CCCCCC;
padding: 14rpx 0;
color: #3190F3;
}
.nav-list {
display: flex;
height: 80rpx;
align-items: center;
padding: 0 20rpx;
.nav-item {
width: 25%;
text-align: center;
white-space: nowrap;
padding: 0 20rpx;
height: 80rpx;
box-sizing: border-box;
line-height: 80rpx;
font-size: 28rpx;
}
.active-nav {
border-bottom: 4rpx solid #4396E7;
}
}
.detail-nav {
width: 100%;
}
.scrollx-wrap {
width: 100%;
background: #fff;
}
.add-btn {
background: #4181FE;
width: 96rpx;
height: 96rpx;
border-radius: 50%;
text-align: center;
line-height: 96rpx;
position: fixed;
bottom: 40rpx;
right: 40rpx;
span {
font-size: 60rpx;
line-height: 90rpx;
color: #fff;
}
}
}
</style>