| | |
| | | <template> |
| | | <view class="driver-my"> |
| | | <view class="driver-banner"> |
| | | <view class="navgation">我的</view> |
| | | <view class="avatar"> |
| | | <view class="avatar-imgage" |
| | | :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/driverava.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> |
| | | <view class="" |
| | | style="height: 446rpx;width: 100%;"> |
| | | <view class="driver-banner"> |
| | | <view class="navgation">我的</view> |
| | | <view class="avatar"> |
| | | <view class="avatar-imgage" |
| | | :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/driverava.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> |
| | | </view> |
| | | <view class="avatar-name">{{ userInfo.name || '' }}</view> |
| | | <view class="edit-button"><u-button type="primary" |
| | | @click="editBtnClick" |
| | | shape="circle" |
| | | plain>编辑个人资料</u-button></view> |
| | | </view> |
| | | <view class="avatar-name">{{ userInfo.name || '' }}</view> |
| | | <view class="edit-button"><u-button type="primary" |
| | | @click="editBtnClick" |
| | | shape="circle" |
| | | plain>编辑个人资料</u-button></view> |
| | | </view> |
| | | </view> |
| | | <view class="information-block"> |
| | | <view class="personal-information"> |
| | | <view class="personal-information-block"> |
| | | <view class="block-main"> |
| | |
| | | <!-- <u-icon name="arrow-right" color="#999999" size="30" v-if="userInfo.axleNum"></u-icon> --> |
| | | </view> |
| | | </view> |
| | | <view class="information-line"> |
| | | <view class="line-label"> |
| | | <image :src="`${onlineurl}/appimg/image/banner/axisnum.png`" |
| | | mode="widthFix"></image> |
| | | <view class="label-text">车牌颜色</view> |
| | | </view> |
| | | <view class="information-value"> |
| | | {{ userInfo.vehicleColour || '' }} |
| | | <!-- <u-icon name="arrow-right" color="#999999" size="30" v-if="userInfo.axleNum"></u-icon> --> |
| | | </view> |
| | | </view> |
| | | <view class="information-line last"> |
| | | <view class="line-label"> |
| | | <image :src="`${onlineurl}/appimg/image/banner/weighnum.png`" |
| | |
| | | </view> |
| | | <view class="information-value"> |
| | | {{ userInfo.weight || '' }} |
| | | <!-- <u-icon name="arrow-right" color="#999999" size="30" v-if="userInfo.weight"></u-icon> --> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | width="80px" |
| | | height="80px" |
| | | @click="imageClick(1)"> |
| | | <view slot="error" |
| | | style="font-size: 24rpx;">加载失败</view> |
| | | </u--image> |
| | | </view> |
| | | </view> |
| | | <view class="car-img"> |
| | | <view class="label-title"> |
| | | <image :src="`${onlineurl}/appimg/image/banner/cardimg.png`" |
| | | mode="widthFix"></image> |
| | | <view class="label-text">车头车尾车身照片</view> |
| | | </view> |
| | | <view class="img-container" |
| | | v-for="item in userInfo.bodyCarImg"> |
| | | <u--image :showLoading="true" |
| | | :src="BaseUrl+item" |
| | | width="80px" |
| | | height="80px" |
| | | @click="imageClickCarBody(item)"> |
| | | <view slot="error" |
| | | style="font-size: 24rpx;">加载失败</view> |
| | | </u--image> |
| | |
| | | inputAlign="left"></u--input> |
| | | </u-form-item> |
| | | <u-form-item labelWidth="20%" |
| | | label="修改密码" |
| | | prop="password"> |
| | | <u--input v-model="editUserInfo.password" |
| | | border="none" |
| | | inputAlign="left"></u--input> |
| | | </u-form-item> |
| | | <u-form-item labelWidth="20%" |
| | | label="车牌号" |
| | | prop="carNo" |
| | | required> |
| | | <u--input v-model="editUserInfo.carNo" |
| | | border="none" |
| | | inputAlign="left"></u--input> |
| | | </u-form-item> |
| | | <u-form-item labelWidth="20%" |
| | | label="车牌颜色" |
| | | required |
| | | prop="vehicleColour"> |
| | | <u-radio-group v-model="editUserInfo.vehicleColour" |
| | | placement="row" |
| | | size="30" |
| | | shape="circle" |
| | | iconSize="20"> |
| | | <u-radio labelSize="14px" |
| | | size="20px" |
| | | :customStyle="{ marginBottom: '8px' }" |
| | | v-for="(item, index) in radiolist2" |
| | | :key="index" |
| | | :label="item.name" |
| | | :name="item.value"></u-radio> |
| | | </u-radio-group> |
| | | </u-form-item> |
| | | <u-form-item labelWidth="20%" |
| | | label="体重" |
| | |
| | | width="250" |
| | | height="150" |
| | | :previewFullImage="true"></u-upload> |
| | | </u-form-item> |
| | | <u-form-item prop="bodyofcarJpg" |
| | | label="车头车尾车身照片" |
| | | labelWidth="20%" |
| | | required |
| | | @click="beforeRead"> |
| | | <u-upload :fileList="fileList3" |
| | | deletable |
| | | @afterRead="afterRead" |
| | | @delete="deletePic" |
| | | name="3" |
| | | multiple |
| | | :maxCount="3" |
| | | width="250" |
| | | height="150" |
| | | :previewFullImage="true"> |
| | | </u-upload> |
| | | </u-form-item> |
| | | <u-form-item labelWidth="25%" |
| | | label="行驶证照片" |
| | |
| | | drivingImg: '', |
| | | axleNum: '', |
| | | weight: '', |
| | | userId: '' |
| | | userId: '', |
| | | vehicleColour: '', |
| | | bodyofcarJpg: '', |
| | | password: '' |
| | | }, |
| | | rules: { |
| | | name: { |
| | |
| | | message: '请填写体重', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | password: { |
| | | required: false, |
| | | }, |
| | | carNo: [{ |
| | | type: 'string', |
| | | required: true, |
| | |
| | | trigger: ['change', 'blur'] |
| | | } |
| | | ], |
| | | vehicleColour: { |
| | | type: 'string', |
| | | required: true, |
| | | message: '请选择车牌颜色', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | axleNum: [{ |
| | | transform(value) { |
| | | return Number(value); |
| | |
| | | message: '请上传车辆图片', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | bodyofcarJpg: { |
| | | type: 'string', |
| | | required: true, |
| | | message: '请上传车辆图片', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | drivingImg: { |
| | | type: 'string', |
| | | required: true, |
| | |
| | | src: '', |
| | | fileList1: [], |
| | | fileList2: [], |
| | | // 车头车身车尾照片 |
| | | fileList3: [], |
| | | carBody: [], |
| | | // 修改信息弹出框 |
| | | editDriverPopupShow: false, |
| | | // previewImage |
| | |
| | | logoutTitle: '提示', |
| | | logoutContent: '是否确认退出', |
| | | BaseUrl, |
| | | onlineurl |
| | | onlineurl, |
| | | radiolist2: [{ |
| | | name: '黄色', |
| | | value: '黄色' |
| | | }, |
| | | { |
| | | name: '黄绿色', |
| | | value: '黄绿色' |
| | | }, |
| | | { |
| | | name: '蓝色', |
| | | value: '蓝色' |
| | | } |
| | | ], |
| | | }; |
| | | }, |
| | | onShow() { |
| | |
| | | }); |
| | | this.$reqGet('getUserEntity').then(res => { |
| | | uni.hideLoading(); |
| | | this.userInfo = res.data; |
| | | this.editUserInfo = this.userInfo = res.data; |
| | | this.userInfo.bodyCarImg = this.userInfo.bodyofcarJpg ? this.userInfo.bodyofcarJpg.split(',') : |
| | | []; |
| | | console.log(this.userInfo.bodyCarImg); |
| | | this.editUserInfo.password = "" |
| | | uni.setStorageSync('carImg', this.userInfo.carImg); |
| | | uni.setStorageSync('drivingImg', this.userInfo.drivingImg); |
| | | uni.setStorageSync('bodyofcarJpg', this.userInfo.bodyofcarJpg) |
| | | if (this.fileList1.length == 0) { |
| | | |
| | | this.fileList1.push({ |
| | | url: `${BaseUrl}${this.userInfo.carImg}` |
| | | }); |
| | | }) |
| | | } |
| | | if (this.fileList2.length == 0) { |
| | | if (!this.userInfo.drivingImg) return |
| | | this.fileList2.push({ |
| | | url: `${BaseUrl}${this.userInfo.drivingImg}` |
| | | }); |
| | | } |
| | | Object.keys(this.editUserInfo).map(item => { |
| | | if (res.data[item]) { |
| | | this.editUserInfo[item] = res.data[item]; |
| | | if (this.fileList3.length == 0) { |
| | | if (!this.userInfo.bodyofcarJpg) return |
| | | if (this.userInfo.bodyofcarJpg.indexOf(',') !== -1) { |
| | | let bodyofcarJpg = this.userInfo.bodyofcarJpg.split(',') |
| | | bodyofcarJpg.forEach(v => { |
| | | this.fileList3.push({ |
| | | url: `${BaseUrl}${v}` |
| | | }); |
| | | }) |
| | | } else { |
| | | this.fileList3.push({ |
| | | url: `${BaseUrl}${this.userInfo.bodyofcarJpg}` |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }, |
| | | // 修改按钮点击 |
| | |
| | | this.editDriverPopupShow = true; |
| | | }, |
| | | imageClick(index) { |
| | | // 通过index切换图片 |
| | | console.log('切换图片', index); |
| | | if (index == 1) { |
| | | this.previewImageSrc = this.userInfo.carImg; |
| | | } else { |
| | | this.previewImageSrc = this.userInfo.drivingImg; |
| | | } |
| | | this.$nextTick(() => { |
| | | this.previewImageShow = true; |
| | | }); |
| | | }, |
| | | imageClickCarBody(url) { |
| | | this.previewImageSrc = url; |
| | | this.$nextTick(() => { |
| | | this.previewImageShow = true; |
| | | }); |
| | |
| | | url: BaseUrl + '/admin/sys-file/uploadUnToken', |
| | | filePath: url, |
| | | name: 'file', |
| | | // formData: { |
| | | // user: 'test' |
| | | // }, |
| | | success: res => { |
| | | if (num == 1) { |
| | | this.editUserInfo.carImg = JSON.parse(res.data).data.url; |
| | |
| | | } else if (num == 2) { |
| | | this.editUserInfo.drivingImg = JSON.parse(res.data).data.url; |
| | | uni.setStorageSync('drivingImg', JSON.parse(res.data).data.url); |
| | | resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); |
| | | } else if (num == 3) { |
| | | let imageUrl = JSON.parse(res.data).data.url |
| | | this.carBody.push(imageUrl) |
| | | uni.setStorageSync('bodyofcarJpg', this.carBody.join(',')); |
| | | this.editUserInfo.bodyofcarJpg = this.carBody.join(',') |
| | | resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); |
| | | } |
| | | } |
| | |
| | | this.editUserInfo = { |
| | | ...this.editUserInfo, |
| | | carImg: uni.getStorageSync('carImg'), |
| | | drivingImg: uni.getStorageSync('drivingImg') |
| | | drivingImg: uni.getStorageSync('drivingImg'), |
| | | bodyofcarJpg: uni.getStorageSync('bodyofcarJpg') |
| | | }; |
| | | this.$refs.editRef |
| | | .validate() |
| | |
| | | align-items: center; |
| | | } |
| | | |
| | | .statistics { |
| | | margin-top: vww(10); |
| | | margin-bottom: vww(10); |
| | | } |
| | | |
| | | ::v-deep.driver-my { |
| | | width: 100%; |
| | | margin: 0 auto; |
| | | padding-bottom: vww(60); |
| | | padding-bottom: vww(100); |
| | | |
| | | .driver-banner { |
| | | width: 100%; |
| | |
| | | top: vww(4); |
| | | } |
| | | } |
| | | } |
| | | |
| | | .information-block { |
| | | width: 100%; |
| | | |
| | | .personal-information { |
| | | width: 100%; |
| | | display: flex; |
| | | justify-content: center; |
| | | position: relative; |
| | | top: vww(20); |
| | | top: vww(-20); |
| | | |
| | | &-block { |
| | | width: 690rpx; |
| | | height: 478rpx; |
| | | height: 550rpx; |
| | | background: #ffffff; |
| | | box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); |
| | | border-radius: 20rpx; |
| | |
| | | .car-information { |
| | | width: 100%; |
| | | position: relative; |
| | | top: vww(410); |
| | | @include flex justify-content: center; |
| | | |
| | | .information-main { |
| | | width: 690rpx; |
| | | height: 552rpx; |
| | | height: 828rpx; |
| | | background: #ffffff; |
| | | box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); |
| | | border-radius: 20rpx; |
| | |
| | | |
| | | .label-title { |
| | | @include flex; |
| | | width: 220rpx; |
| | | width: 300rpx; |
| | | height: 100rpx; |
| | | |
| | | .label-text { |
| | |
| | | @include flex; |
| | | justify-content: center; |
| | | position: relative; |
| | | bottom: vww(-430); |
| | | top: vww(20); |
| | | |
| | | .loginout-main { |
| | | width: 84%; |
| | |
| | | .editDriverPopup-container { |
| | | .u-popup { |
| | | .u-transition { |
| | | height: 75%; |
| | | height: 80%; |
| | | |
| | | .u-popup__content { |
| | | overflow: scroll !important; |