<template>
|
<view class="customer-my">
|
<view class="driver-banner"><view class="navgation">我的</view></view>
|
<view class="personal-information">
|
<view class="personal-information-block">
|
<view class="block-main">
|
<view class="huodai">
|
<combined-title title="我的货代" @rightText="addHuoDai">
|
<template v-slot:rightText>
|
<text>添加</text>
|
</template>
|
</combined-title>
|
<view class="huodai-list">
|
<u-swipe-action>
|
<u-cell-group :border="false">
|
<u-swipe-action-item :options="options1" v-for="(item, index) in huoDaiData" :key="item.userId" :name="item.userId" @click="deleteHuoDaiClick">
|
<u-cell :title="item.name" value="详情" @click="toFreightForwarderDetails(item.userId)">
|
<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 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" :key="item.id" :name="item.id" @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="utils-button">
|
<view class="statistics"><u-button text="用户管理" type="primary" @click="userManage" v-if="roleType == 1 && userEntity.isHostUser === '0'"></u-button></view>
|
<view class="logout"><u-button text="退出登录" type="primary" @click="logout()"></u-button></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>
|
<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-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>
|
</u-popup>
|
</view>
|
|
<!-- 删除货代模态框 -->
|
<view class="deleteHuoDaiModal">
|
<u-modal
|
:show="deleteHuoDaiShow"
|
:title="deleteHuoDaiTitle"
|
@close="deleteHuoDaiClose"
|
@cancel="deleteHuoDaiCancel"
|
@confirm="deleteHuoDaiConfirm"
|
:closeOnClickOverlay="true"
|
:showCancelButton="true"
|
>
|
<view class="slot-content"><rich-text :nodes="deleteHuoDaiContent"></rich-text></view>
|
</u-modal>
|
</view>
|
<!-- 删除车队模态框 -->
|
<view class="deleteFleetModal">
|
<u-modal
|
:show="deleteFleetShow"
|
:title="deleteFleetTitle"
|
@close="deleteFleetClose"
|
@cancel="deleteFleetCancel"
|
@confirm="deleteFleetConfirm"
|
:closeOnClickOverlay="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>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import combinedTitle from '@/components/combined-title/combined-title.vue';
|
import { customerId, redirectLogin } from '@/utils/status';
|
export default {
|
components: {
|
combinedTitle
|
},
|
data() {
|
return {
|
huoDaiData: [],
|
fleetData: [],
|
// 新建车队
|
addGroupForm: {
|
customerId,
|
name: ''
|
},
|
updateGroupShow: false,
|
options1: [
|
{
|
text: '删除'
|
}
|
],
|
// 删除货代模态框
|
deleteHuoDaiId: null, // 删除货代id
|
deleteHuoDaiShow: false,
|
deleteHuoDaiTitle: '',
|
deleteHuoDaiContent: '',
|
// 删除车队模态框
|
deleteFleetId: null, // 删除车队id
|
deleteFleetShow: false,
|
deleteFleetTitle: '',
|
deleteFleetContent: '',
|
// 退出模态框
|
logoutShow: false,
|
logoutTitle: '提示',
|
logoutContent: '是否确认退出',
|
// 用户信息对象
|
userEntity: {}
|
};
|
},
|
computed: {
|
roleType() {
|
return uni.getStorageSync('roleType');
|
}
|
},
|
onShow() {
|
this.init();
|
},
|
methods: {
|
init() {
|
this.getAllHuoDaiByCustomerId();
|
this.getFleet();
|
this.getUserEntity();
|
},
|
// 获取用户信息
|
getUserEntity() {
|
this.$reqGet('getUserEntity').then(res => {
|
this.userEntity = res.data;
|
});
|
},
|
// 获取货代列表
|
getAllHuoDaiByCustomerId() {
|
uni.showLoading({
|
title: '加载中...'
|
});
|
this.$reqGet('getAllHuoDaiByCustomerId').then(res => {
|
uni.hideLoading();
|
this.huoDaiData = res.data;
|
});
|
},
|
// 获取车队列表
|
getFleet() {
|
uni.showLoading({
|
title: '加载中...'
|
});
|
this.$reqGet('getFleet').then(res => {
|
uni.hideLoading();
|
this.fleetData = res.data;
|
});
|
},
|
// 添加货代
|
addHuoDai() {
|
uni.navigateTo({
|
url: '/pages/customer-page/addTo-freightForwarder-driver/addTo-freightForwarder-driver?role=1' // 1代表的是货代
|
});
|
},
|
// 添加车队
|
addFleet() {
|
this.updateGroupShow = true;
|
},
|
addNewFleetPopupClose() {
|
this.updateGroupShow = false;
|
},
|
addNewFleetPopupOpen() {
|
console.log('添加车队打开');
|
},
|
// 确认新建车队按钮
|
addNewGroupClick() {
|
uni.showLoading({
|
title: '加载中...'
|
});
|
// 新建车队
|
this.$reqPost('saveFleet', this.addGroupForm, 'params')
|
.then(res => {
|
uni.hideLoading();
|
console.log(res, '新建车队');
|
if (res.code == 0) {
|
this.$u.toast('添加成功');
|
} else {
|
this.$u.toast(res.msg ? res.msg : '添加失败');
|
}
|
})
|
.then(r => {
|
this.getFleet();
|
});
|
this.updateGroupShow = false;
|
},
|
// 删除货代
|
deleteHuoDaiClick(args) {
|
console.log(args, '货代id');
|
this.deleteHuoDaiId = args.name;
|
this.deleteHuoDaiShow = true;
|
this.huoDaiData.forEach(item => {
|
if (item.userId == this.deleteHuoDaiId) {
|
this.deleteHuoDaiContent = '确认删除货代' + item.name + '吗？';
|
}
|
});
|
},
|
deleteHuoDaiClose() {
|
this.deleteHuoDaiShow = false;
|
},
|
deleteHuoDaiCancel() {
|
this.deleteHuoDaiShow = false;
|
},
|
deleteHuoDaiConfirm() {
|
this.deleteHuoDaiShow = false;
|
uni.showLoading({
|
title: '加载中...'
|
});
|
this.$reqPost('deleteHuoDai', { id: this.deleteHuoDaiId }, 'params')
|
.then(res => {
|
uni.hideLoading();
|
if (res.code == 0) {
|
this.$u.toast('删除成功');
|
} else {
|
this.$u.toast(res.msg ? res.msg : '删除失败');
|
}
|
})
|
.then(r => {
|
this.getAllHuoDaiByCustomerId();
|
});
|
},
|
// 删除车队
|
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();
|
})
|
.then(() => {
|
this.getFleet();
|
});
|
},
|
// 货代详情
|
toFreightForwarderDetails(userId) {
|
uni.navigateTo({
|
url: `/pages/customer-page/freight-forwarder-details/freight-forwarder-details?userId=${userId}`
|
});
|
},
|
// 车队详情
|
tofleetDetails(id) {
|
uni.navigateTo({
|
url: `/pages/customer-page/fleet-management/fleet-management?id=${id}`
|
});
|
},
|
logout() {
|
this.logoutShow = true;
|
},
|
logoutConfirm() {
|
redirectLogin();
|
},
|
logoutCancel() {
|
this.logoutShow = false;
|
},
|
// 跳转用户管理页面
|
userManage() {
|
uni.navigateTo({
|
url: '/pages/customer-page/customer-my/userMange/userMange'
|
});
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
@mixin flex {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
.utils-button {
|
margin-top: vww(35);
|
.statistics,
|
.logout {
|
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;
|
}
|
}
|
}
|
|
::v-deep.customer-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);
|
}
|
}
|
}
|
|
.huodai {
|
.huodai-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;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.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;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
// 新建车队
|
.addNewGroup {
|
.u-popup {
|
.u-popup__content {
|
width: 94%;
|
height: vww(160);
|
border-radius: 1%;
|
|
.title {
|
width: 100%;
|
text-align: center;
|
font-size: 20px;
|
|
.u-text {
|
.u-text__value {
|
}
|
}
|
}
|
|
.addCarForm {
|
width: 80%;
|
margin: 0 auto vww(30);
|
}
|
|
.addCarButton {
|
width: 40%;
|
margin: 0 auto;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
