761 lines
22 KiB
Vue
761 lines
22 KiB
Vue
<template>
|
||
<view>
|
||
<u-navbar
|
||
class="u-navbar"
|
||
title="现场监护"
|
||
placeholder
|
||
@leftClick="leftClick"
|
||
leftIconColor="#fff"
|
||
bgColor="#00337A"
|
||
:titleStyle="{ color: '#FFF', fontSize: '32rpx' }"
|
||
/>
|
||
|
||
<view class="custody-container">
|
||
<view class="header-btn">
|
||
<view :class="{ active: current === 0 }" @tap="onCheckTap(0)">新增数据</view>
|
||
<view :class="{ active: current === 1 }" @tap="onCheckTap(1)">我的数据</view>
|
||
</view>
|
||
|
||
<view style="width: 100%">
|
||
<swiper style="width: 100%" :current="current" @change="onSwiperChange" :style="{ height: navHeight + 'px' }">
|
||
<swiper-item class="swiper-item-content" :style="{ height: navHeight + 'px' }">
|
||
<scroll-view scroll-y="true" class="scroll-view-y" :style="{ height: navHeight + 'px' }">
|
||
<view class="risk-header">
|
||
<view class="risk-left">
|
||
<view>今日</view>
|
||
<view>风险</view>
|
||
</view>
|
||
<view class="risk-right">
|
||
<view style="margin-top: 16rpx">
|
||
<text>我的项目</text>
|
||
<text style="color: #ca6d58">高风险 {{ riskInfo.gfxNum || 0 }}</text>
|
||
<text style="color: #c2a95d; margin-left: 46rpx">中风险 {{ riskInfo.zfxNum || 0 }}</text>
|
||
<text style="color: #b12d3f; margin-left: 46rpx">特高风险 {{ riskInfo.tgfxNum || 0 }}</text>
|
||
</view>
|
||
<view>
|
||
<text>全部项目</text>
|
||
<text style="color: #ca6d58">高风险 {{ riskInfo.gfxNumAll || 0 }}</text>
|
||
<text style="color: #c2a95d; margin-left: 46rpx">中风险 {{ riskInfo.zfxNumAll || 0 }}</text>
|
||
<text style="color: #b12d3f; margin-left: 46rpx">特高风险 {{ riskInfo.tgfxNumAll || 0 }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 选择今日 日计划风险 -->
|
||
<view class="change-today">
|
||
<view class="today-title">
|
||
<view class="title-bold">选择今日 日计划风险</view>
|
||
<view @tap="onSelectRisk">去选择风险点</view>
|
||
</view>
|
||
|
||
<uni-forms
|
||
:modelValue="submitParams"
|
||
ref="submitFormRef"
|
||
:rules="submitFormRules"
|
||
label-position="top"
|
||
label-width="200"
|
||
>
|
||
<uni-forms-item label="作业风险内容" required name="zynr">
|
||
<u--textarea placeholder="请填写" autoHeight v-model="submitParams.zynr" clearable></u--textarea>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="风险等级" required name="fxdjName">
|
||
<u--input type="text" placeholder="请填写" v-model="submitParams.fxdjName" clearable />
|
||
</uni-forms-item>
|
||
<uni-forms-item label="工程名称" required name="proName">
|
||
<u--textarea type="text" autoHeight placeholder="请填写" v-model="submitParams.proName" clearable />
|
||
</uni-forms-item>
|
||
</uni-forms>
|
||
</view>
|
||
|
||
<!-- 现场监护 -->
|
||
|
||
<view class="scene-container">
|
||
<view class="title-bold">现场监护</view>
|
||
<uni-forms
|
||
:modelValue="submitParams"
|
||
ref="submitFormRef_2"
|
||
:rules="submitFormRules"
|
||
label-position="top"
|
||
label-width="200"
|
||
>
|
||
<uni-forms-item label="当前位置" required name="address">
|
||
<view class="address-content">
|
||
<u--input type="text" placeholder="请填写" v-model="submitParams.address" />
|
||
<view class="address-info">
|
||
<text>
|
||
{{ submitParams.lat }}
|
||
</text>
|
||
<text>
|
||
{{ submitParams.lon }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="附件上传(1-6张照片)" required>
|
||
<view class="example-body">
|
||
<uni-file-picker
|
||
v-model="imageValue"
|
||
fileMediatype="image"
|
||
mode="grid"
|
||
@select="select"
|
||
@delete="onDelete"
|
||
limit="6"
|
||
title="最多选择6张图片"
|
||
></uni-file-picker>
|
||
</view>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="电子签名(1-6人)" required>
|
||
<view class="autograph">
|
||
<view class="autograph-img-box">
|
||
<view v-for="item in autographImgList" :key="item.name">
|
||
<image :src="item.url" mode="scaleToFill" class="view-autograph"></image>
|
||
<text class="delete-icon" @tap="onDeleteAutograph(item)">
|
||
<uni-icons type="trash-filled" size="24" style="color: #fa3534"></uni-icons>
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view class="open-box" @tap="onOpenAutograph">打开签字板</view>
|
||
</view>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="备注(可编辑)" required name="remark">
|
||
<u--textarea placeholder="请填写" autoHeight v-model="submitParams.remark" clearable></u--textarea>
|
||
</uni-forms-item>
|
||
</uni-forms>
|
||
<view class="submit-btn" @tap="onSubmitForm">提交</view>
|
||
</view>
|
||
</scroll-view>
|
||
</swiper-item>
|
||
<!-- 我的数据 -->
|
||
<swiper-item>
|
||
<view class="swiper-item-content" :style="{ height: navHeight + 'px' }">
|
||
<scroll-view scroll-y="true" class="scroll-view-y" :style="{ height: navHeight + 'px' }">
|
||
<view class="my-data-header-container">
|
||
<view class="my-data-header">
|
||
<view style="width: 32%">
|
||
<uni-datetime-picker
|
||
type="date"
|
||
v-model="detailsParams.date"
|
||
:clear-icon="false"
|
||
@maskClick="maskClick"
|
||
/>
|
||
</view>
|
||
<view style="width: 48%">
|
||
<u--input type="text" placeholder="请填写" v-model="detailsParams.remark" clearable />
|
||
</view>
|
||
<view style="width: 13%" @tap="getMySceneListData">搜索</view>
|
||
</view>
|
||
</view>
|
||
<view class="my-data-container" v-if="detailsList.length > 0">
|
||
<view class="my-data-content" v-for="item in detailsList" :key="item.id" @tap="onViewDetails(item)">
|
||
<view class="data-risk">
|
||
<text style="color: #cc413c">{{ item.fxdjName }}</text>
|
||
<text>{{ item.time }}</text>
|
||
</view>
|
||
<view class="pro-name-box">{{ item.proName }}</view>
|
||
<view class="pro-content">{{ item.zynr }}</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- <m-tabbar fixed fill :current="0" :tabbar="tabbar" class="bottom-tab"></m-tabbar> -->
|
||
|
||
<uni-popup ref="popup" type="center">
|
||
<view class="autograph-container">
|
||
<view class="autograph-btn">
|
||
<view style="margin-right: 16rpx" @tap="onClear">清除</view>
|
||
<view @tap="onSave">保存</view>
|
||
</view>
|
||
|
||
<view class="autograph-area">签名区域:</view>
|
||
<view class="autograph-area-box">
|
||
<l-signature
|
||
disableScroll
|
||
ref="signatureRef"
|
||
:penColor="penColor"
|
||
:penSize="penSize"
|
||
:openSmooth="openSmooth"
|
||
:preferToDataURL="false"
|
||
></l-signature>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import TabbarConfig from '../util/tabbar'
|
||
import { setRiskSubmitApi, getMySceneListApi, getTodayRiskApi } from '../../../api/workPlan/riskDay'
|
||
export default {
|
||
data() {
|
||
return {
|
||
current: 0,
|
||
tabbar: TabbarConfig,
|
||
navHeight: 100,
|
||
pH: 0, //窗口高度
|
||
|
||
/* 提交时参数 */
|
||
submitParams: {
|
||
photoPath: '', // 附件
|
||
signPath: '', // 签名
|
||
proId: '', // 项目ID
|
||
proTypes: '', // 工程类型
|
||
zynr: '', // 作业内容
|
||
fxdj: '', // 风险等级
|
||
address: '', // 地址
|
||
lon: '', // 经度
|
||
lat: '', // 纬度
|
||
remark: '', // 备注
|
||
fxdjName: '',
|
||
proName: ''
|
||
},
|
||
|
||
riskInfo: {},
|
||
penColor: '#000',
|
||
penSize: 3,
|
||
// url: '',
|
||
openSmooth: true,
|
||
autographSrc: '',
|
||
imageValue: [],
|
||
autographImgList: [],
|
||
submitFormRules: {
|
||
zynr: {
|
||
rules: [{ required: true, errorMessage: '请填写作业风险内容' }]
|
||
},
|
||
fxdjName: {
|
||
rules: [{ required: true, errorMessage: '请填写风险等级' }]
|
||
},
|
||
proName: {
|
||
rules: [{ required: true, errorMessage: '请填写工程名称' }]
|
||
},
|
||
address: {
|
||
rules: [{ required: true, errorMessage: '请填写当前位置' }]
|
||
},
|
||
photoPath: {
|
||
rules: [{ required: true, errorMessage: '请上传附件' }]
|
||
},
|
||
signPath: {
|
||
rules: [{ required: true, errorMessage: '请添加电子签名' }]
|
||
},
|
||
remark: {
|
||
rules: [{ required: true, errorMessage: '请填写备注' }]
|
||
}
|
||
},
|
||
detailsParams: {
|
||
date: '',
|
||
remark: ''
|
||
},
|
||
detailsList: []
|
||
}
|
||
},
|
||
methods: {
|
||
leftClick() {
|
||
uni.navigateBack()
|
||
},
|
||
onCheckTap(type) {
|
||
this.current = type
|
||
|
||
if (type == 0) {
|
||
this.detailsParams.date = ''
|
||
this.detailsParams.remark = ''
|
||
} else {
|
||
this.getMySceneListData()
|
||
}
|
||
},
|
||
onSwiperChange(e) {
|
||
console.log('轮播图change事件', e)
|
||
this.current = e.target.current
|
||
},
|
||
/* 选择风险点 */
|
||
onSelectRisk() {
|
||
uni.navigateTo({ url: '/pages/workPlan/selectRisk/index' })
|
||
},
|
||
/* 打开签字版 */
|
||
onOpenAutograph() {
|
||
if (this.autographImgList.length === 6) {
|
||
uni.showToast({
|
||
title: '最多签名6人',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
this.$refs.popup.open('enter')
|
||
},
|
||
onClear() {
|
||
// this.$refs.popup.close()
|
||
this.$refs.signatureRef.clear()
|
||
},
|
||
maskClick() {},
|
||
onSave() {
|
||
this.$refs.signatureRef.canvasToTempFilePath({
|
||
success: res => {
|
||
console.log(res, '画板结果--')
|
||
// 是否为空画板 无签名
|
||
// this.autographSrc = res.tempFilePath
|
||
|
||
uni.uploadFile({
|
||
url: 'http://192.168.0.14:19191/ynPlanApp/user/uploadPhoto',
|
||
filePath: res.tempFilePath,
|
||
name: 'image',
|
||
formData: {
|
||
file: res.tempFilePath,
|
||
photoType: 'photo'
|
||
},
|
||
header: { 'Content-Type': 'multipart/form-data' },
|
||
success: uploadFileRes => {
|
||
if (uploadFileRes.statusCode == 200) {
|
||
let imgNameList = res.tempFilePath.split('/')
|
||
let imgName = imgNameList[imgNameList.length - 1]
|
||
const itemInfo = {
|
||
name: imgName,
|
||
tempUrl: `ynPlan/photo/${this.$moment().format('YYYY')}/${this.$moment().format(
|
||
'MM'
|
||
)}/${this.$moment().format('DD')}/${imgName}`,
|
||
url: res.tempFilePath
|
||
}
|
||
this.autographImgList.push(itemInfo)
|
||
|
||
console.log('this.autographImgList', this.autographImgList)
|
||
}
|
||
}
|
||
})
|
||
|
||
this.$refs.popup.close()
|
||
}
|
||
})
|
||
},
|
||
select(e) {
|
||
e.tempFiles.forEach(item => {
|
||
const imgUrl = item.url
|
||
const imgName = item.name
|
||
uni.uploadFile({
|
||
url: 'http://192.168.0.14:19191/ynPlanApp/user/uploadPhoto',
|
||
filePath: imgUrl,
|
||
name: 'image',
|
||
formData: {
|
||
file: imgUrl,
|
||
photoType: 'photo'
|
||
},
|
||
header: { 'Content-Type': 'multipart/form-data' },
|
||
success: uploadFileRes => {
|
||
if (uploadFileRes.statusCode == 200) {
|
||
console.log('上传成功!')
|
||
const imgInfo = {
|
||
name: imgName,
|
||
tempUrl: `ynPlan/photo/${this.$moment().format('YYYY')}/${this.$moment().format(
|
||
'MM'
|
||
)}/${this.$moment().format('DD')}/${imgName}`,
|
||
url: imgUrl
|
||
}
|
||
|
||
this.imageValue.push(imgInfo)
|
||
}
|
||
}
|
||
})
|
||
})
|
||
},
|
||
onDelete(e) {
|
||
const tempFilePath = e.tempFilePath
|
||
this.imageValue = this.imageValue.filter(e => e.url !== tempFilePath)
|
||
},
|
||
/* 删除签名 */
|
||
onDeleteAutograph(item) {
|
||
this.autographImgList = this.autographImgList.filter(e => e.name !== item.name)
|
||
},
|
||
/* 表单提交 */
|
||
onSubmitForm() {
|
||
if (this.imageValue.length < 1) {
|
||
uni.showToast({ icon: 'none', title: '请上传附件图片' })
|
||
return
|
||
}
|
||
if (this.autographImgList.length < 1) {
|
||
uni.showToast({ icon: 'none', title: '请签名' })
|
||
return
|
||
}
|
||
if (this.imageValue.length > 0) {
|
||
let fileStr = ''
|
||
this.imageValue.forEach(e => {
|
||
fileStr += e.tempUrl + ','
|
||
})
|
||
this.submitParams.photoPath = fileStr.slice(0, -1)
|
||
}
|
||
if (this.autographImgList.length > 0) {
|
||
let fileStr = ''
|
||
this.autographImgList.forEach(e => {
|
||
fileStr += e.tempUrl + ','
|
||
})
|
||
this.submitParams.signPath = fileStr.slice(0, -1)
|
||
}
|
||
|
||
console.log(' this.submitParams---------参数', this.submitParams)
|
||
this.$refs.submitFormRef.validate(valid => {
|
||
if (valid) {
|
||
console.log(valid)
|
||
} else {
|
||
this.$refs.submitFormRef_2.validate(async res => {
|
||
if (res) {
|
||
console.log(res)
|
||
} else {
|
||
console.log('校验通过')
|
||
|
||
const result = await setRiskSubmitApi(this.submitParams)
|
||
console.log(result, 'resultresult提交结果')
|
||
|
||
if (result.resMsg == 'success') {
|
||
setTimeout(() => {
|
||
uni.showToast({ title: '提交成功', icon: 'none' })
|
||
}, 500)
|
||
uni.navigateBack()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
},
|
||
/* 获取详情列表 */
|
||
async getMySceneListData() {
|
||
const res = await getMySceneListApi(this.detailsParams)
|
||
|
||
if (res.resMsg == 'success') {
|
||
this.detailsList = res.obj
|
||
} else {
|
||
this.detailsList = []
|
||
}
|
||
|
||
console.log(res, '详情数据')
|
||
},
|
||
/* 跳转详情 */
|
||
onViewDetails(item) {
|
||
console.log(item, '-----')
|
||
uni.navigateTo({ url: `/pages/workPlan/guaRecord/index?id=${item.id}` })
|
||
},
|
||
/* 获取今日风险 */
|
||
async getTodayRiskData() {
|
||
const res = await getTodayRiskApi({ id: '' })
|
||
if (res.resMsg == 'success') {
|
||
this.riskInfo = res.obj[0]
|
||
}
|
||
}
|
||
},
|
||
|
||
onLoad(options) {
|
||
this.getMySceneListData()
|
||
this.getTodayRiskData()
|
||
// 获取定位位置信息
|
||
uni.getLocation({
|
||
type: 'gcj02', // 默认为 gcj02,可以选择 'wgs84'
|
||
altitude: true,
|
||
geocode: true,
|
||
success: res => {
|
||
console.log(res, '位置信息--')
|
||
const { latitude, longitude } = res
|
||
const { province, city, district, street, streetNum, poiName } = res.address
|
||
|
||
this.submitParams.lon = longitude
|
||
this.submitParams.lat = latitude
|
||
console.log(province, 'province')
|
||
this.submitParams.address = `${province}${city}${district}${street}${streetNum}${poiName}`
|
||
},
|
||
fail: err => {
|
||
console.error('获取位置失败:', err)
|
||
uni.showToast({ title: '位置获取失败,请稍后尝试',icon:'none' })
|
||
}
|
||
})
|
||
|
||
const _this = this
|
||
uni.$on('update', function (data) {
|
||
// this_.getViewDataList()
|
||
console.log(data, '传递的数据')
|
||
const { proId, proName, zynr, fxdj, fxdjName } = data
|
||
_this.submitParams.zynr = zynr
|
||
_this.submitParams.fxdj = fxdj
|
||
_this.submitParams.proName = proName
|
||
_this.submitParams.fxdjName = fxdjName
|
||
_this.submitParams.proId = proId
|
||
_this.riskInfo = data
|
||
const remark = `(${uni.getStorageSync('wkName')})${_this
|
||
.$moment()
|
||
.format('YYYY-MM-DD')}到${proName},现场监护${fxdjName}作业实施。`
|
||
_this.submitParams.remark = remark
|
||
})
|
||
},
|
||
onUnload() {
|
||
uni.$off('update')
|
||
},
|
||
onReady() {
|
||
let that = this
|
||
uni.getSystemInfo({
|
||
//调用uni-app接口获取屏幕高度
|
||
success(res) {
|
||
//成功回调函数
|
||
that._data.pH = res.windowHeight //windoHeight为窗口高度,主要使用的是这个
|
||
console.log('res.windowHeight窗口高度', res.windowHeight)
|
||
let titleH = uni.createSelectorQuery().select('.scroll-view-y') //想要获取高度的元素名(class/id)
|
||
titleH
|
||
.boundingClientRect(data => {
|
||
let pH = that._data.pH
|
||
that._data.navHeight = pH - data.top //计算高度:元素高度=窗口高度-元素距离顶部的距离(data.top)
|
||
|
||
console.log('that._data.navHeight', that._data.navHeight)
|
||
})
|
||
.exec()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.custody-container {
|
||
// background-color: #ccc;
|
||
|
||
.header-btn {
|
||
display: flex;
|
||
background-color: #fff;
|
||
|
||
view {
|
||
flex: 1;
|
||
padding: 30rpx 0;
|
||
color: #a8a8ad;
|
||
font-size: 36rpx;
|
||
text-align: center;
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.active {
|
||
color: #043372;
|
||
border-bottom: 2px solid #043372;
|
||
}
|
||
}
|
||
|
||
.swiper-item-content {
|
||
background-color: #efefef;
|
||
}
|
||
|
||
.scroll-view-y {
|
||
width: 100%;
|
||
background-color: #efefef;
|
||
|
||
.title-bold {
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
}
|
||
.risk-header {
|
||
width: 94%;
|
||
margin: 16rpx auto;
|
||
display: flex;
|
||
align-items: center;
|
||
background-color: #fff;
|
||
padding: 2rpx 14rpx;
|
||
border: 1px solid #ccc;
|
||
border-radius: 6rpx;
|
||
|
||
.risk-left {
|
||
padding: 10rpx;
|
||
border-radius: 10rpx;
|
||
background-color: #da0019;
|
||
color: #fff;
|
||
}
|
||
|
||
.risk-right {
|
||
margin-left: 6rpx;
|
||
}
|
||
}
|
||
|
||
.change-today {
|
||
width: 94%;
|
||
margin: 16rpx auto;
|
||
padding: 26rpx;
|
||
border: 1px solid #ccc;
|
||
background-color: #fff;
|
||
border-radius: 6rpx;
|
||
|
||
.today-title {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.today-title view:last-child {
|
||
padding: 26rpx 6rpx;
|
||
background-color: #d6001a;
|
||
border-radius: 20rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
::v-deep .uni-forms-item__label {
|
||
font-weight: bold;
|
||
color: #000;
|
||
font-size: 26rpx;
|
||
}
|
||
}
|
||
.scene-container {
|
||
width: 94%;
|
||
margin: 16rpx auto;
|
||
padding: 26rpx;
|
||
border: 1px solid #ccc;
|
||
background-color: #fff;
|
||
border-radius: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
::v-deep .address-content {
|
||
position: relative;
|
||
|
||
.address-info {
|
||
position: absolute;
|
||
right: 0;
|
||
top: -30px;
|
||
|
||
text {
|
||
margin-right: 46rpx;
|
||
}
|
||
}
|
||
}
|
||
.autograph {
|
||
position: relative;
|
||
|
||
.autograph-img-box {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.view-autograph {
|
||
width: 100%;
|
||
height: 180rpx;
|
||
}
|
||
|
||
view {
|
||
width: 30%;
|
||
margin-left: 5%;
|
||
margin-top: 20rpx !important;
|
||
height: 180rpx;
|
||
background-color: #eee;
|
||
border: 1px solid #ccc;
|
||
box-sizing: border-box;
|
||
position: relative;
|
||
|
||
.delete-icon {
|
||
position: absolute;
|
||
top: 3rpx;
|
||
right: 3rpx;
|
||
}
|
||
}
|
||
}
|
||
.autograph-img-box view:nth-child(3n + 1) {
|
||
margin: 0;
|
||
}
|
||
}
|
||
.open-box {
|
||
position: absolute;
|
||
right: 0;
|
||
top: -68rpx;
|
||
// width: 140rpx;
|
||
height: 68rpx;
|
||
padding: 0 10rpx;
|
||
line-height: 68rpx;
|
||
text-align: center;
|
||
background-color: #003777;
|
||
color: #fff;
|
||
}
|
||
|
||
.autograph-container {
|
||
width: 95vw;
|
||
height: 50vh;
|
||
padding-bottom: 18rpx;
|
||
background-color: #fff;
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.autograph-btn {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
padding: 12rpx 0;
|
||
|
||
view {
|
||
width: 15%;
|
||
height: 62rpx;
|
||
border-radius: 12rpx;
|
||
border: 1px solid $u-primary;
|
||
color: $u-primary;
|
||
line-height: 62rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
.autograph-area {
|
||
width: 94%;
|
||
margin: 0 auto;
|
||
padding: 10rpx 0;
|
||
}
|
||
|
||
.autograph-area-box {
|
||
margin: 0 auto;
|
||
width: 94%;
|
||
flex: 1;
|
||
border: 1px solid #fa3534;
|
||
}
|
||
}
|
||
|
||
.submit-btn {
|
||
width: 96%;
|
||
height: 78rpx;
|
||
margin: 0 auto;
|
||
border-radius: 14rpx;
|
||
background-color: #003777;
|
||
font-size: 26rpx;
|
||
text-align: center;
|
||
line-height: 78rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.my-data-header-container,
|
||
.my-data-container {
|
||
width: 96%;
|
||
margin: 16rpx auto 20rpx;
|
||
padding: 12rpx 0;
|
||
border: 1px solid #ccc;
|
||
background-color: #fff;
|
||
border-radius: 10prx;
|
||
}
|
||
|
||
.my-data-header {
|
||
width: 96%;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
}
|
||
|
||
.my-data-content {
|
||
width: 96%;
|
||
margin: 0 auto 15rpx;
|
||
padding: 15rpx 0;
|
||
border: 1px solid #ccc;
|
||
border-radius: 6prx;
|
||
|
||
.data-risk {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 10rpx;
|
||
}
|
||
|
||
.pro-name-box {
|
||
padding: 10rpx;
|
||
}
|
||
|
||
.pro-content {
|
||
width: 98%;
|
||
margin: 0 auto;
|
||
// padding: 15rpx 10rpx;
|
||
border: 1px solid #ccc;
|
||
border-radius: 6rpx;
|
||
}
|
||
}
|
||
</style>
|