| | |
| | | <template> |
| | | <view class="freightForwarder-my"> |
| | | <view class="fleet-container"> |
| | | <combined-title title="我的车队" @rightText="addFleet"> |
| | | <template v-slot:rightText> |
| | | <text>添加</text> |
| | | </template> |
| | | </combined-title> |
| | | <view class="fleet-list"> |
| | | <u-swipe-action> |
| | | <u-cell-group :border="false"> |
| | | <u-swipe-action-item :options="options1" v-for="(item, index) in fleetData" :index="index" :name="item.id" :key="index" @click="deleteFleetClick"> |
| | | <u-cell :title="item.name" :value="item.userSijisum + '辆'" @click="tofleetDetails(item.id)"></u-cell> |
| | | </u-swipe-action-item> |
| | | </u-cell-group> |
| | | </u-swipe-action> |
| | | <view class="driver-banner"> |
| | | <view class="navgation">我的</view> |
| | | </view> |
| | | <view class="personal-information"> |
| | | <view class="personal-information-block"> |
| | | <view class="block-main"> |
| | | <view class="fleet-container"> |
| | | <combined-title title="我的车队" |
| | | @rightText="addFleet"> |
| | | <template v-slot:rightText> |
| | | <text>添加</text> |
| | | </template> |
| | | </combined-title> |
| | | <view class="fleet-list"> |
| | | <u-swipe-action> |
| | | <u-cell-group :border="false"> |
| | | <u-swipe-action-item :options="options1" |
| | | v-for="(item, index) in fleetData" |
| | | :index="index" |
| | | :name="item.id" |
| | | :key="index" |
| | | @click="deleteFleetClick"> |
| | | <u-cell :title="item.name" |
| | | :value="item.userSijisum + '辆'" |
| | | @click="tofleetDetails(item.id)"> |
| | | <u-icon name="arrow-right" |
| | | color="#999999" |
| | | size="30" |
| | | slot="right-icon"></u-icon> |
| | | </u-cell> |
| | | </u-swipe-action-item> |
| | | </u-cell-group> |
| | | </u-swipe-action> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <!-- 新建车队弹出框 --> |
| | | <view class="addNewGroup"> |
| | | <u-popup :show="updateGroupShow" @close="addNewFleetPopupClose" @open="addNewFleetPopupOpen" mode="center"> |
| | | <view class="title"><u--text text="新建车队" size="30" lineHeight="80" align="center"></u--text></view> |
| | | <u-popup :show="updateGroupShow" |
| | | @close="addNewFleetPopupClose" |
| | | @open="addNewFleetPopupOpen" |
| | | mode="center"> |
| | | <view class="title"><u--text text="新建车队" |
| | | size="30" |
| | | lineHeight="80" |
| | | align="center"></u--text></view> |
| | | <view class="addCarForm"> |
| | | <u--form labelPosition="left" :model="addGroupForm" ref="form1" labelAlign="center"> |
| | | <u-form-item label="组名" borderBottom ref="groupName" labelWidth="100"> |
| | | <u--input v-model="addGroupForm.name" border="none" placeholder="请输入车队名称"></u--input> |
| | | <u--form labelPosition="left" |
| | | :model="addGroupForm" |
| | | ref="form1" |
| | | labelAlign="center"> |
| | | <u-form-item label="组名" |
| | | borderBottom |
| | | ref="groupName" |
| | | labelWidth="100"> |
| | | <u--input v-model="addGroupForm.name" |
| | | border="none" |
| | | placeholder="请输入车队名称"></u--input> |
| | | </u-form-item> |
| | | <!-- <u-form-item label="车牌" borderBottom ref="cars" labelWidth="80"> |
| | | <u--textarea maxlength="2000" v-model="addGroupForm.carNums" placeholder="请输入车牌" height="150"></u--textarea> |
| | | </u-form-item> --> |
| | | </u--form> |
| | | </view> |
| | | <view class="addCarButton"><u-button text="添加" type="primary" @click="addNewGroupClick"></u-button></view> |
| | | <view class="addCarButton"><u-button text="添加" |
| | | type="primary" |
| | | @click="addNewGroupClick"></u-button></view> |
| | | </u-popup> |
| | | </view> |
| | | <view class="utils"><u-button text="退出登录" type="primary" @click="logout"></u-button></view> |
| | | |
| | | <!-- <view class="statistics"><u-button text="发运统计" type="primary" @click="statistics"></u-button></view> --> |
| | | <view class="utils-button"> |
| | | <view class="utils"><u-button text="修改密码" |
| | | type="primary" |
| | | @click="modifyPwd"></u-button></view> |
| | | <view class="utils"><u-button text="重置密码" |
| | | type="primary" |
| | | @click="initPwd"></u-button></view> |
| | | <view class="utils"><u-button text="退出登录" |
| | | type="primary" |
| | | @click="logout"></u-button></view> |
| | | </view> |
| | | |
| | | <!-- 删除车队模态框 --> |
| | | <view class="deleteFleetModal"> |
| | | <u-modal |
| | | :show="deleteFleetShow" |
| | | <u-modal :show="deleteFleetShow" |
| | | :title="deleteFleetTitle" |
| | | @close="deleteFleetClose" |
| | | @cancel="deleteFleetCancel" |
| | | @confirm="deleteFleetConfirm" |
| | | :closeOnClickOverlay="true" |
| | | :showCancelButton="true" |
| | | > |
| | | :showCancelButton="true"> |
| | | <view class="slot-content"><rich-text :nodes="deleteFleetContent"></rich-text></view> |
| | | </u-modal> |
| | | </view> |
| | | <view class="logoutModel"> |
| | | <u-modal :show="logoutShow" :title="logoutTitle" showCancelButton :content="logoutContent" @confirm="logoutConfirm" @cancel="logoutCancel"></u-modal> |
| | | <u-modal :show="logoutShow" |
| | | :title="logoutTitle" |
| | | showCancelButton |
| | | :content="logoutContent" |
| | | @confirm="logoutConfirm" |
| | | @cancel="logoutCancel"></u-modal> |
| | | </view> |
| | | <!-- 重置密码弹出框 --> |
| | | <view class="initPwdModal"> |
| | | <u-modal :show="initPwdShow" |
| | | title="重置密码" |
| | | showCancelButton |
| | | content="初始密码将变更为123456,是否确认重置" |
| | | @confirm="initPwdConfirm" |
| | | @cancel="initPwdCancel"></u-modal> |
| | | </view> |
| | | <!-- 修改密码弹出框 --> |
| | | <view class="modifyPwdModal"> |
| | | <u-modal :show="modifyPwdShow" |
| | | title="修改密码" |
| | | showCancelButton |
| | | @confirm="modifyPwdConfirm" |
| | | @cancel="modifyPwdCancel"> |
| | | <view class="modifyPwd"> |
| | | <u-input v-model="passwordModified" |
| | | placeholder="请输入修改后的密码" |
| | | border="surround" |
| | | type="password"></u-input> |
| | | </view> |
| | | </u-modal> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { redirectLogin } from '@/utils/status'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | fleetData: [], |
| | | // 新建车队 |
| | | addGroupForm: { |
| | | name: '' |
| | | // wxUserId: uni.getStorageSync('userInfo').id |
| | | }, |
| | | updateGroupShow: false, |
| | | options1: [ |
| | | { |
| | | import { redirectLogin } from '@/utils/status'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | fleetData: [], |
| | | // 新建车队 |
| | | addGroupForm: { |
| | | name: '' |
| | | // wxUserId: uni.getStorageSync('userInfo').id |
| | | }, |
| | | updateGroupShow: false, |
| | | options1: [{ |
| | | text: '删除' |
| | | } |
| | | ], |
| | | // 删除车队模态框 |
| | | deleteFleetId: null, // 删除车队id |
| | | deleteFleetShow: false, |
| | | deleteFleetTitle: '', |
| | | deleteFleetContent: '', |
| | | // 退出模态框 |
| | | logoutShow: false, |
| | | logoutTitle: '提示', |
| | | logoutContent: '是否确认退出' |
| | | }; |
| | | }, |
| | | onShow() { |
| | | this.init(); |
| | | }, |
| | | methods: { |
| | | init() { |
| | | this.getFleet(); |
| | | }], |
| | | // 删除车队模态框 |
| | | deleteFleetId: null, // 删除车队id |
| | | deleteFleetShow: false, |
| | | deleteFleetTitle: '', |
| | | deleteFleetContent: '', |
| | | // 退出模态框 |
| | | logoutShow: false, |
| | | logoutTitle: '提示', |
| | | logoutContent: '是否确认退出', |
| | | initPwdShow: false, |
| | | modifyPwdShow: false, |
| | | passwordModified: '', |
| | | // 用户信息对象 |
| | | userEntity: {}, |
| | | }; |
| | | }, |
| | | // 获取车队 |
| | | getFleet() { |
| | | // this.$reqGet('getFleet', { wxUserId: this.addGroupForm.wxUserId }).then(res => { |
| | | this.$reqGet('getFleet').then(res => { |
| | | console.log('货代1车队', res); |
| | | this.fleetData = res.data; |
| | | }); |
| | | onLoad() { |
| | | this.init(); |
| | | }, |
| | | // 添加车队 |
| | | addFleet() { |
| | | console.log('添加车队'); |
| | | this.updateGroupShow = true; |
| | | }, |
| | | addNewFleetPopupClose() { |
| | | this.updateGroupShow = false; |
| | | this.addGroupForm.name = ''; |
| | | }, |
| | | addNewFleetPopupOpen() { |
| | | console.log('添加车队打开'); |
| | | }, |
| | | // 确认新建车队按钮 |
| | | addNewGroupClick() { |
| | | this.updateGroupShow = false; |
| | | this.$reqPost('saveFleet', this.addGroupForm, 'params').then(res => { |
| | | if (res.code == 0) { |
| | | this.$u.toast('添加成功'); |
| | | this.getFleet(); |
| | | } |
| | | }); |
| | | }, |
| | | // 删除车队 |
| | | deleteFleetClick(args) { |
| | | console.log(args.name, '车队id'); |
| | | this.deleteFleetId = args.name; |
| | | this.deleteFleetShow = true; |
| | | this.fleetData.forEach(item => { |
| | | if (item.id == this.deleteFleetId) { |
| | | this.deleteFleetContent = '确认删除车队' + item.name; |
| | | } |
| | | }); |
| | | }, |
| | | deleteFleetClose() { |
| | | this.deleteFleetShow = false; |
| | | }, |
| | | deleteFleetCancel() { |
| | | this.deleteFleetShow = false; |
| | | }, |
| | | deleteFleetConfirm() { |
| | | this.deleteFleetShow = false; |
| | | uni.showLoading({ |
| | | title: '加载中...' |
| | | }); |
| | | this.$reqPost('deleteFleet', { id: this.deleteFleetId }, 'params').then(res => { |
| | | console.log('删除车队', res); |
| | | if (res.code == 0) { |
| | | this.$u.toast('删除成功'); |
| | | } |
| | | uni.hideLoading(); |
| | | methods: { |
| | | init() { |
| | | this.getFleet(); |
| | | }); |
| | | }, |
| | | // 车队详情 |
| | | tofleetDetails(id) { |
| | | uni.navigateTo({ |
| | | url: `/pages/customer-page/fleet-management/fleet-management?id=${id}` |
| | | }); |
| | | }, |
| | | logout() { |
| | | this.logoutShow = true; |
| | | }, |
| | | logoutConfirm() { |
| | | redirectLogin(); |
| | | }, |
| | | logoutCancel() { |
| | | this.logoutShow = false; |
| | | this.getUserEntity() |
| | | }, |
| | | // 获取用户信息 |
| | | getUserEntity() { |
| | | this.$reqGet('getUserEntity').then(res => { |
| | | this.userEntity = res.data; |
| | | }); |
| | | }, |
| | | // 获取车队 |
| | | getFleet() { |
| | | // this.$reqGet('getFleet', { wxUserId: this.addGroupForm.wxUserId }).then(res => { |
| | | this.$reqGet('getFleet').then(res => { |
| | | console.log('货代1车队', res); |
| | | this.fleetData = res.data; |
| | | }); |
| | | }, |
| | | // 添加车队 |
| | | addFleet() { |
| | | console.log('添加车队'); |
| | | this.updateGroupShow = true; |
| | | }, |
| | | addNewFleetPopupClose() { |
| | | this.updateGroupShow = false; |
| | | this.addGroupForm.name = ''; |
| | | }, |
| | | addNewFleetPopupOpen() { |
| | | console.log('添加车队打开'); |
| | | }, |
| | | // 确认新建车队按钮 |
| | | addNewGroupClick() { |
| | | this.updateGroupShow = false; |
| | | this.$reqPost('saveFleet', this.addGroupForm, 'params').then(res => { |
| | | if (res.code == 0) { |
| | | this.$u.toast('添加成功'); |
| | | this.getFleet(); |
| | | } |
| | | }); |
| | | }, |
| | | // 删除车队 |
| | | deleteFleetClick(args) { |
| | | console.log(args.name, '车队id'); |
| | | this.deleteFleetId = args.name; |
| | | this.deleteFleetShow = true; |
| | | this.fleetData.forEach(item => { |
| | | if (item.id == this.deleteFleetId) { |
| | | this.deleteFleetContent = '确认删除车队' + item.name; |
| | | } |
| | | }); |
| | | }, |
| | | deleteFleetClose() { |
| | | this.deleteFleetShow = false; |
| | | }, |
| | | deleteFleetCancel() { |
| | | this.deleteFleetShow = false; |
| | | }, |
| | | deleteFleetConfirm() { |
| | | this.deleteFleetShow = false; |
| | | uni.showLoading({ |
| | | title: '加载中...' |
| | | }); |
| | | this.$reqPost('deleteFleet', { id: this.deleteFleetId }, 'params').then(res => { |
| | | console.log('删除车队', res); |
| | | if (res.code == 0) { |
| | | this.$u.toast('删除成功'); |
| | | } else { |
| | | this.$u.toast(res.msg ? res.msg : '删除失败'); |
| | | } |
| | | uni.hideLoading(); |
| | | this.getFleet(); |
| | | }); |
| | | }, |
| | | // 车队详情 |
| | | tofleetDetails(id) { |
| | | uni.navigateTo({ |
| | | url: `/pages/customer-page/fleet-management/fleet-management?id=${id}` |
| | | }); |
| | | }, |
| | | updateInfo() { |
| | | this.$reqPost('updateUser', this.userEntity, 'json').then(res => { |
| | | uni.hideLoading() |
| | | if (res.code == 0) { |
| | | uni.showToast({ |
| | | title: '重置成功', |
| | | duration: 2000, |
| | | icon: 'success' |
| | | }) |
| | | } else { |
| | | this.$u.toast(res.msg ? res.msg : '修改失败'); |
| | | } |
| | | }).catch(err => { |
| | | this.$u.toast('修改失败'); |
| | | }); |
| | | }, |
| | | initPwd() { |
| | | this.initPwdShow = true |
| | | }, |
| | | initPwdConfirm() { |
| | | this.initPwdShow = false |
| | | uni.showLoading({ |
| | | title: '加载中' |
| | | }) |
| | | this.userEntity.password = '123456' |
| | | this.updateInfo() |
| | | }, |
| | | initPwdCancel() { |
| | | this.initPwdShow = false |
| | | }, |
| | | modifyPwd() { |
| | | this.modifyPwdShow = true |
| | | }, |
| | | modifyPwdConfirm() { |
| | | if (this.passwordModified.length === 0) { |
| | | return this.$u.toast('密码不能为空') |
| | | } |
| | | this.modifyPwdShow = false |
| | | this.userEntity.password = this.passwordModified |
| | | this.updateInfo() |
| | | }, |
| | | modifyPwdCancel() { |
| | | this.modifyPwdShow = false |
| | | }, |
| | | logout() { |
| | | this.logoutShow = true; |
| | | }, |
| | | logoutConfirm() { |
| | | redirectLogin(); |
| | | this.$store.commit('changeisLogin', false) |
| | | this.$store.dispatch('websocketOnClose') |
| | | }, |
| | | logoutCancel() { |
| | | this.logoutShow = false; |
| | | }, |
| | | // 跳转发运统计页面 |
| | | statistics() { |
| | | uni.navigateTo({ |
| | | url: '/pages/customer-page/customer-my/faYunstatistics/faYunstatistics' |
| | | }); |
| | | } |
| | | } |
| | | } |
| | | }; |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | ::v-deep.freightForwarder-my { |
| | | width: 94%; |
| | | margin: 0 auto; |
| | | <style lang="scss" |
| | | scoped> |
| | | .statistics { |
| | | margin-top: vww(10); |
| | | margin-bottom: vww(10); |
| | | } |
| | | |
| | | // 新建车队 |
| | | .addNewGroup { |
| | | .u-popup { |
| | | .u-popup__content { |
| | | width: 94%; |
| | | height: vww(160); |
| | | border-radius: 1%; |
| | | .title { |
| | | width: 100%; |
| | | text-align: center; |
| | | font-size: 20; |
| | | .u-text { |
| | | .u-text__value { |
| | | } |
| | | } |
| | | } |
| | | .addCarForm { |
| | | width: 80%; |
| | | margin: 0 auto vww(30); |
| | | } |
| | | .addCarButton { |
| | | width: 40%; |
| | | margin: 0 auto; |
| | | } |
| | | .utils-button { |
| | | margin-top: vww(35); |
| | | |
| | | .utils { |
| | | margin-top: vww(10); |
| | | margin-bottom: vww(10); |
| | | |
| | | /deep/ .u-button { |
| | | width: 631rpx; |
| | | height: 74rpx; |
| | | border: 2px solid #3b56eb; |
| | | background-color: #fff; |
| | | color: #3b56eb; |
| | | border-radius: 37rpx 37rpx 37rpx 37rpx; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .fleet-container { |
| | | .fleet-list { |
| | | .u-swipe-action { |
| | | .u-swipe-action-item { |
| | | .u-swipe-action-item__right { |
| | | .u-swipe-action-item__right__button { |
| | | .u-swipe-action-item__right__button__wrapper { |
| | | background-color: #f56c6c !important; |
| | | ::v-deep.freightForwarder-my { |
| | | width: 100%; |
| | | margin: vww(90) auto; |
| | | |
| | | .driver-banner { |
| | | width: 100%; |
| | | height: 430rpx; |
| | | background: linear-gradient(0deg, #ffffff 0%, #0055fe 100%); |
| | | background-size: contain; |
| | | position: fixed; |
| | | top: 0; |
| | | |
| | | .navgation { |
| | | width: 80rpx; |
| | | height: 37rpx; |
| | | font-size: 40rpx; |
| | | font-weight: normal; |
| | | color: #ffffff; |
| | | line-height: 69rpx; |
| | | margin: vww(60) auto; |
| | | } |
| | | } |
| | | |
| | | .personal-information { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-around; |
| | | flex-direction: column; |
| | | position: relative; |
| | | top: vww(20); |
| | | |
| | | &-block { |
| | | width: 690rpx; |
| | | min-height: 478rpx; |
| | | 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; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | margin-top: vww(8); |
| | | |
| | | .block-main { |
| | | width: 636rpx; |
| | | margin: vww(10) vww(14); |
| | | } |
| | | } |
| | | } |
| | | |
| | | // 新建车队 |
| | | .addNewGroup { |
| | | .u-popup { |
| | | .u-popup__content { |
| | | width: 94%; |
| | | height: vww(160); |
| | | border-radius: 1%; |
| | | |
| | | .title { |
| | | width: 100%; |
| | | text-align: center; |
| | | font-size: 20; |
| | | |
| | | .u-text { |
| | | .u-text__value {} |
| | | } |
| | | } |
| | | |
| | | .addCarForm { |
| | | width: 80%; |
| | | margin: 0 auto vww(30); |
| | | } |
| | | |
| | | .addCarButton { |
| | | width: 40%; |
| | | margin: 0 auto; |
| | | color: rgb(10, 108, 255); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .fleet-container { |
| | | .fleet-list { |
| | | .u-swipe-action { |
| | | .u-swipe-action-item { |
| | | .u-swipe-action-item__right { |
| | | .u-swipe-action-item__right__button { |
| | | .u-swipe-action-item__right__button__wrapper { |
| | | background-color: #f56c6c !important; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .modifyPwd { |
| | | width: 100%; |
| | | border: 1rpx solid rgb(220, 223, 230); |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | </style> |