feat: 地址管理

guzijian
1 parent 52aa052b
Showing 22 changed files with 751 additions and 113 deletions
garbage-removal/src/App.vue
garbage-removal/src/apis/user.js
garbage-removal/src/components/address-popup/address-popup.vue
garbage-removal/src/components/liu-delivery-time/liu-delivery-time.vue
garbage-removal/src/components/my-piker/index.vue
garbage-removal/src/pages.json
garbage-removal/src/pages/home/address/addSite.vue
garbage-removal/src/pages/home/address/index.vue
garbage-removal/src/pages/home/clean/index.vue
garbage-removal/src/pages/home/index.vue
garbage-removal/src/pages/home/user-guide/index.vue
garbage-removal/src/pages/order/other-home/detail/index.vue
garbage-removal/src/pages/wode/choose/index.vue
garbage-removal/src/pages/wode/index.vue
garbage-removal/src/static/image/address-manager.png
garbage-removal/src/static/image/change-address.png
garbage-removal/src/static/image/freecompress-swiper-1.png
garbage-removal/src/static/image/freecompress-swiper-2.jpg
garbage-removal/src/static/image/quit-login.png
garbage-removal/src/static/image/role-change.png
@@ -19,6 +19,10 @@ onLaunch(async () =&gt; {
 @import "./uview-plus/index.scss";
 @import "./static/icon/iconfont/iconfont.css";
+uni-modal {
+  z-index: 999999 !important;
+}
+
 page {
   box-sizing: border-box;
   min-height: 100%;
@@ -49,3 +49,10 @@ export async function updateUserInfo(params,config) {
     `${prefix}/update`,params,config
   );
 }
+
+
+export async function queryRole() {
+  return await request.get(
+    `${prefix}/queryRole`
+  );
+}
+<template>
+  <view>
+    <!-- 弹框 -->
+    <u-popup :show="visible" :round="10" mode="bottom" :closeable="true" @close="close">
+      <view class="popup-container">
+        <h4 style="text-align: center; margin: 23rpx 0; letter-spacing: 5rpx;color:#19a97c">{{ title }}</h4>
+        <view class="address-header">
+          <view class="address-header-left">地址列表</view>
+          <view class="address-header-right-box">
+            <view class="address-header-right-box-manager">
+              <view class="address-header-right-box-manager-button" @click="changeManager">
+                <up-icon name="edit-pen-fill" color="#ffffff" size="28"></up-icon>
+                <text style="margin-left: 15rpx;">管理</text>
+              </view>
+            </view>
+            <view class="address-header-right-box-add">
+              <view class="address-header-right-box-add-button" @click="handlerAddAddress">
+                <up-icon name="plus" color="#ffffff" size="28"></up-icon>
+                <text style="margin-left: 15rpx;">新增</text>
+              </view>
+            </view>
+          </view>
+        </view>
+        <view class="scroll-Y">
+          <view class="address-container" v-for="item in addressList" :key="item.garAddressId">
+            <view class="address-container-top" @click="handlerAddressChange(item)">
+              <view class="address-center-box">
+                <view class="address-center-box-header">
+                  <view class="address-center-box-header-name">{{ item.garUserContactName }}</view>
+                  <view class="address-center-box-header-phone">{{ item.garUserContactTel }}</view>
+                </view>
+                <view class="address-center-box-address">
+                  {{ item.garUserAddress }}
+                  <text class="address-center-box-address-remark">{{ item.garRemark }}</text>
+                </view>
+              </view>
+              <view class="address-right-box">
+                <view class="address-right-choose">
+                  <up-icon v-if="item.currentAddress" name="checkmark-circle-fill" size="40" color="#19a97c"></up-icon>
+                  <view v-else style="width: 35rpx;height: 35rpx;border-radius: 50%; border: 2rpx solid #c4c6c9;">
+                  </view>
+                </view>
+              </view>
+            </view>
+            <view class="address-container-bottom" v-if="isManager">
+              <view class="address-container-bottom-left">
+                <view class="address-container-bottom-left-default" @click="handlerChooseDefaultAddress(item)"
+                  hover-class="handler-click">
+                  <u-icon name="checkmark-circle-fill" v-if="item.garUserDefault === 1" size="30"
+                    color="#19a97c"></u-icon>
+                  <view v-else style="width: 25rpx;height: 25rpx;border-radius: 50%; border: 2rpx solid #c4c6c9;">
+                  </view>
+                  <view class="address-container-bottom-left-default-text">默认地址</view>
+                </view>
+              </view>
+              <view class="address-container-bottom-right">
+                <view class="address-container-bottom-right-del" hover-class="handler-click"
+                  v-if="addressList.length > 1" @click="handlerDeleteAddress(item)">
+                  删除
+                </view>
+                <view class="address-container-bottom-right-copy" hover-class="handler-click"
+                  @click="handlerCopyAddress(item)">
+                  复制
+                </view>
+                <view class="address-container-bottom-right-update" hover-class="handler-click"
+                  @click="handlerUpdateAddress(item)">
+                  修改
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+
+<script setup>
+import { deleteAddress, queryAddress, updateAddress } from '@/apis/address.js';
+import { onHide, onShow } from '@dcloudio/uni-app';
+import { ref, watch } from 'vue';
+
+const emit = defineEmits(['currentChange'])
+const props = defineProps({
+  title: {
+    type: String,
+    default: '地址管理'
+  },
+})
+const isShow = ref(false);
+const isManager = ref(false)
+const addressList = ref([])
+const visible = ref(false);
+const currentId = ref()
+const close = async () => {
+  visible.value = false;
+  let currentAddress = addressList.value.filter(item => item.currentAddress === true);
+  emit('currentChange', currentAddress[0]);
+}
+const changeManager = () => {
+  isManager.value = !isManager.value
+}
+const currentAddressChange = () => {
+  addressList.value.forEach(item => {
+    if (item.garAddressId === currentId.value) {
+      item.currentAddress = true;
+    } else {
+      item.currentAddress = false;
+    }
+  })
+}
+const open = async (val) => {
+  visible.value = true;
+  currentId.value = val.garAddressId;
+  await getAddressList();
+}
+const getAddressList = async () => {
+  await queryAddress("ALL").then(res => {
+    addressList.value = res.data.data;
+    currentAddressChange();
+  })
+}
+const handlerAddressChange = (val) => {
+  currentId.value = val.garAddressId;
+  currentAddressChange();
+}
+const handlerAddAddress = () => {
+  uni.$u.route('pages/home/address/addSite')
+}
+const handlerUpdateAddress = (val) => {
+  uni.$u.route(`pages/home/address/addSite?addressObj=${JSON.stringify(val)}`)
+}
+const handlerDeleteAddress = async (val) => {
+  if (addressList.value.length > 1) {
+    uni.showModal({
+      title: '',
+      content: '是否确认删除这个地址',
+      success: function (res) {
+        if (res.confirm) {
+          deleteAddress(val.garAddressId).then(res => {
+            if (res.data.success) {
+              for (let index = 0; index < addressList.value.length; index++) {
+                const element = addressList.value[index];
+                if (currentId.value != element.garAddressId) {
+                  currentId.value = element.garAddressId;
+                  break;
+                }
+              }
+              addressList.value.splice(addressList.value.findIndex(item => item.garAddressId == val.garAddressId), 1);
+              // 删除的是默认地址 默认地址第一顺位
+              if (val.garUserDefault == 1) {
+                handlerChooseDefaultAddress(addressList.value[0])
+              }
+              currentAddressChange();
+            }
+          })
+        }
+      }
+    });
+  } else {
+    uni.$u.toast('至少保留一个地址')
+  }
+
+}
+const handlerChooseDefaultAddress = async (val) => {
+  if (val.garUserDefault == 1) {
+    return
+  }
+  await updateAddress({
+    addressArea: val.garUserAddress,
+    contactPerson: val.garUserContactName,
+    contactIphoneNumber: val.garUserContactTel,
+    defaultFlag: true,
+    addressDetail: val.garRemark,
+    garAddressId: val.garAddressId,
+    garLongitude: val.garLongitude,
+    garLatitude: val.garLatitude,
+    garCoordinate: val.garCoordinate
+  }).then(res => {
+    addressList.value.map(item => {
+      if (item.garAddressId == val.garAddressId) {
+        item.garUserDefault = 1;
+      } else {
+        item.garUserDefault = 0;
+      }
+    });
+  })
+}
+const handlerCopyAddress = (val) => {
+  const varStr = "姓名：" + val.garUserContactName + ", 电话：" + val.garUserContactTel + ", 地址：" + val.garUserAddress + ", 详细地址：" + val.garRemark;
+  uni.setClipboardData({
+    data: varStr,
+    success: function () {
+      console.log('复制成功');
+      // 可以添加用户友好的提示，例如使用uni.showToast提示复制成功
+      uni.showToast({
+        title: '复制成功',
+        icon: 'success',
+        duration: 2000
+      });
+    },
+    fail: function () {
+      console.log('复制失败');
+      // 可以添加错误处理或用户友好的提示
+    }
+  });
+}
+
+
+onHide(() => {
+  isShow.value = false;
+  console.log("离开了");
+})
+
+onShow(() => {
+  isShow.value = true;
+})
+
+watch(isShow, (newVal, oldVal) => {
+  if (newVal) {
+    getAddressList();
+  }
+})
+defineExpose({
+  open
+})
+
+
+</script>
+
+<style lang="scss" scoped>
+.popup-container {
+  height: 80vh;
+  background: rgb(234 240 243);
+  border-radius: 15rpx 15rpx 0 0;
+  box-sizing: border-box;
+  padding-bottom: 50rpx;
+
+  .address-header {
+    display: flex;
+    height: 60rpx;
+    font-size: 28rpx;
+    color: $u-main-color;
+    align-items: center;
+    box-sizing: border-box;
+
+    .address-header-left {
+      width: 100%;
+      padding-left: 15rpx;
+      color: #19a97c;
+    }
+
+    .address-header-right-box {
+      width: 340rpx;
+      display: flex;
+      color: #19a97c;
+
+      .address-header-right-box-manager {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        padding-right: 20rpx;
+        // 不换行
+        white-space: nowrap;
+
+        .address-header-right-box-manager-button {
+          padding: 10rpx 20rpx;
+          background-color: #19a97c;
+          color: white;
+          display: flex;
+          font-size: 25rpx;
+          border-radius: 5rpx;
+          @include handleClick;
+
+          text {
+            white-space: nowrap;
+          }
+        }
+      }
+
+      .address-header-right-box-add {
+        display: flex;
+        align-items: center;
+        padding-right: 20rpx;
+        // 不换行
+        white-space: nowrap;
+        box-sizing: border-box;
+
+        .address-header-right-box-add-button {
+          padding: 10rpx 20rpx;
+          background-color: #19a97c;
+          color: white;
+          display: flex;
+          font-size: 25rpx;
+          border-radius: 5rpx;
+          @include handleClick;
+
+          text {
+            white-space: nowrap;
+          }
+        }
+      }
+    }
+  }
+
+  .scroll-Y {
+    height: calc(100% - 60rpx - 56rpx);
+    width: 100%;
+    overflow-y: auto;
+    box-sizing: border-box;
+    padding-left: 20rpx;
+    padding-right: 20rpx;
+
+    .address-container {
+      box-sizing: border-box;
+      min-height: 100rpx;
+      width: 100%;
+      display: flex;
+      align-items: center;
+      flex-direction: column;
+      padding: 20rpx 25rpx;
+      background: white;
+      margin: 20rpx 0;
+      border-radius: 15rpx;
+
+      .address-container-top {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        box-sizing: border-box;
+
+        .address-center-box {
+          width: 100%;
+          color: $u-main-color;
+
+          .address-center-box-header {
+            display: flex;
+            margin-bottom: 10rpx;
+            align-items: center;
+
+            .address-center-box-header-name {
+              font-size: 29rpx;
+              font-weight: bold;
+              margin-right: 10rpx;
+              // 不换行
+              white-space: nowrap;
+            }
+
+            .address-center-box-header-phone {
+              font-size: 26rpx;
+              color: #999; // 不换行
+              white-space: nowrap;
+            }
+          }
+
+          .address-center-box-address {
+            font-size: 26rpx;
+
+            .address-center-box-address-remark {
+              margin-left: 20rpx;
+            }
+          }
+        }
+
+        .address-right-box {
+          width: 100rpx;
+          height: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+
+          .address-right-choose {
+
+            up-icon {}
+          }
+
+          .address-right-box-edit {
+            u-icon {}
+          }
+        }
+      }
+
+      .address-container-bottom {
+        box-sizing: border-box;
+        margin-top: 20rpx;
+        border-top: 2rpx solid #c4c6c9;
+        line-height: 60rpx;
+        width: 100%;
+        display: flex;
+        justify-content: flex-end;
+
+        .address-container-bottom-left {
+          font-size: 26rpx;
+          color: #999;
+          display: flex;
+          align-items: center;
+          justify-content: flex-start;
+          flex: 1;
+
+          .address-container-bottom-left-default {
+            display: flex;
+            align-items: center;
+
+            u-icon {}
+
+            .address-container-bottom-left-default-text {
+              display: flex;
+              align-items: center;
+              margin-left: 10rpx
+            }
+          }
+
+          .address-container-bottom-left-edit {
+            u-icon {}
+          }
+        }
+
+        .address-container-bottom-right {
+          flex: 1;
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          color: #999;
+
+          .address-container-bottom-right-del {
+            margin-right: 40rpx;
+            @include handleClick;
+          }
+
+          .address-container-bottom-right-copy {
+            margin-right: 40rpx;
+            @include handleClick;
+          }
+
+          .address-container-bottom-right-update {
+            margin-right: 20rpx;
+            @include handleClick;
+          }
+        }
+
+      }
+    }
+  }
+
+}
+
+.handler-click {
+  @include handleClick;
+}
+</style>
@@ -5,7 +5,7 @@
 			<view class="time-title" :style="{ borderRadius: getRadius }">
 				<span @click.stop="close">取消</span>
 				{{ title }}
-				<text @click.stop="confirm" :style="selectedTimeIndex ? 'color:#007aff;' : ''">确定</text>
+				<text @click.stop="confirm" :style="selectedTimeIndex ? 'color:#19a97c;' : ''">确定</text>
 			</view>
 			<view class="time-picker" :style="{ height: height }">
 				<scroll-view class="date-scroll" scroll-y>
@@ -43,10 +43,8 @@ const closeUnit = () =&gt; {
 }
 const openUnit = () => {
   visible.value = true
-  console.log('open');
 }
 const bindPickerChange = (e) => {
-  console.log('picker发送选择改变，携带值为', e.detail.value)
   index.value = e.detail.value
   emit('change', props.array[index.value])
 }
@@ -28,8 +28,7 @@
 		{
 			"path": "pages/wode/choose/index",
 			"style": {
-				"navigationBarTitleText": "账户类型",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "身份选择"
 			}
 		},
 		{
@@ -95,6 +94,14 @@
 				"enablePullDownRefresh": false
 			}
 		},{
+			"path": "pages/home/user-guide/index",
+			"style": {
+				"navigationBarTitleText": "用户指南",
+				"navigationBarTextStyle": "white",
+				"navigationBarBackgroundColor": "#19a97c",
+				"enablePullDownRefresh": false
+			}
+		},{
 			"path": "pages/order/driver-home/upload/index",
 			"style": {
 				"navigationBarTitleText": "上传照片",
@@ -169,7 +176,8 @@
 			"path": "pages/wode/index",
 			"style": {
 				"navigationBarTitleText": "个人信息",
-				"navigationBarBackgroundColor":"#ffffff",
+				"navigationBarTextStyle":"white",
+				"navigationBarBackgroundColor":"#19a97c",
 				"enablePullDownRefresh": false
 			}
 		}
@@ -32,7 +32,7 @@
 		<view class="bottom">
 			<view class="default">
 				<view class="left">
-					<view class="set">当前选中地址</view>
+					<view class="set">设置成默认地址</view>
 				</view>
 				<view class="right">
 					<u-switch v-model="addressInfo.defaultFlag" size="40" activeColor="#19a97c"></u-switch>
@@ -7,7 +7,7 @@
 					<view class="phone">{{ res.garUserContactTel }}</view>
 					<view class="tag">
 						<text v-if="res.garUserDefault == 1" :class="{ red: res.garUserDefault == 1 }">
-							{{ res.garUserDefault == 1 ? "当前选中" : "" }}
+							{{ res.garUserDefault == 1 ? "默认地址" : "" }}
 						</text>
 					</view>
 				</view>
 <template>
   <view class="mask-box">
-    <liu-delivery-time :isMask="true" :change="changeTime" ref="chooseTime" title="请选择预约时间"></liu-delivery-time>
+    <address-popup ref="addressPopupRef" @currentChange="currentChange"></address-popup>
+    <liu-delivery-time :isMask="true" :change="changeTime" ref="chooseTime" title="请选择预约时间">
+    </liu-delivery-time>
     <u-picker closeOnClickOverlay :show="garbageTypeShowFlag" :columns="garbageTypeList" :itemHeight="100"
       @confirm="handlePickerGarbageTypeConfirm" @close="handleGarbageTypeClick(false)"
       @cancel="handleGarbageTypeClick(false)"></u-picker>
@@ -12,7 +14,14 @@
           {{ userAddress.garUserAddress }}{{ userAddress.garRemark }}
         </view>
         <view class="company-clean-container-header-base-info">
-          {{ userAddress.garUserContactName }} {{ userAddress.garUserContactTel }}
+          <view class="company-clean-container-header-base-info-left">
+            {{ userAddress.garUserContactName }} {{ userAddress.garUserContactTel }}
+          </view>
+          <view class="company-clean-container-header-base-info-right">
+            <view class="company-clean-container-header-base-info-right-icon">
+              <image width="35" height="35" :src="changeAddressUrl" @click="handlerChooseAddress"></image>
+            </view>
+          </view>
         </view>
         <view @click.stop="handleTimeChoose" class="company-clean-container-header-reservation">
           <view class="company-clean-container-header-reservation-left">
@@ -80,17 +89,17 @@
           </view>
           <view class="company-clean-container-car-main-content-type">
             <view class="company-clean-container-car-main-content-type-price-area">
-              <text style="color: red;">*</text>是否进入车库:
+              <text style="color: red;">*</text>进入地下车库:
             </view>
             <view style="width:100%;display: flex;justify-content: flex-start;align-items: center; ">
               <view style="display: flex; align-items: center;">
                 <up-radio-group shape="square" size="30" v-model="paramFrom.garInCarStore" placement="row"
                   @change="handleInCarClick">
-                  <up-radio activeColor="#19a97c" labelSize="30"
-                    :customStyle="{ marginBottom: '8px', marginRight: '30rpx' }" label="是" :name="true">
+                  <up-radio activeColor="#19a97c" labelSize="30" :customStyle="{ marginRight: '30rpx' }" label="需要"
+                    :name="true">
                   </up-radio>
-                  <up-radio activeColor="#19a97c" labelSize="30"
-                    :customStyle="{ marginBottom: '8px', marginRight: '30rp' }" label="否" :name="false">
+                  <up-radio activeColor="#19a97c" labelSize="30" :customStyle="{ marginRight: '30rp' }" label="不需要"
+                    :name="false">
                   </up-radio>
                 </up-radio-group>
               </view>
@@ -98,11 +107,11 @@
           </view>
           <view v-if="paramFrom.garInCarStore" class="company-in-car-store-box-info">
             <view class="company-clean-container-site-image-info-input-remark-box">
-              <u--textarea v-model="paramFrom.remark" placeholder="请输入备注 示例：限高2、3米，需要进入车库..."></u--textarea>
+              <u--textarea v-model="paramFrom.remark" placeholder="请填写限制高度（米）"></u--textarea>
             </view>
-            <view class="company-clean-container-car-main-content-remark" style="margin-top: 20rpx;  font-size: 23rpx;">
+            <!-- <view class="company-clean-container-car-main-content-remark" style="margin-top: 20rpx;  font-size: 23rpx;">
               提示：需要进入车库需要写车辆限高，部门车库限高2.3m，如果装修垃圾在车库，要考虑车辆是否能进入。
-            </view>
+            </view> -->
           </view>
           <view class="company-clean-container-car-main-content-prompt">
             温馨提示：垃圾类型不符合，企业有权拒绝清运。
@@ -111,11 +120,11 @@
       </view>
       <view class="company-clean-container-site-image-info">
         <view class="company-clean-container-site-image-info-remark">
-          <text style="color: red;">*</text>要求装车完成后需现场照片（最少1张，最多上传10张），照片须看清全貌。
+          <text style="color: red;">*</text>请上传垃圾量照片（至少1张，最多5张），照片须看清全貌。
         </view>
         <view class="company-clean-container-site-image-info-img">
           <u-upload width="200" height="150" :fileList="fileList" @afterRead="afterRead" :deletable="deletable"
-            @delete="deletePic" name="10" multiple :maxCount="10" :previewFullImage="true"></u-upload>
+            @delete="deletePic" name="5" multiple :maxCount="5" :previewFullImage="true"></u-upload>
         </view>
       </view>
       <view class="company-clean-container-site-image-info-sure-button">
@@ -163,8 +172,10 @@ import { queryAddress } from &#39;@/apis/address.js&#39;;
 import { queryCarList } from '@/apis/carinfo.js';
 import { uploadFilePromise } from '@/apis/common.js';
 import { saveOrder } from '@/apis/order.js';
+import addressPopup from '@/components/address-popup/address-popup.vue';
 import liuDeliveryTime from "@/components/liu-delivery-time/liu-delivery-time.vue";
 import myPiker from '@/components/my-piker/index.vue';
+import changeAddressUrl from '@/static/image/change-address.png';
 import garbageUrl from '@/static/image/garbage.png';
 import { useMainStore } from '@/stores/index.js';
 import { onLoad } from '@dcloudio/uni-app';
@@ -172,8 +183,8 @@ import { computed, getCurrentInstance, nextTick, ref, watch } from &#39;vue&#39;;
 const { proxy } = getCurrentInstance();
 const store = useMainStore();
 const userType = computed(() => store.userType)
-const x = ref(5)
-const y = ref()
+const x = ref(360)
+const y = ref(650)
 const movableAreaElement = ref()
 const deletable = ref(false)
 const companyObj = ref()
@@ -181,6 +192,7 @@ const tel = ref()
 const carTypeShowFlag = ref(false)
 const garbageTypeShowFlag = ref(false)
 const carPopupShowFlag = ref(false)
+const addressPopupRef = ref(null);
 const userAddress = ref({
   garUserContactName: "",
   garUserContactTel: "",
@@ -201,21 +213,20 @@ const garCarTransportInfo = computed(() =&gt; {
     let boxLength = lengthWidthHeight[0]; // 箱子的长度（单位：米）
     let boxWidth = lengthWidthHeight[1]; // 箱子的宽度（单位：米）
     let boxHeight = lengthWidthHeight[2]; // 箱子的高度（单位：米）
-
+    console.log(boxLength, boxWidth, boxHeight);
     let bagLength = 0.75; // 袋子的长度（单位：米）
     let bagWidth = 0.45; // 袋子的宽度（单位：米）
-    let bagHeight = 0.22; // 袋子的高度（单位：米）
+    let bagHeight = 0.16; // 袋子的高度（单位：米）
     let boxVolume = boxLength * boxWidth * boxHeight; // 箱子的体积（单位：立方米）
     let bagVolume = bagLength * bagWidth * bagHeight; // 袋子的体积（单位：立方米）
     let bagCount = Math.floor(boxVolume / bagVolume); // 箱子可以容纳的袋子数量（向下取整）
     console.log(bagCount, boxVolume, bagVolume);
-    return `箱体长${boxLength}m宽${boxWidth}m高${boxHeight}m，最多课容纳约${bagCount}袋袋装修垃圾（75cm * 45cm每袋）。`
+    return `箱体长${boxLength}m宽${boxWidth}m高${boxHeight}m，最多课容纳约${bagCount}袋袋装修垃圾（${bagLength * 100}cm * ${bagWidth * 100}cm每袋）。`
   } catch (error) {
-    return "符合装修垃圾运输管理规范的新型环保智能装修垃圾运输车。"
+    return "符合装修垃圾运输管理规范的专用运输车辆。"
   }
-
 })
 // 车辆数量
 const garCarNumberCount = computed(() => {
@@ -389,7 +400,6 @@ const handlePickerCarInfoConfirm = (e) =&gt; {
   paramFrom.value.carType = e
   garCarLabelInfoNow.value = garCarLabelInfoList.value[paramFrom.value.carType]
   carTypeShowFlag.value = false
-  console.log(garCarLabelInfoNow.value);
 }
 /**
@@ -491,7 +501,12 @@ const handleOderSure = () =&gt; {
   })
 }
-
+const handlerChooseAddress = () => {
+  addressPopupRef.value.open(userAddress.value)
+}
+const currentChange = (val) => {
+  userAddress.value = val
+}
 /**
  * 校验参数
  * @param {Object} params
@@ -577,12 +592,15 @@ watch(carPopupShowFlag, (val) =&gt; {
     setTimeout(() => {
       nextTick(() => {
         let areaHeight;
+        let areaWeight;
         // select中的参数就如css选择器一样选择元素
         let movableArea = uni.createSelectorQuery().in(proxy).select(".movableArea");
         movableArea.boundingClientRect(function (data) {
           //	data - 包含元素的高度等信息
           areaHeight = data.height;
-          y.value = areaHeight > 40 ? (areaHeight - 40) : areaHeight;
+          areaWeight = data.width;
+          x.value = areaWeight > 300 ? (areaWeight - 50) : areaWeight;
+          y.value = areaHeight > 80 ? (areaHeight - 80) : areaHeight;
         }).exec(function (res) {
           // 注意：exec方法必须执行，即便什么也不做，否则不会获取到任何数据
         })
@@ -633,12 +651,39 @@ $custom-bottom-height: 200rpx;
         font-size: 25rpx;
         color: $u-info;
         line-height: 80rpx;
+        display: flex;
+
+        .company-clean-container-header-base-info-left {
+          flex: 2;
+        }
+
+        .company-clean-container-header-base-info-right {
+          flex: 1;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+          .company-clean-container-header-base-info-right-icon {
+            width: 37rpx;
+            height: 37rpx;
+            @include handleClick;
+            display: flex;
+            align-items: center;
+
+            image {
+              height: 100%;
+              width: 100%;
+              background-size: 100% 100;
+            }
+          }
+        }
       }
       .company-clean-container-header-reservation {
+        line-height: 80rpx;
         display: flex;
         justify-content: space-between;
-        font-size: 25rpx;
+        font-size: 28rpx;
         @include handleClick;
         .company-clean-container-header-reservation-left {
@@ -18,7 +18,8 @@
     <!-- 公司容器 -->
     <view class="company-box">
       <view class="info-box">
-        <view class="info-box-item" hover-class="click-box" v-for="(item, index) in infoBoxList" :key="index">
+        <view class="info-box-item" hover-class="click-box" v-for="(item, index) in infoBoxList" :key="index"
+          @click.stop="handlerCLickInfoBox(item.text)">
           <view class="info-box-item-icon" :class="item.icon">
           </view>
           <view class="info-box-item-text">{{ item.text }}</view>
@@ -85,19 +86,20 @@
                               </view>
                             </view>
                           </view>
-                          <view class="company-list-item-bottom-contact-company" style="display: flex;">
-                            <up-icon name="phone" color="#19a97c"></up-icon>
+                          <view class="company-list-item-bottom-contact-company"
+                            style="display: flex; align-items: center;">
+                            <up-icon name="phone" size="34" color="#19a97c"></up-icon>
                             <view @click="handleContactClick(item.servicePhone)"
-                              style="display: flex; justify-content: center; align-items: center" color="#a9e08f">
+                              style="display: flex; justify-content: center; align-items: center;font-size: 28rpx; color:'#a9e08f'">
                               {{ item.servicePhone }}
                             </view>
                           </view>
                         </view>
                         <view class="company-list-item-main-right-box"
-                          style="display: flex; justify-content: flex-end; align-items: flex-end;color:#458B74;font-weight: bold;">
+                          style="display: flex;font-size: 28rpx; justify-content: flex-end; align-items: flex-end;color:#458B74;font-weight: bold;">
                           <view class="company-list-item-main-right-box-text"
-                            @click="handleCleanGarbage(item, item.servicePhone, userAddress)">
-                            垃圾清运 ->
+                            @tap.stop="handleCleanGarbage(item, item.servicePhone, userAddress)">
+                            预约清运 ->
                           </view>
                         </view>
                       </view>
@@ -119,7 +121,7 @@
           </view>
           <view class="empty-text-box">
             <view class=" empty-text-box-button">
-              {{ userType == '用户' ? '立即清运' : '角色切换' }}
+              {{ userType == '用户' ? '立即清运' : '身份切换' }}
             </view>
           </view>
         </view>
@@ -131,8 +133,7 @@
 <script setup>
 import { queryAddress } from '@/apis/address.js';
 import { queryEnterpriseList } from '@/apis/company.js';
-import swiperImage1 from '@/static/image/freecompress-swiper-1.png';
-import swiperImage2 from '@/static/image/freecompress-swiper-2.jpg';
+import { queryRole } from "@/apis/user";
 import { useMainStore } from "@/stores/index.js";
 import { onLoad, onShow } from '@dcloudio/uni-app';
 import { computed, ref } from 'vue';
@@ -147,9 +148,9 @@ const topMargin = ref(null);//状态栏高度
 const musicheadHeight = ref();
 const paging = ref(null)
 const swiperImageList = ref([{
-  image: swiperImage1
+  image: import.meta.env.VITE_BASE_URL + "/swiper-1.jpg"
 }, {
-  image: swiperImage2
+  image: import.meta.env.VITE_BASE_URL + "/swiper-2.jpg"
 }])
 const userAddress = ref({})
@@ -233,6 +234,16 @@ const infoBoxList = ref([{
 const companyList = ref([])
+const handlerCLickInfoBox = (val) => {
+  switch (val) {
+    case '用户指南':
+      uni.$u.route('/pages/home/user-guide/index')
+      break;
+
+    default:
+      break;
+  }
+}
 /**
  * 拨打电话回调
  */
@@ -327,8 +338,10 @@ const handleCleanClick = () =&gt; {
         content: '是否进行身份切换？',
         success: function (res) {
           if (res.confirm) {
-            uni.$u.route({
-              url: `pages/wode/choose/index?ruleVos= ${encodeURIComponent(JSON.stringify([{ userType: '用户' }, mainStore.userInfo]))}`,
+            queryRole().then(res => {
+              uni.$u.route({
+                url: `pages/wode/choose/index?ruleVos= ${encodeURIComponent(JSON.stringify(res.data.data.ruleVos))}`,
+              })
             })
           } else if (res.cancel) {
             console.log('用户点击取消');
@@ -338,7 +351,6 @@ const handleCleanClick = () =&gt; {
     }
   }
   return
-
 }
 /**
  * 公司详情
@@ -401,7 +413,7 @@ const initData = () =&gt; {
   queryAddress('CURRENT').then(res => {
     try {
       if (res.data.data && res.data.data[0]) {
-        addressInfo.value = res.data.data[0].garUserAddress + res.data.data[0].garRemark
+        addressInfo.value = res.data.data[0].garRemark
         userAddress.value = JSON.stringify(res.data.data[0] ? res.data.data[0] : {});
       } else {
         addressInfo.value = '';
@@ -567,7 +579,6 @@ const queryList = (pageNo, pageSize) =&gt; {
         box-sizing: border-box;
         border-radius: 20rpx;
         background: linear-gradient(to bottom, $u-primary, $u-primary-disabled);
-        // background-image: url("https://cdn.uviewui.com/uview/swiper/swiper2.png");
         color: #ffffff;
         background-size: 100% 100%;
         padding: 20rpx;
@@ -594,7 +605,7 @@ const queryList = (pageNo, pageSize) =&gt; {
             box-sizing: border-box;
             border-radius: 50rpx;
             background-color: orange;
-            font-size: 25rpx;
+            font-size: 28rpx;
           }
         }
       }
@@ -676,7 +687,7 @@ const queryList = (pageNo, pageSize) =&gt; {
                     .company-list-item-main-right-name-label-recently {
                       margin-right: 10rpx;
-                      font-size: 16rpx;
+                      font-size: 18rpx;
                       display: flex;
                       align-items: center;
                       justify-content: center;
@@ -689,7 +700,7 @@ const queryList = (pageNo, pageSize) =&gt; {
                     .company-list-item-main-right-name-label-distance {
                       margin-right: 10rpx;
-                      font-size: 16rpx;
+                      font-size: 18rpx;
                       display: flex;
                       align-items: center;
                       justify-content: center;
@@ -704,13 +715,14 @@ const queryList = (pageNo, pageSize) =&gt; {
                       align-items: center;
                       justify-content: center;
                       font-size: 30rpx;
+                      overflow-x: visible;
                     }
                   }
                   .company-list-item-main-right-score {
                     display: flex;
                     font-size: small;
-                    font-size: 24rpx;
+                    font-size: 28rpx;
                     .company-list-item-main-right-text {
                       text-align: center;
@@ -730,12 +742,12 @@ const queryList = (pageNo, pageSize) =&gt; {
                     display: flex;
                     justify-content: space-between;
                     align-items: center;
+                    font-size: 28rpx;
                     .company-list-item-main-right-price {}
                     .company-list-item-main-right-number {
                       flex: auto;
-                      font-size: small;
                       .company-list-item-main-right-number-text {
@@ -744,17 +756,13 @@ const queryList = (pageNo, pageSize) =&gt; {
                     }
                   }
-                  .company-list-item-main-right-remark {
-                    font-size: 25rpx;
-                    line-height: 40rpx;
-                  }
                 }
               }
               .company-list-item-bottom {
                 display: flex;
                 justify-content: space-around;
-                font-size: 25rpx;
+                font-size: 28rpx;
                 color: #909399;
                 margin-bottom: 50rpx;
+<template>
+  <view class="user-guide">
+    <image :src="imageUrl"></image>
+  </view>
+</template>
+
+<script setup>
+const imageUrl = import.meta.env.VITE_BASE_URL + "/user-guide.png";
+</script>
+
+<style lang="scss" scoped>
+.user-guide {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: white;
+  padding-top: 20rpx;
+
+  image {
+    background-size: 100% 100%;
+    width: 100%;
+    height: 4000rpx;
+  }
+}
+</style>
@@ -343,6 +343,8 @@ const handleOrderDispatchClick = (orderId) =&gt; {
   // 获取驾驶员人员
   queryOrderDispatch(orderId).then(res => {
     if (res.data.success) {
+      // 过滤车辆  非用户选择的车辆无法选中
+
       driverPersonnelList.value = res.data.data
       clashDriverDispatchRef.value.open(res.data.data)
     } else {
@@ -3,14 +3,14 @@
     <view class="choose-type-box">
       <view class="choose-type-item" :class="item.isNow ? 'itemActive' : ''" v-for=" (item, index) in typeList"
         :key="index" @click="handlerClick(item)">
-        <view class="choose-type-item-top" :class="item.classStyle">
+        <!-- <view class="choose-type-item-top" :class="item.classStyle">
           <view class="choose-type-item-image" width="100%" height="100%">
             <image :src="item.image" shape="circle" mode="aspectFill">
             </image>
           </view>
           <view class="choose-type-item-text">
             <view class="choose-type-item-text-right">
-              <view v-if="item.company" class="choose-tyep-item-text-right-compay">
+              <view v-if="item.company" class="choose-type-item-text-right-company">
                 {{ item.company }}
               </view>
               <view class="choose-type-item-text-right-label">
@@ -25,6 +25,9 @@
             {{ item.isNow ? '当前身份' : '切换此身份' }}
             <up-icon name="checkmark-circle-fill" :color="item.isNow ? '#19a97c' : ''" size="28"></up-icon>
           </view>
+        </view> -->
+        <view class="choose-type-item-img">
+          <image :src="item.imageUrl" mode="aspectFill"></image>
         </view>
       </view>
     </view>
@@ -34,8 +37,6 @@
       </view>
     </view>
   </view>
-
-
 </template>
 <script setup>
@@ -58,6 +59,7 @@ const typeList = ref([{
   classStyle: 'choose-type-item-top-back-sky',
   isNow: false,
   isExit: true,
+  imageUrl: import.meta.env.VITE_BASE_URL + "/role/user.png"
 }, {
   label: "运输企业负责人",
   info: '负责订单处理',
@@ -67,6 +69,7 @@ const typeList = ref([{
   classStyle: 'choose-type-item-top-back-sun',
   order: 1,
   isNow: false,
+  imageUrl: import.meta.env.VITE_BASE_URL + "/role/company.png"
 }, {
   label: "清运车辆驾驶员",
   info: '负责垃圾清运',
@@ -76,6 +79,7 @@ const typeList = ref([{
   classStyle: 'choose-type-item-top-back-blue',
   order: 2,
   isNow: false,
+  imageUrl: import.meta.env.VITE_BASE_URL + "/role/handler.png"
 }, {
   label: "处置场所负责人",
   info: '负责现场指导',
@@ -85,6 +89,7 @@ const typeList = ref([{
   classStyle: 'choose-type-item-top-back-pink',
   order: 3,
   isNow: false,
+  imageUrl: import.meta.env.VITE_BASE_URL + "/role/disposal.png"
 }])
 const unitInfo = ref([])
 const handlerClick = (val) => {
@@ -165,7 +170,8 @@ onLoad((options) =&gt; {
   box-sizing: border-box;
   // padding: 20rpx;
   background-color: $u-info-light;
-
+  background-color: white;
+  padding-top: 100rpx;
   .choose-type-box {
     width: 750rpx;
@@ -178,10 +184,10 @@ onLoad((options) =&gt; {
     .choose-type-item {
       width: 100%;
-      height: 270rpx;
-      box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
+      height: 230rpx;
+      // box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
       margin-bottom: 40rpx;
-      border-radius: 15rpx 15rpx 0rpx 0rpx;
+      // border-radius: 15rpx 15rpx 0rpx 0rpx;
       .choose-type-item-top-back-blue {
@@ -238,7 +244,7 @@ onLoad((options) =&gt; {
             justify-content: space-around;
             color: white;
-            .choose-tyep-item-text-right-compay {
+            .choose-type-item-text-right-company {
               font-weight: bolder;
               font-size: 32rpx;
             }
@@ -277,6 +283,17 @@ onLoad((options) =&gt; {
           color: #19a97c !important;
         }
       }
+
+      .choose-type-item-img {
+        width: 100%;
+        height: 200rpx;
+
+        image {
+          width: 100%;
+          height: 200rpx;
+        }
+
+      }
     }
     .itemActive {
@@ -311,6 +328,7 @@ onLoad((options) =&gt; {
   }
   .choose-user-bottom-button-box {
+    margin-top: 80rpx;
     width: 100%;
     height: 80rpx;
     display: flex;
@@ -7,40 +7,46 @@
       <view style="display: flex; flex-direction: column; width: 100%;">
         <view class="manager-info">
           <view class="manager-info-transport-company-name">
-            <view class="">
-              <text>{{ userInfo.transportCompanyName }}</text>
-            </view>
+            <text>{{ userInfo.transportCompanyName }}</text>
           </view>
           <view class="choose-type-item-text-right-label">{{ userInfo.userType }}</view>
         </view>
       </view>
     </view>
-    <view class="u-m-t-20" style="background-color: white;">
-      <u-cell-group>
-        <u-cell icon="map" iconStyle="font-size:28rpx" @click="handleAddressManager" title="地 址 管 理"></u-cell>
-      </u-cell-group>
-    </view>
-
-    <view class="u-m-t-20">
-      <!-- <u-cell-group>
-        <u-cell icon="star" title="收藏"></u-cell>
-        <u-cell icon="photo" title="相册"></u-cell>
-        <u-cell icon="coupon" title="卡券"></u-cell>
-        <u-cell icon="heart" title="关注"></u-cell>
-      </u-cell-group> -->
-    </view>
-
-    <view class="u-m-t-40" style="background-color: white;">
-      <u-cell-group>
-        <u-cell class="logout-cell" icon="setting" iconStyle="font-size:28rpx" @click="handleLoginOut"
-          title="退 出 登 录"></u-cell>
-      </u-cell-group>
+    <view class="more-setting-box">
+      <view class="more-setting-title">
+        更多设置
+      </view>
+      <view class="cell-box" @click="handleAddressManager" hover-class="handlerClick">
+        <view class="cell-icon">
+          <image width="35rpx" height="35rpx" src="../../static/image/address-manager.png"></image>
+        </view>
+        <view class="cell-label">
+          <text>地 址 管 理</text>
+        </view>
+      </view>
+      <view class="cell-box" @click="handlerChangeRole" hover-class="handlerClick">
+        <view class="cell-icon">
+          <image src="../../static/image/role-change.png"></image>
+        </view>
+        <view class="cell-label">
+          <text>角 色 切 换</text>
+        </view>
+      </view>
+      <view class="cell-box" @click="handleLoginOut" hover-class="handlerClick">
+        <view class="cell-icon">
+          <image src="../../static/image/quit-login.png"></image>
+        </view>
+        <view class="cell-label">
+          <text>退 出 登 录</text>
+        </view>
+      </view>
     </view>
   </view>
 </template>
 <script setup>
-import { loginOut } from "@/apis/user";
+import { loginOut, queryRole } from "@/apis/user";
 import headImg from "@/static/image/st_pic.png";
 import { useMainStore } from "@/stores/index";
 import { setRequestToken } from '@/utils/request/request.js';
@@ -54,6 +60,26 @@ const handleAddressManager = () =&gt; {
     url: `pages/home/address/index`,
   })
 }
+const handlerChangeRole = () => {
+  uni.showModal({
+    title: '提示',
+    content: '是否进行身份切换？',
+    success: function (res) {
+      if (res.confirm) {
+        queryRole().then(res => {
+          if (res.data.success) {
+            uni.$u.route({
+              url: `pages/wode/choose/index?ruleVos= ${encodeURIComponent(JSON.stringify(res.data.data.ruleVos))}`,
+            })
+          }
+        })
+
+      } else if (res.cancel) {
+        console.log('用户点击取消');
+      }
+    }
+  });
+}
 const handleLoginOut = () => {
   uni.showModal({
     title: '提示',
@@ -87,14 +113,63 @@ const handleLoginOut = () =&gt; {
   .head-top-box {
     display: flex;
     align-items: center;
-    background: white;
+    background: #19a97c;
+    padding: 20rpx 30rpx;
+    box-sizing: border-box;
+    border-radius: 0 0 30rpx 30rpx;
+    height: 300rpx;
     .head-image-box {
       display: flex;
       align-items: center;
       justify-content: center;
-      width: 200rpx;
-      height: 200rpx;
+      width: 180rpx;
+      height: 180rpx;
+      margin-right: 30rpx;
+    }
+  }
+
+  .more-setting-box {
+    margin-top: 60rpx;
+    margin-bottom: 20rpx;
+    padding: 20rpx;
+    box-sizing: border-box;
+    align-items: center;
+
+    .more-setting-title {
+      color: $u-info;
+    }
+
+    .cell-box {
+      display: flex;
+      align-items: center;
+      line-height: 80rpx;
+      font-size: 35rpx;
+      background-color: white;
+      border-radius: 15rpx;
+      margin: 40rpx 0;
+
+      .cell-icon {
+        margin: 0 20rpx;
+        display: flex;
+        align-items: center;
+
+        image {
+          background-size: 100% 100%;
+          width: 40rpx;
+          height: 40rpx;
+        }
+
+        u-icon {}
+      }
+
+      .cell-label {
+        text {}
+      }
+    }
+
+    .handlerClick {
+      @include handleClick;
     }
   }
 }
@@ -107,9 +182,6 @@ const handleLoginOut = () =&gt; {
   background-color: #fff;
 }
-.logout-cell {
-  @include handleClick;
-}
 .manager-info {
   width: 100%;
@@ -121,37 +193,38 @@ const handleLoginOut = () =&gt; {
   color: white;
   .choose-tyep-item-text-right-info {
-    font-size: 28rpx;
+    font-size: 40rpx;
   }
-  .choose-tyep-item-text-right-compay {
+  .manager-info-transport-company-name {
+    display: flex;
+    color: white;
+    line-height: 80rpx;
+    font-size: 40rpx;
+  }
+
+  .choose-tyep-item-text-right-company {
     font-weight: bolder;
-    line-height: 35rpx;
-    font-size: 32rpx;
+    line-height: 40rpx;
+    font-size: 40rpx;
   }
   .choose-type-item-text-right-label {
-    font-size: 23rpx;
+    font-size: 30rpx;
     padding: 8rpx 15rpx;
     border-radius: 5rpx;
-    color: $u-info-dark;
+    color: $u-main-color;
     font-weight: 600;
     margin-bottom: 10rpx;
-    background: #e7e7e7ad;
-    border: 3rpx solid white;
+    background: #f3a200;
   }
 }
 .manager-info-parent-company-name {
+  color: white;
   text {
-    color: $u-info;
+    color: white;
   }
 }
-
-.manager-info-transport-company-name {
-  display: flex;
-  color: $u-main-color;
-  line-height: 80rpx;
-}
 </style>
@@ -18,7 +18,7 @@
 @mixin handleClick {
   &:active {
-    background-color: #f3f4f6;
+    background-color: #f3f4f6 !important;
     opacity: 0.8;
     transition: opacity 0.3s;
     -webkit-transition: opacity 0.3s;