qingyiay
2023-03-27 7986bc00e330411ffc73da24fdd168c6af8cf295
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
<template>
    <view class="fleet-management">
        <view><u-notice-bar mode="closable" fontSize="25" :text="text1"></u-notice-bar></view>
        <view class="groupCars" v-if="groupCarsShow">
            <u-collapse @change="change" @close="close" @open="open" :border="false" :value="['0']">
                <u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="fleetDriverData.length == 0" width="400" height="400" textSize="18"></u-empty>
                <u-collapse-item :title="fleetDriverData[0].fleetName" v-if="fleetDriverData.length != 0" name="0">
                    <view class="myCarContainer">
                        <u-swipe-action>
                            <u-cell-group>
                                <u-swipe-action-item
                                    :options="options1"
                                    v-for="(item, index) in fleetDriverData"
                                    :key="index"
                                    :index="item.id"
                                    :name="item.userId"
                                    @click="deleteGroupClick"
                                >
                                    <u-cell icon="car" iconStyle="font-size:20px;" :title="item.carNo" :value="item.name"></u-cell>
                                </u-swipe-action-item>
                            </u-cell-group>
                        </u-swipe-action>
                    </view>
                </u-collapse-item>
            </u-collapse>
        </view>
        <!-- 删除小组模态框 -->
        <view class="deleteModal">
            <u-modal
                :show="deleteGroupShow"
                :title="title"
                @close="deleteGroupClose"
                @cancel="deleteCancel"
                @confirm="deleteConfirm"
                :closeOnClickOverlay="true"
                :showCancelButton="true"
            >
                <view class="slot-content"><rich-text :nodes="content"></rich-text></view>
            </u-modal>
        </view>
        <view class="updateGroupButton"><u-button text="邀请司机加入" type="primary" @click="addDrvier"></u-button></view>
    </view>
</template>
 
<script>
export default {
    onLoad(params) {
        this.deleteDriveObj.fleetId = params.id;
    },
    data() {
        return {
            text1: '向左滑动车辆可进行删除车队操作!!!',
            groupCarsShow: true,
            fleetDriverData: [],
            myCarShow: true,
            // 单元格滑动
            options1: [
                {
                    text: '删除'
                }
            ],
            deleteDriveObj: {
                id: null, // 删除车辆小组id
                fleetId: null
            },
            // 删除小组模态框
            title: '提示',
            content: '',
            deleteGroupShow: false, // 删除小组模态框,
            value: ['0']
        };
    },
    onShow() {
        this.init();
    },
    methods: {
        init() {
            this.GetUserFleet();
        },
        // 获取司机列表
        GetUserFleet() {
            uni.showLoading({
                title: '加载中...'
            });
            this.$reqGet('GetUserFleet', { fleetId: this.deleteDriveObj.fleetId }).then(res => {
                uni.hideLoading();
                this.fleetDriverData = res.data;
            });
        },
        change() {},
        close() {},
        open() {},
        deleteGroupClick(args) {
            this.deleteDriveObj.id = args.name;
            this.fleetDriverData.forEach(item => {
                if (item.userId == this.deleteDriveObj.id) {
                    this.content = '确认删除司机:' + item.name;
                }
            });
            this.deleteGroupShow = true;
        },
        deleteConfirm() {
            this.$reqPost('deleteSiJi', this.deleteDriveObj, 'params').then(res => {
                console.log('删除司机', res);
                this.GetUserFleet();
                if (res.code == 0) {
                    uni.showToast({
                        title: '删除成功',
                        duration: 2000
                    });
                } else {
                    uni.showToast({
                        title: '删除失败',
                        duration: 2000
                    });
                }
                this.deleteGroupShow = false;
            });
        },
        deleteCancel() {
            this.deleteGroupShow = false;
        },
        deleteGroupClose() {
            this.deleteGroupShow = false;
        },
        // 邀请司机加入
        addDrvier() {
            uni.navigateTo({
                url: `/pages/customer-page/addTo-freightForwarder-driver/addTo-freightForwarder-driver?role=2&fleetId=${this.deleteDriveObj.fleetId}` // 2代表的是司机
            });
        }
    }
};
</script>
 
<style lang="scss" scoped>
::v-deep.fleet-management {
    width: 94%;
    margin: 0 auto;
    .myCarContainer {
        max-height: vww(450);
        width: 100%;
        border: 1px solid #dddddd;
        border-radius: 4px;
        overflow: hidden;
        overflow-y: auto;
        .carNum {
            padding: vww(2) 0;
            text-align: center;
            display: inline-block;
            width: 33%;
            // .u-tooltip {
            //     display: inline-block;
            //     .u-tooltip__wrapper {
            //     }
            // }
        }
    }
 
    .updateGroupButton {
        margin: vww(15) auto 0;
        .u-button {
            width: 30%;
        }
    }
    .groupCars {
        .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;
                        }
                    }
                }
            }
        }
    }
}
</style>