【无标题】

var that = this
import {
request,
request2
} from '@/api/api.js'
import {
baseUrl2
} from '@/api/baseUrl.js'


//  获取当前位置的权限
function getSettingMy(a) {
return new Promise((resolve, reject) => {
uni.getSetting({
success(res) {
resolve(res.authSetting[a])
}
})
})
}
// 弹出获取授权 仅仅做个标志
function getAuthorizeInfo(a = 'scope.userLocation') {
return new Promise(function(resolve, reject) {
uni.authorize({
scope: a,
success() {
resolve()
},
fail(error) {
uni.showModal({
title: '提示',
content: '若点击不授权，将无法使用位置功能',
cancelText: '不授权',
cancelColor: '#999',
confirmText: '授权',
confirmColor: '#f94218',
success(res) {
if (res.confirm) {
uni.openSetting({
success(res) {
resolve()
}
});
} else if (res.cancel) {
reject(false)
}
}
});
}
})
})
}
// 取当前地理位置(直接) 并返回，包括经纬度
function getLocationInfo() {
return new Promise(function(resolve, reject) {
uni.getLocation({
type: 'wgs84', // 返回可以用于 uni.openLocation 的坐标
success: function(res) {
reverseGeocode(res.latitude, res.longitude).then(resLocal => {
if (resLocal.info === 'OK') {
resLocal.regeocode.latitude = res.latitude
resLocal.regeocode.longitude = res.longitude
resolve(resLocal.regeocode)
}
})
},
})
})
}
//  逆地理编码
function reverseGeocode(latitude, longitude, flag = true) {
return new Promise(function(resolve, reject) {
var that = this
const key = '311c823ef3de9ac16f6c01e9eacd8b54'; // 换成你自己的AppKey
const url =
`https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=${longitude},${latitude}&key=${key}&radius=1000&extensions=base`;

uni.request({
url: url,
method: 'GET',
success: (res) => {
if (res.data.info == 'OK') {
console.log(res.data)
resolve(res.data)
} else {
reject(res.data)
}
},
fail(err) {
reject(err)
},
});
})
}
//  调用省份获取code
function getProvinceORCityCode(name, data) {
return new Promise((resolve, reject) => {
let url = ''
let obj = {}
if (name === 'city') {
url = 'dict/city/info'
obj = {
cityName: data
}
} else if (name === 'province') {
url = 'dict/province/info'
obj = {
provinceName: data
}
}
request({
methods: 'post',
url: url,
data: JSON.stringify(obj),
dataType: 'json',
header: {
'content-type': 'application/json'
}
}).then(res => {
resolve(res.data)
}).catch(err => {
reject(err)
})
})
}
//  上传图片
function uploadFlieMy(dataValue,tit='上传中') {
return new Promise((resolve, reject) => {
uni.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: (res) => {
const tempFilePaths = res.tempFilePaths;
const queryString = Object.keys(dataValue) // 解析要上传的信息
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(dataValue[key])}`)
.join('&');
uni.showLoading({
title: tit,
mask: true
})
// 上传图片
uni.uploadFile({
url: baseUrl2 +
`business/img/upload/drivingLicense?${queryString}`, // 服务器接收上传文件的URL
filePath: tempFilePaths[0],
name: 'file', // 必须填写文件对应的 key
formData: {},
success: (res) => {
resolve(res)
uni.hideLoading()
},
fail: (err) => {
uni.hideLoading()
}
});
},
});
})
}


export {
reverseGeocode,
getProvinceORCityCode,
getAuthorizeInfo,
getLocationInfo,
getSettingMy,
uploadFlieMy
}

<template>
<view>
<uni-card :is-shadow="false" style="padding:0 !important">
<view class='cardImg'>
<view>基本信息</view>
</view>
<!-- scanInput_left -->
<u-form :model="form" ref="uForm" :label-width="80" labelAlign='center' :rules='rules'>
<view class='rule'>
<u-form-item label="车牌号码" prop="plateNo">
<view class="scanInput">
<u-input v-model.trim="form.plateNo" border="none" placeholder="请输入车牌号" />
<uni-icons class='camera-filled' type="camera-filled" size="30"
@click="unpload"></uni-icons>
</view>
</u-form-item>
</view>

<view class='rule'>
<u-form-item label="车辆车型" prop="carType">
<view class="scanInput car">
<u-input v-model.trim="form.carType" border="none" placeholder="请输入车型" />
<uni-icons v-if='vehicleNameList.length>0' type="down" size="20"
@click="selectBoxOpen('carType')" style='padding: 10rpx'></uni-icons>
</view>
</u-form-item>
</view>


<u-form-item label="机构名称" prop='orgName' v-if='form.userType==0'><u-input v-model="form.orgName"
border="none" :readonly="true" placeholder="请输入机构名称" /></u-form-item>
<view class='rule'>
<u-form-item label="报案号码" prop="caseNo"><u-input v-model="form.caseNo" border="none"
placeholder="请输入报案号" /></u-form-item>
</view>
<view class='rule'>
<u-form-item label="联系人" prop="contactName"><u-input v-model.trim="form.contactName" border="none"
placeholder="请输入联系人" /></u-form-item>
</view>
<view class='rule'>
<u-form-item label="联系电话" prop='contactPhone'><u-input v-model="form.contactPhone" border="none"
placeholder="请输入电话" /></u-form-item>
</view>
<view class='rule'>
<u-form-item label="损失情况" prop="loseInfo" @click="selectBoxOpen('loseInfo')">
<u--input v-model="form.loseInfo" disabled disabledColor="#ffffff" placeholder="请选择损失情况"
border="none"></u--input>

</u-form-item>
</view>

<u-form-item v-if="form.loseInfo=='其他'" label="详细信息" prop="loseRemark"><u-input
v-model="form.loseRemark" border="none" placeholder="详细信息" /></u-form-item>
<view class='rule'>
<u-form-item label="车辆位置">
<view class='btn'>
<u-button size="default"
style="border:none !important;background-color: transparent;color: rgb(228, 234, 236)"
@click="addClick">
<span v-if='form.carLocation2'
style='display: inline-flexbox;width: 450rpx;'>{{form.carLocation2}}</span>
<span v-else
style='display: inline-flexbox;font-size: 24rpx !important;color:rgb(184,188,197) !important;width: 450rpx;'>请选择地址</span>
</u-button>
</view>
</u-form-item>
</view>
<view class='rule'>
<u-form-item label="详细地址" prop="carLocation"><u-input v-model="form.carLocation" border="none"
placeholder="详细地址" /></u-form-item>
</view>
<u-form-item label="机构名称" prop='orgName'><u-input v-model="form.orgName" border="none" :readonly="true"
placeholder="请输入机构名称" /></u-form-item>

<u-form-item label="预估距离" prop="estimatedCost">
<u-input v-model="form.estimatedCost2" :readonly="true" placeholder="请选择距离" border="none"></u-input>
</u-form-item>
</u-form>
</uni-card>
<!-- 查勘员查勘定损图片 -->
<uni-card :is-shadow="false">
<view class='cardImg'>
<view>查勘员查勘定损图片</view>
<view @click="uploadImg('bottom')" class='addimgBtn'><uni-icons color='#fff' type="plusempty"
size="24"></uni-icons></uni-icons>
</view>
</view>
<view class="album">
<u-album @More='moreBox' @delImg='delImg' class='custom-album' :delBtn='true' :urls="itemImage"
keyName="imgUrl"></u-album>
</view>
</uni-card>
<view class="btn-wrap">
<u-button type="primary" plain :ripple="true" size="medium" @click="submit"
:disabled="disabledBTN">提交</u-button>
</view>
<!--  select 选择框 -->
<u-action-sheet :show="selectBox" :actions="selectOption" :title="selectTitle" @close="selectBox = false"
@select="select_select">
</u-action-sheet>
<!--  提示框 -->
<u-toast ref="uToast"></u-toast>
<!--  提示框 -->
<dialogYesOrNo ref="alertDialog" :content="dialogContent" @dialogClose="dialogClose" @confirm="dialogConfirm">
</dialogYesOrNo>
<!--  图片的弹框 -->
<uni-popup ref="popup" background-color="#fff">
<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
<view class="popup_img">
<view style="text-align: center;"> 添加图片 </view>
<uni-file-picker v-model="fileList1" ref="files" fileMediatype="image" mode="grid" @select="select"
@delete="deleteM" />
<u-button size="small" type="primary" :plain="true" :hairline="true" text="细边" @click='submitbtn'>确
定</u-button>
</view>
</view>
</uni-popup>
<!--  显示更多照片 -->
<uni-popup ref="popupImg" background-color="#fff">
<view class='pop_tit'>{{itemImage.length}}张图片</view>
<view class="popup-content showMoreImg">
<view class="img" v-for="(item, index) in itemImage" :key="index" @click="myPicClick(index)">
<image style="width: 170rpx; height: 170rpx;" mode="scaleToFill" :src="item.imgUrl"></image>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import Address from '../login/address.vue';
import dialogYesOrNo from '@/static/componentAll/dialogYesOrNo.vue';
import {
baseUrl2
} from '@/api/baseUrl.js'
import {
getLocationMy,
reverseGeocode,
getProvinceORCityCode,
isGetLocation,
getLocationInfo,
getAuthorizeInfo,
getSettingMy,
uploadFlieMy
} from '@/static/api/methodsMy.js'
export default {
components: {
Address,
dialogYesOrNo
},
data() {
return {

fileList1: [],
disabledBTN: true,
selectTitle: '',
selectOption: [],
imageValue: [],
imgObj: [],
dialogContent: '',
openDialogYesOrNo: '',
swiperDotIndex: 0,
itemImage: [],
businessId: '',
form: {
plateNo: '',
userType: '',
carType: '',
caseNo: '',
orgName: '',
contactName: '',
contactPhone: '',
loseInfo: '',
carLocation: '',
},
oldName: '',
oldPhone: '',
info: {},
vehicleNameList: [],
rules: {
plateNo: [{
required: true,
message: '请输入车牌号',
trigger: ['change', 'blur'],
}],
caseNo: [{
required: true,
message: '请输入报案号',
trigger: ['change', 'blur'],
},
{
pattern: /^[a-zA-Z0-9]+$/,
message: '报案号码只能为数字或者字母',
trigger: 'blur'
}
],
carType: [{
required: true,
message: '请输入车型',
trigger: ['change', 'blur'],
}],
contactName: [{
required: true,
message: '请输入联系人姓名',
trigger: ['change', 'blur'],
}],
contactPhone: [{
required: true,
message: '请输入联系人电话',
trigger: ['change', 'blur'],
}, {
pattern: /^[1][3,4,5,7,8][0-9]{9}$/,
message: '手机号格式有误',
trigger: 'blur'
}],
loseInfo: [{
required: true,
message: '请输入损失情况',
trigger: ['change', 'blur'],
}],
orgName: [{
required: true,
message: '请输入机构名称',
trigger: ['change', 'blur'],
}],

},

selectBox: false, //司保弹框 
tit: '', //司保弹框 
myimgdata: [],
dataVal: {},
loseInfoOption: [{
name: '托底',
id: 0
},
{
name: '碰撞',
id: 10
}, {
name: '水淹',
id: 1
},
{
name: '其他',
id: 101
},
],

}
},

onReady() {
this.$refs.uForm.setRules(this.rules);
this.createForm()
},
onLoad() {
this.getUUID() // 获取 id 
// 判断是否授权
getSettingMy('scope.userLocation').then(res => {
if (!res) {
getAuthorizeInfo()
}
})
},
onShow() {


},
watch: {
// 判断是否是空对象
'form.contactName'(val) {
let obj = uni.getStorageSync('loginInfo')
this.oldName = obj.userName
if (val !== obj.userName && val === '') {
this.$refs.alertDialog.open()
this.dialogContent = '确定要修改联系人姓名吗'
this.openDialogYesOrNo = 'contactName'
}
},
'form.contactPhone'(val) {
let obj = uni.getStorageSync('loginInfo')
this.oldPhone = obj.phone
if (val !== obj.phone && val === '') {
this.$refs.alertDialog.open()
this.dialogContent = '确定要修改联系人手机号吗'
this.openDialogYesOrNo = 'contactPhone'
}
}
},
methods: {
getAddressId() {
var that = this
uni.getLocation({
type: 'wgs84', // 返回可以用于 uni.openLocation 的坐标
success: function(res) {
reverseGeocode(res.latitude, res.longitude).then(resLocal => {
if (resLocal.info === 'OK') {
let values = JSON.parse(JSON.stringify(resLocal.regeocode))
let data = values.addressComponent
if (data.province === '上海市' || data.province === '北京市' || data
.province === '天津市' ||
data.province === '重庆市') {
data.city = data.province
}
let loginInfo = uni.getStorageSync('loginInfo');
let obj = {
adCode: data.adcode,
businessId: that.businessId,
city: data.city,
cityCode: data.citycode,
country: data.country,
district: data.district,
formattedAddress: values.formatted_address,
lat: res.latitude,
lon: res.longitude,
province: data.province,
townCode: data.towncode,
townShip: data.township,
userId: loginInfo.id,
}
uni.showLoading({
title: '加载中',
mask: true
})
that.$request({
methods: 'post',
url: 'map/gd/locate',
data: JSON.stringify(obj),
dataType: 'json',
header: {
'content-type': 'application/json'
}
}).finally(() => {
uni.hideLoading()
})
}
})
},
fail: function(err) {
console.log(err)
}
})
},
//  打开选择框 和 select 的选择
selectBoxOpen(tit) {
this.selectBox = true;
switch (tit) {
case "loseInfo":
this.selectTitle = '请选择损失情况'
this.selectOption = JSON.parse(JSON.stringify(this.loseInfoOption))
break;
case "carType":
this.selectTitle = '请选择车型'
this.selectOption = JSON.parse(JSON.stringify(this.vehicleNameList))
break;
default:
break;
}
this.tit = tit
},
select_select(event) {
uni.hideKeyboard()
let tit = this.tit
switch (tit) {
case "loseInfo":
this.form.loseInfo = event.name
this.$refs.uForm.validateField('loseInfo')
break;
case "carType":
this.form.carType = event.name
this.$refs.uForm.validateField('carType')
break;
default:
break;
}
},
//  弹框 取消按钮
dialogClose() {
switch (this.openDialogYesOrNo) {
case "contactName":
this.form.contactName = this.oldName
this.$refs.uForm.validateField('contactName')
break;
case "contactPhone":
this.form.contactPhone = this.oldPhone
this.$refs.uForm.validateField('contactPhone')
break;
case "carType":
this.form.carType = event.name
break;
default:
break;
}
},
//  dialog 确定按钮
dialogConfirm() {
switch (this.openDialogYesOrNo) {
case "delImg":
this.delImgConfirm()
break;
default:
break;
}
},
delImgConfirm() {
let data = [
this.delId
]
var that = this
this.$request2({
methods: 'delete',
url: 'business/img',
data: data
}).then(res => {
if (res.code == 0) {
this.getImageList() //刷新页面
uni.showToast({
title: '删除成功',
})
}
})
this.$refs.alertDialog.close()
},
// 解析车牌号
unpload() {
// 选择图片
var that = this
let obj = uni.getStorageSync('loginInfo')
let dataValue = {
businessId: this.businessId,
userId: obj.id,
imgType: '0'
}
uploadFlieMy(dataValue, '解析中').then(res => {
let obj = JSON.parse(res.data)
if (obj.code == '0') {
that.form.plateNo = obj.data.plateNo
that.vehicleNameList = obj.data.vehicleNameList.map(item => ({
name: item
}));
this.$refs.uForm.validateField('plateNo')
} else {
this.form.carType = ''
uni.$u.toast(obj.msg)
}
})
},
getUUID() {
this.$request2({
methods: 'get',
url: 'business/id/generator',
}).then(res => {
this.businessId = res.data
})

},
getImageList() {
this.$request2({
methods: 'get',
url: 'business/img/list',
data: {
businessId: this.businessId
}
}).then(res => {
this.itemImage = res.data
this.imageValue = res.data
})

},

//  删除图片
delImg(val) {
this.delId = val.id
this.$refs.alertDialog.open()
this.dialogContent = '确定要删除这张图片吗？'
this.openDialogYesOrNo = 'delImg'
},

//  放大图片
myPicClick(index) {
let urls = []
this.imageValue.forEach(i => {
urls.push(i.imgUrl)
})
uni.previewImage({
urls: urls,
current: index,
});
},


//  打开弹框
uploadImg(type) {
this.$refs.uForm.validate().then(res => {
if (!this.form.carLocation2) {
uni.$u.toast('请先录入基本信息')
return
}
this.$refs.popup.open(type)
this.$refs.alertDialog.close()
this.fileList1 = []
this.imgObj = []
}).catch(errors => {
uni.$u.toast('请先录入基本信息')
})

},

select(e) {
this.imgObj.push(...e.tempFilePaths)
if (this.imgObj.length >= 9) {
uni.showToast({
title: `最多一次选择9个图片`,
icon: 'none'
})
}
},
deleteM(e) {
this.imgObj = this.imgObj.filter(item => item !== e.tempFilePath)
},


submitbtn() {



var that = this;
let obj = uni.getStorageSync('loginInfo');
let dataValue = {
plateNo: this.form.plateNo,
businessId: this.businessId,
userId: obj.id,
imgType: '1'
};
uni.showLoading({
title: '上传中',
mask: true
})
// 将额外表单数据转换为查询字符串
const queryString = Object.keys(dataValue)
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(dataValue[key])}`)
.join('&');

// 假设 this.imgObj 是一个包含文件路径的数组
const uploadTasks = this.imgObj.map(filePath => {
return () => new Promise((resolve, reject) => {
uni.uploadFile({
url: baseUrl2 + `business/img/upload?${queryString}`,
name: 'file',
filePath: filePath,
formData: {},
success: (res) => {
let obj = JSON.parse(res.data);
if (obj.code == '0') {
that.$refs.files.clearFiles(); // 清楚数据
that.$refs.popup.close(); // 关闭弹框
} else {
uni.showToast({
title: obj.msg,
icon: 'error',
});
}
resolve(res);
},
fail: (err) => {
reject(err);
}
});
});
});
// 控制并发上传任务的数量
let currentUploads = 0;
const maxConcurrentUploads = 3; // 设置最大并发数为3
const executeUpload = async () => {
while (uploadTasks.length > 0) {
if (currentUploads < maxConcurrentUploads) {
const task = uploadTasks.shift();
currentUploads++;
try {
await task();
} catch (error) {

} finally {
currentUploads--;
}
} else {
await new Promise(resolve => setTimeout(resolve, 100)); // 等待一段时间再检查
}
}
};
executeUpload().then(() => {
this.getImageList(); // 所有文件上传成功后调用 getImageList 方法
}).catch(error => {}).finally(() => {
uni.hideLoading()
});
},
//  数据初始化
createForm() {
let obj = uni.getStorageSync('loginInfo')
this.form = {
plateNo: '',
userType: obj.userType,
userId: uni.getStorageSync('userId'),
carType: '',
caseNo: '',
contactName: obj.userName,
contactPhone: obj.phone,
orgName: obj.orgName,
loseInfo: '',
orgId: obj.orgId,
caseFrom: obj.userType,
estimatedCost: 0,
lossBy: obj.userName
}
},
addClick(val) {
var that = this
// 判断是否授权
getSettingMy('scope.userLocation').then(res => {
if (!res) {
//  授权框
getAuthorizeInfo().then(() => {
uni.chooseLocation({
success: function(res) {
that.myloac(res)
}
})
}).catch(() => {
uni.chooseLocation({
latitude: 39.908860, // 纬度
longitude: 116.397490, // 经度
success: function(res) {
that.isFlag = false
that.myloac(res)
}
})
})
} else {
// 获取数据
uni.chooseLocation({
success: function(res) {
that.myloac(res)
}
})
}
})
},
myloac(res) {
reverseGeocode(res.latitude, res.longitude).then(res2 => {
var that = this

let obj = res2.regeocode.addressComponent
if (obj.province === '上海市' || obj.province === '北京市' || obj.province === '重庆市' || obj
.province === '天津市') {
obj.city = obj.province
}
that.form.carLocation2 = obj.province + obj.district + obj.township
that.form.provinceName = obj.province
that.form.cityName = obj.city
that.form.cityAreaName = obj.district
that.form.cityArea = obj.adcode
that.form.carLocation = res2.regeocode.formatted_address
getProvinceORCityCode('province', that.form.provinceName).then(res3 => {
that.form.provinceId = res3.provinceId
getProvinceORCityCode('city', that.form.cityName).then(
res4 => {
that.form.cityId = res4.cityId

let distanceData = {
businessId: that.businessId,
carLocationLat: res.latitude,
carLocationLon: res.longitude,
cityId: that.form.cityId,
provinceId: that.form.provinceId,
userId: that.form.userId
}

that.$request2({
methods: 'post',
url: 'business/distance',
data: JSON.stringify(distanceData),
dataType: 'json',
header: {
'content-type': 'application/json'
}
}).then(res5 => {
if (res5.code != 0) {
uni.$u.toast(res5.msg)
return
}
if (Number(res5.data.distance) <
50000) {
that.form.estimatedCost = 0
that.form.estimatedCost2 = '50公里以内'
} else {
that.form.estimatedCost = 1
that.form.estimatedCost2 = '50公里以外'
}
that.form.repairShopId = res5.data
.repairShopId
that.disabledBTN = false
that.form = JSON.parse(JSON.stringify(
that.form))
})
})
})
})

},
moreBox(val) {
this.$refs.popupImg.open('bottom')
},


submit() {
var that = this
this.$refs.uForm.validate().then(res => {
if (!this.form.carLocation2) {
uni.$u.toast('请选择地址')
return
}
delete this.form.estimatedCost2
this.form.businessId = this.businessId

this.$request2({
methods: 'post',
url: 'business/start',
data: JSON.stringify(this.form),
dataType: 'json',
header: {
'content-type': 'application/json'
}
}).then(res => {

if (res.code === 0) {
that.getAddressId()
uni.showToast({
icon: 'none',
title: '案件发起成功',
duration: 1000
})
uni.switchTab({
url: `/pages/home/index`
})
} else {
uni.$u.toast(res.msg)
}
})

}).catch(errors => {
console.log(errors, 111)
uni.$u.toast('校验失败')
})
},

}

}
</script>


<style lang="scss">
//  驾驶证解析
.scanInput {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-between;

.scanInput_left {
flex: 1;
}

.scanInput_right {
padding: 10rpx;
}

.car {
align-items: flex-end;
}
}

// 验证
.required {
position: relative;
letter-spacing: 2rpx;
}

.cardImg {
color: black;
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
width: 99%;
border-bottom: 1px #ebeef5 solid;
font-size: 28rpx;
color: #3a3a3a;
padding-bottom: 10rpx;
margin: 10rpx auto;
position: relative;
margin-bottom: 20rpx;
font-weight: 500;


.addimgBtn {
background: linear-gradient(360deg, rgb(97, 201, 84) 0%, rgb(76, 158, 68) 100%);
box-shadow: 0px 4rpx 12rpx 0px #ADC3F8;
color: #FFFFFF;
width: 60rpx;
height: 60rpx;
font-size: 26rpx;
touch-action: none;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;

::v-deep .uni-icons {
font-family: uniicons;
text-decoration: none;
text-align: center;
display: flex;
justify-content: center;
}
}
}

.u-form-item__body {
padding: 10rpx 0rpx !important;
}

::v-deep .rule .u-form-item__body__left__content__label :before {
content: ' ';
width: 15rpx;
height: 15rpx;
border-radius: 50%;
// background-color: rgb(65, 168, 99);
background-color: rgb(203, 45, 1);
position: absolute;
top: 0rpx;
left: -10rpx;
}

.btnBox {
width: 70%;
margin: 0 auto;
margin-top: 140rpx;
}

.btn button {
// border: none !important;
background: transparent !important;
text-align: left !important;

}

input,
.btn {
border: none !important;
/* 移除所有边框 */
border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
/* 仅设置底部边框 */
padding: 5rpx;
}

.btn button {
padding: 0px !important;
border: none !important;
padding-right: 100%;
background: transparent !important;
color: rgb(108, 108, 108) !important;
text-align: left !important;
margin: 0px !important;
width: fit-content !important;
}

//  item 里的input 信息
::v-deep .u-input__content__field-wrapper__field,
.btn {
color: rgb(108, 108, 108) !important;
font-size: 24rpx !important;
padding-left: 10rpx;
}

//  item 里的input 信息
::v-deep .uni-card {
padding: 0 !important;
margin: 15rpx;
}

//  item 里的input 信息
::v-deep .u-form-item__body__left__content__label {
font-weight: 400 !important;
font-size: 26rpx !important;
}



/* #ifndef APP-NVUE */
::v-deep .image img {
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}
// #endif


.popup-content {
@include flex;
align-items: center;
justify-content: center;
padding: 15px;
background-color: #fff;
}

.pop_tit {
width: 100%;
text-align: center;
padding: 20rpx;
border-bottom: 1px solid;
border-bottom: 1px solid #d8d2d26b;
}

.showMoreImg {
flex-flow: row wrap;
max-height: 450px;

overflow-y: auto;

.img {
width: 180rpx;
height: 180rpx;
overflow: hidden;
margin: 10rpx;

}
}

//  添加图片
.popup_img {
margin: 20rpx;
width: 100%;
height: 100%;

}

::v-deep .u-textarea {
background-color: transparent !important;
}

::v-deep .u-button--plain.data-v-3bf2dba7 {
width: 50% !important;
margin: 30rpx auto !important;
background-color: transparent !important;
}

::v-deep .file-picker__box {
margin: 0rpx auto !important;
}

::v-deep .uni-file-picker__container {
margin: 5rpx auto !important;
}

//  每一项基础设置
.listItem {
border: 1px solid #fff;
width: 90%;
margin: 0rpx auto;
margin-bottom: 30rpx;
border-radius: 30rpx;
overflow: hidden;
box-shadow: rgba(0, 0, 0, 0.08) 1px 1px 3px 1px;
z-index: 999 !important;
}



.btn-wrap {
margin: 30rpx auto;
width: 70%;
}

.album {
@include flex;
align-items: flex-start;

::v-deep .u-album {
margin: 0 auto;
}

// ::v-deep image {
// width: 170rpx !important;
// height: 170rpx !important;
// }

}
</style>

原文地址：https://blog.csdn.net/m0_47186697/article/details/143798961

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！