update 登录和其他部分信息

xuxueyang

2024-08-03 7a68f7e13913f8d4f86962979fd1e79c18f57fb6

 pages/user/address/address.vue

@@ -1,481 +1,539 @@
<template>
  <!-- 收获地址列表 -->
  <view class="p15 container-address">
    <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>
   <!-- 收货地址列表 -->
   <view class="p15 container-address">
      <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>

    <!-- 循环 -->
    <view v-for="(item,index) of list" :key="index" class="location-each">
      <view class="flex">
        <view class="container-info">
          <view class="flex">
            <view class="name">{{ item.name || '-' }}</view>
            <view class="tel">{{ item.tel || '-' }}</view>
          </view>
          <view class="address">
            {{ item.address }}

          </view>
        </view>
        <!-- <view class="h-line"></view> -->
        <view class="edit" @click="()=>{
      <!-- 循环 -->
      <view v-for="(item,index) of list" :key="index" class="location-each">
         <view class="flex">
            <view class="container-info">
               <view class="flex">
                  <view class="name">{{ item.name || '-' }}</view>
                  <view class="tel">{{ item.tel || '-' }}</view>
               </view>
               <view class="address">
                  {{ item['province'] || '' }}{{ item['city'] && ('/' + item['city']) || '' }}{{
                    item['region'] && ('/' + item['region']) || ''
                  }}
               </view>
               <view class="address">
                  {{ item.address }}
               </view>
            </view>
            <!-- <view class="h-line"></view> -->
            <view class="edit" @click="()=>{
               this.submitForm = {
                  ...item
               }
               openAddressForm()
            }">
          <uni-icons type="compose" class="icon" color="#666666"></uni-icons>
        </view>
      </view>
      <view class="v-line"></view>
      <view class="flex">
        <!--        @click="changeDefaultAddress(item,index)"-->
        <view class="flex">
          <view class="radio m-t-2 m-r-10" :class="[item.defaulted?'select':'']">
               <uni-icons type="compose" class="icon" color="#666666"></uni-icons>
            </view>
         </view>
         <view class="v-line"></view>
         <view class="flex">
            <!--        -->
            <view class="flex">
               <view class="radio m-t-2 m-r-10" :class="[item.isDefault?'select':'']"
                  @click="changeDefaultAddress(item,index)">

          </view>
          <span class="desc">{{ item.defaulted ? '默认地址:' : '当前地址:' }}{{ item.address || '' }}</span>
          <!-- 当前地址/默认地址勾选 -->
        </view>
        <view class="desc del t-red" @click="deleteAddress(item)">
          删除
        </view>
        <view class="desc del t-green m-l-10" v-if="source==='select'" @click="selectAddress(item)">
          选择此地址
        </view>
      </view>
               </view>
               <span class="desc">{{ item.isDefault ? '默认地址:' : '当前地址:' }}{{ item.address || '' }}</span>
               <!-- 当前地址/默认地址勾选 -->
            </view>
            <view class="desc del t-red" @click="deleteAddress(item)">
               删除
            </view>
            <view class="desc del t-green m-l-10" v-if="source==='select'" @click="selectAddress(item)">
               选择此地址
            </view>
         </view>

    </view>
    <view style="height: 92rpx;width: 690rpx;">
      &nbsp;
    </view>
    <view class="button-green button-fixed-bottom" style="width: 690rpx;line-height: 92rpx;height: 92rpx;" @click=" ()=>{
            delete this.submitForm.id
            this.submitForm['name'] = ''
            this.submitForm['tel'] = ''
            this.submitForm['tel'] = ''
            this.submitForm['area'] = ''
      </view>
      <view style="height: 92rpx;width: 690rpx;">
         &nbsp;
      </view>
      <view class="button-green button-fixed-bottom" style="width: 690rpx;line-height: 92rpx;height: 92rpx;"
         @click="addAddress">添加收货地址
      </view>

            openAddressForm()
         }">添加收货地址
    </view>

    <uni-popup ref="popup_form" type="top" :mask-click="false">
      <view class="popup-address-form">
        <view class="close-parent">
          {{ submitForm.id ? '新增' : '编辑' }}收货地址
          <uni-icons class="close" type="closeempty" @click="closeAddressForm"></uni-icons>
        </view>
        <!--收货人、手机号、校区、详细地址 -->
        <view class="submit form">
          <view class="form-item">
            <view class="form-item-label require">
              收货人
            </view>
            <view class="form-item-value">
              <input v-model="submitForm.name" placeholder="请输入收货人" class="form-input"></input>
            </view>
          </view>
          <view class="form-item">
            <view class="form-item-label require">
              请选择收获地址
            </view>
            <view class="m-l-a m-r-0 flex " :class="[!dto['province']?'desc-gray':'']">
              <uni-data-picker :area="true" @change="(e)=>{PickArea(dto,e)}" placeholder=""
                               :localdata="regionDataPlus">
                {{ dto['province'] || '请选择' }}{{ dto['city'] && ('/' + dto['city']) || '' }}{{
                  dto['region'] && ('/' + dto['region']) || ''
      <uni-popup ref="popup_form" type="top" :mask-click="false">
         <view class="popup-address-form">
            <view class="close-parent">
               {{ submitForm.id ? '新增' : '编辑' }}收货地址
               <uni-icons class="close" type="closeempty" @click="closeAddressForm"></uni-icons>
            </view>
            <!--收货人、手机号、校区、详细地址 -->
            <view class="submit form">
               <view class="form-item">
                  <view class="form-item-label require">
                     收货人
                  </view>
                  <view class="form-item-value">
                     <input v-model="submitForm.name" placeholder="请输入收货人" class="form-input"></input>
                  </view>
               </view>
               <view class="form-item">
                  <view class="form-item-label require">
                     手机号
                  </view>
                  <view class="form-item-value">
                     <input v-model="submitForm.tel" placeholder="请输入收货人手机号" class="form-input"></input>
                  </view>
               </view>
               <view class="form-item">
                  <view class="form-item-label require">
                     收货地址
                  </view>
                  <view class="m-l-a m-r-0 flex " :class="[!dto['province']?'desc-gray':'']">
                     <uni-data-picker :area="true" @change="(e)=>{PickArea(submitForm,e)}" placeholder=""
                        :localdata="regionDataPlus">
                        {{ submitForm['province'] || '请选择' }}{{ submitForm['city'] && ('/' + submitForm['city']) || '' }}{{
                  submitForm['region'] && ('/' + submitForm['region']) || ''
                }}
              </uni-data-picker>
              <u-icon class="m-l-a" name="arrow-right"></u-icon>
            </view>
                     </uni-data-picker>
                     <u-icon class="m-l-a" name="arrow-right"></u-icon>
                  </view>

            <!--            <view class="form-item-value" @click="chooseLocation">-->
            <!--              <input v-model="submitForm.room" placeholder="请选择收获地址" disabled class="form-input"></input>-->
            <!--              &lt;!&ndash;  点击定位 &ndash;&gt;-->
            <!--            </view>-->
          </view>
          <view class="form-item">
            <view class="form-item-label require">
              详细地址
            </view>
            <view class="form-item-value">
              <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input"></input>

            </view>
          </view>
          <view class="form-item">
            <view class="form-item-label">
              是否默认
            </view>
            <view class="form-item-value">
              <radio value="r1" :checked="submitForm.isDefault"
                     @click="submitForm.isDefault=!submitForm.isDefault"
                     style="transform:scale(0.6);margin-top: -8rpx;"/>
            </view>
          </view>
        </view>
               </view>
               <view class="form-item">
                  <view class="form-item-label require">
                     详细地址
                  </view>
                  <view class="form-item-value">
                     <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input"></input>

        <view class="button-green m-t-15" @click="saveOrUpdateAddress">保存</view>
      </view>
    </uni-popup>
                  </view>
               </view>
               <view class="form-item">
                  <view class="form-item-label">
                     是否默认
                  </view>
                  <view class="form-item-value">
                     <radio value="r1" :checked="submitForm.isDefault"
                        @click="submitForm.isDefault=!submitForm.isDefault"
                        style="transform:scale(0.6);margin-top: -8rpx;" />
                  </view>
               </view>
            </view>

  </view>
            <view class="button-green m-t-15" @click="saveOrUpdateAddress">保存</view>
         </view>
      </uni-popup>

   </view>
</template>

<script>
// import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js';
// const lockey = 'VUHBZ-2AMLP-B7AD7-VUQZ7-D4TW5-MFFVN'; //使用在腾讯位置服务申请的key
// const chooseLocation = requirePlugin('chooseLocation');
   // import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js';
   // const lockey = 'VUHBZ-2AMLP-B7AD7-VUQZ7-D4TW5-MFFVN'; //使用在腾讯位置服务申请的key
   // const chooseLocation = requirePlugin('chooseLocation');
   import {
      mapState
   } from 'vuex'
   export default {
      async onPullDownRefresh() {
         this.page.current = 0
         await this.getList()
         uni.stopPullDownRefresh()
      },
      async onLoad(options) {
         // this.list = [{}, {}]
         this.source = options.source || ''
         this.listApi = '/api/address/list'
         await this.getList()

export default {
  async onPullDownRefresh() {
    this.page.current = 0
    await this.getList()
    uni.stopPullDownRefresh()
  },
  async onLoad(options) {
    // this.list = [{}, {}]
    this.source = options.source || ''
    this.listApi = '/api/address/list'
    await this.getList()
      },
      computed: {
         ...mapState({
            address: state => {
               return state.defaultaddress || {}
            },
         }),

  },
  data() {
    return {
      source: '',
      submitForm: {
        name: '',
        tel: '',
        address: '',
        isDefault: false,
        province: '',
        city: '',
        region: '',
      },
      data() {
         return {
            source: '',
            submitForm: {
               name: '',
               tel: '',
               address: '',
               isDefault: false,
               province: '',
               city: '',
               region: '',

      },
      regionDataPlus: [],
    };
  },
  methods: {
    PickArea(item, e) {
      console.log('PickArea', item, e)
      if (e.detail.value) {
        this.dto.province = ''
        this.dto.city = ''
        this.dto.region = ''
        if (e.detail.value.length <= 3) {
          if (!!e.detail.value[0])
            this.dto.province = e.detail.value[0].value
          if (!!e.detail.value[1])
            this.dto.city = e.detail.value[1].value
          if (!!e.detail.value[2])
            this.dto.region = e.detail.value[2].value
        } else {
          //说明有重复的
          var plusnum = e.detail.value.length - 3
          if (!!e.detail.value[plusnum + 0])
            this.dto.province = e.detail.value[plusnum + 0].value
          if (!!e.detail.value[plusnum + 1])
            this.dto.city = e.detail.value[plusnum + 1].value
          if (!!e.detail.value[plusnum + 2])
            this.dto.region = e.detail.value[plusnum + 2].value
        }
            },
            regionDataPlus: [],
            list: [],
         };
      },
      methods: {
         addAddress() {
            delete this.submitForm.id
            this.submitForm['name'] = ''
            this.submitForm['tel'] = ''
            this.submitForm['address'] = ''
            this.submitForm['province'] = ''
            this.submitForm['city'] = ''
            this.submitForm['region'] = ''
            this.submitForm['isDefault'] = false
            this.openAddressForm()
         },
         PickArea(item, e) {
            console.log('PickArea', item, e)
            if (e.detail.value) {
               this.submitForm.province = ''
               this.submitForm.city = ''
               this.submitForm.region = ''
               if (e.detail.value.length == 2) {
                  if (!!e.detail.value[0])
                     this.submitForm.province = e.detail.value[0].value
                  if (!!e.detail.value[0])
                     this.submitForm.city = e.detail.value[0].value
                  if (!!e.detail.value[1])
                     this.submitForm.region = e.detail.value[1].value
               } else if (e.detail.value.length <= 3) {
                  if (!!e.detail.value[0])
                     this.submitForm.province = e.detail.value[0].value
                  if (!!e.detail.value[1])
                     this.submitForm.city = e.detail.value[1].value
                  if (!!e.detail.value[2])
                     this.submitForm.region = e.detail.value[2].value
               } else {
                  //说明有重复的
                  var plusnum = e.detail.value.length - 3
                  if (!!e.detail.value[plusnum + 0])
                     this.submitForm.province = e.detail.value[plusnum + 0].value
                  if (!!e.detail.value[plusnum + 1])
                     this.submitForm.city = e.detail.value[plusnum + 1].value
                  if (!!e.detail.value[plusnum + 2])
                     this.submitForm.region = e.detail.value[plusnum + 2].value
               }

        this.$forceUpdate()
               this.$forceUpdate()
               console.log('submit forn', this.submitForm)
            }
         },
         async init_area() {
            if (this.regionDataPlus && this.regionDataPlus.length > 0) {
					
            }else{
               var a = this.$storage.getItem('cache_area')
               if (a) {
                  this.regionDataPlus = JSON.parse(a) || []
               } else {
                  const res = await this.$http.request('get', '/api/pub/china/area/json')
                  // console.log('area', JSON.parse(res.data))
                  this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll(
                     'name',
                     'text')) || []
                  this.$storage.setItem('cache_area', JSON.stringify(this.regionDataPlus))
               }
            }

      }
    },
    async init_area() {
      const res = await this.$http.request('get', '/api/pub/china/area/json')
      this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll('name',
          'text')) || []
    },
    chooseLocation() {
      //前往接口挑选位置
      const qqmapsdk = new qqmapwx({
        // 使用你在腾讯地图应用生成的key
        key: lockey
      });
         },
         chooseLocation() {
            //前往接口挑选位置
            const qqmapsdk = new qqmapwx({
               // 使用你在腾讯地图应用生成的key
               key: lockey
            });

      uni.getLocation({
        type: 'wgs84',
        success(res) {
          //得到经纬度
          console.log(res);
          qqmapsdk.reverseGeocoder({
            location: {
              latitude: res.latitude,
              longitude: res.longitude
            },
            //成功后的回调
            success: (r) => {
              // console.log('地址信息', r.result.address_component);
              // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…}
              // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…}
              // address: "江苏省苏州市吴中区太湖东路288号"
              // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…}
              // address_reference: {,…}
              // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"}
              // location: {lat: 31.26249, lng: 120.63212}
              // status: 0
              tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r
                  .result.location.lng
              tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r
                  .result.location.lat
              tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r
                  .result.address
              tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false
              tmp.$forceUpdate()
              tmp.tmp_picker_lock_index = -1
            uni.getLocation({
               type: 'wgs84',
               success(res) {
                  //得到经纬度
                  console.log(res);
                  qqmapsdk.reverseGeocoder({
                     location: {
                        latitude: res.latitude,
                        longitude: res.longitude
                     },
                     //成功后的回调
                     success: (r) => {
                        // console.log('地址信息', r.result.address_component);
                        // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…}
                        // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…}
                        // address: "江苏省苏州市吴中区太湖东路288号"
                        // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…}
                        // address_reference: {,…}
                        // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"}
                        // location: {lat: 31.26249, lng: 120.63212}
                        // status: 0
                        tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r
                           .result.location.lng
                        tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r
                           .result.location.lat
                        tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r
                           .result.address
                        tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false
                        tmp.$forceUpdate()
                        tmp.tmp_picker_lock_index = -1

            },
            fail: function (res) {
              console.log(res);
              tmp.tmp_picker_lock_index = -1
            },
          });
        }
      });
    },
    async changeDefaultAddress(item, index) {
      if (item.isDefault) {
        return
      }
      this.$nextTick(() => {
                     },
                     fail: function(res) {
                        console.log(res);
                        tmp.tmp_picker_lock_index = -1
                     },
                  });
               }
            });
         },
         async changeDefaultAddress(item, index) {
            if (item.isDefault) {
               return
            }
            this.$nextTick(() => {

        this.$message.confirm('确定设置此地址为默认地址吗').then(async res => {
          this.$message.showLoading()
          var {
            code
          } = await this.$http.request('post', '/api/address/customer/default/' +
              item.id, {})
          this.$message.hideLoading()
          if (code === 0) {
            for (var dto of this.list) {
              dto.isDefault = false
            }
            this.$message.showToast('设置成功')
            item.isDefault = true
            this.$store.commit('setDefaultAddress', {
              ...item
            })
               this.$message.confirm('确定设置此地址为默认地址吗').then(async res => {
                  this.$message.showLoading()
                  var {
                     code
                  } = await this.$http.request('post', '/api/address/set/default/' + item
                     .id, {
                        data: {
                           id: item.id
                        },
                        params: {
                           id: item.id
                        }
                     })
                  this.$message.hideLoading()
                  if (code === 0) {
                     for (var dto of this.list) {
                        dto.isDefault = false
                     }
                     this.$message.showToast('设置成功')
                     item.isDefault = true
                     this.$store.commit('setDefaultAddress', {
                        ...item
                     })

          }
        }, err => {
          this.$nextTick(() => {
            this.list[index].defaulted = false
            this.$forceUpdate()
            console.log('err', err, this.list[index])
          })
                  }
               }, err => {
                  this.$nextTick(() => {
                     this.list[index].isDefault = false
                     this.$forceUpdate()
                     console.log('err', err, this.list[index])
                  })


        })
      })
    },
    async selectAddress(item) {
      await this.$message.confirm('确定选择此地址作为收获地址吗')
      //携带，然后返回
      this.$store.commit('setDefaultAddress', {
        ...item
      })
      this.backpage()
    },
    async deleteAddress(item) {
      await this.$message.confirm('确定删除此地址吗')
      this.$message.showLoading()
      var {
        code
      } = await this.$http.request('get', '/api/address/customer/delete/' + item.id, {})
      this.$message.hideLoading()
      if (code === 0) {
        this.$message.showToast('删除成功')
        setTimeout(() => {
          this.page.current = 1
          this.getList()
        }, 500)
      }
    },
    async openAddressForm() {
      this.init_area()
      if (this.submitForm.id) {
        this.$message.showLoading()
        var {
          data
        } = await this.$http.request('get', '/api/address/list/detail/' + this.submitForm.id, {})
               })
            })
         },
         async selectAddress(item) {
            await this.$message.confirm('确定选择此地址作为收货地址吗')
            //携带，然后返回
            this.$store.commit('setDefaultAddress', {
               ...item
            })
            this.backpage()
         },
         async deleteAddress(item) {
            await this.$message.confirm('确定删除此地址吗')
            this.$message.showLoading()
            var {
               code
            } = await this.$http.request('get', '/api/address/delete?id=' + item.id, {})
            this.$message.hideLoading()
            if (code === 0) {
               this.$message.showToast('删除成功')
               if (this.address.id === item.id) {
                  //要清空地址了
                  this.$store.commit('setDefaultAddress', {})
               }
               setTimeout(() => {
                  this.page.current = 1
                  this.getList()
               }, 500)
            }
         },
         async openAddressForm() {
            this.init_area()
            if (this.submitForm.id) {
               this.$message.showLoading()
               var {
                  data
               } = await this.$http.request('get', '/api/address/list/detail?id=' + this.submitForm.id, {})


        if (data) {
          this.submitForm = {
            ...this.submitForm,
            ...data
          }
        }
        this.$message.hideLoading()
      } else {
        this.submitForm = {
          name: this.currentInfo && this.currentInfo.nickName || '',
          tel: this.currentInfo && this.currentInfo.tel || '',
          address: '',
          isDefault: false,
          province: '',
          city: '',
          region: '',
        }
      }
               if (data) {
                  this.submitForm = {
                     ...this.submitForm,
                     ...data
                  }
               }
               this.$message.hideLoading()
            } else {
               this.submitForm = {
                  // name: this.currentInfo && this.currentInfo.nickName || '',
                  // tel: this.currentInfo && this.currentInfo.tel || '',
                  name: '',
                  tel: '',
                  address: '',
                  isDefault: false,
                  province: '',
                  city: '',
                  region: '',
               }
            }

      this.$refs.popup_form.open()
            this.$refs.popup_form.open()

    },
    closeAddressForm() {
      this.$refs.popup_form.close()
         },
         closeAddressForm() {
            this.$refs.popup_form.close()

    },
    async saveOrUpdateAddress() {
      if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) {
        this.$message.showToast('字段未填写完整')
        return
      }
      this.$message.showLoading()
      const {
        code
      } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' :
          'edit'), {
        data: this.submitForm
      })
      this.$message.hideLoading()
      if (code === 0) {
        this.$refs.popup_form.close()
        this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功')
         },
         async saveOrUpdateAddress() {
            if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) {
               this.$message.showToast('字段未填写完整')
               return
            }
            this.$message.showLoading()
            const {
               code
            } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' :
               'add'), {
               data: this.submitForm
            })
            this.$message.hideLoading()
            if (code === 0) {
               this.$refs.popup_form.close()
               this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功')
               let tmp = this
               setTimeout(() => {
                  tmp.page.current = 1
                  tmp.refreshList()
               }, 300)
            }
         },

        setTimeout(() => {
          this.page.current = 1
          this.getList()
        }, 300)
      }
    },

  }
}
      }
   }
</script>

<style lang="scss" scoped>
.container-address {
  .popup-address-form {
    background: #FFFFFF;
    border-radius: 16rpx;
    // width: 690rpx;
    height: 882rpx;
    margin-top: 120rpx;
    margin-left: 30rpx;
    margin-right: 30rpx;
    padding: 24rpx 36rpx;
   .container-address {
      .popup-address-form {
         background: #FFFFFF;
         border-radius: 16rpx;
         // width: 690rpx;
         height: 882rpx;
         margin-top: 120rpx;
         margin-left: 30rpx;
         margin-right: 30rpx;
         padding: 24rpx 36rpx;

    .submit {
      margin-top: 30rpx;
         .submit {
            margin-top: 30rpx;

      .form-input {
        height: 36rpx;
        line-height: 36rpx;
      }
    }
  }
            .form-input {
               height: 36rpx;
               line-height: 36rpx;
            }
         }
      }

  .location-each {
    background: #FFFFFF;
    border-radius: 16rpx;
    margin-bottom: 24rpx;
    padding: 36rpx;
      .location-each {
         background: #FFFFFF;
         border-radius: 16rpx;
         margin-bottom: 24rpx;
         padding: 36rpx;

    .name {
      font-size: 32rpx;
      color: #000000;
      line-height: 44rpx;
      text-align: left;
      font-style: normal;
    }
         .name {
            font-size: 32rpx;
            color: #000000;
            line-height: 44rpx;
            text-align: left;
            font-style: normal;
         }

    .tel {
      font-size: 28rpx;
      color: #666666;
      line-height: 40rpx;
      text-align: left;
      font-style: normal;
      padding-top: 4rpx;
      margin-left: 20rpx;
    }
         .tel {
            font-size: 28rpx;
            color: #666666;
            line-height: 40rpx;
            text-align: left;
            font-style: normal;
            padding-top: 4rpx;
            margin-left: 20rpx;
         }

    .address {
      font-size: 24rpx;
      color: #000000;
      line-height: 34rpx;
      text-align: left;
      font-style: normal;
    }
         .address {
            font-size: 24rpx;
            color: #000000;
            line-height: 34rpx;
            text-align: left;
            font-style: normal;
         }

    .desc {
      font-size: 24rpx;
      color: #666666;
      line-height: 34rpx;
      text-align: left;
      font-style: normal;
    }
         .desc {
            font-size: 24rpx;
            color: #666666;
            line-height: 34rpx;
            text-align: left;
            font-style: normal;
         }

    .del {
      // vertical-align: baseline;
      margin-left: auto;
      margin-right: 6rpx;
      margin-top: 4rpx;
    }
         .del {
            // vertical-align: baseline;
            margin-left: auto;
            margin-right: 6rpx;
            margin-top: 4rpx;
         }

    .container-info {
      max-width: 540rpx;
    }
         .container-info {
            max-width: 540rpx;
         }

    .h-line {
      width: 2rpx;
      height: 46rpx;
      background-color: #EEEEEE;
      margin-left: 28rpx;
      margin-right: 24rpx;
    }
         .h-line {
            width: 2rpx;
            height: 46rpx;
            background-color: #EEEEEE;
            margin-left: 28rpx;
            margin-right: 24rpx;
         }

    .v-line {
      width: 638rpx;
      height: 2rpx;
      // border: 2rpx solid #EEEEEE;
      background-color: #EEEEEE;
      margin-top: 24rpx;
      margin-bottom: 24rpx;
    }
         .v-line {
            width: 638rpx;
            height: 2rpx;
            // border: 2rpx solid #EEEEEE;
            background-color: #EEEEEE;
            margin-top: 24rpx;
            margin-bottom: 24rpx;
         }

    .edit {
      // min-width: 80rpx;
      width: fit-content;
      margin-left: auto;
      margin-right: 0rpx;
      display: flex;
      position: relative;
         .edit {
            // min-width: 80rpx;
            width: fit-content;
            margin-left: auto;
            margin-right: 0rpx;
            display: flex;
            position: relative;

      .icon {
        // margin: 0 auto;
        // mar
        margin-left: auto;
        margin-right: auto;
        margin-top: 20rpx;
        display: block;
            .icon {
               // margin: 0 auto;
               // mar
               margin-left: auto;
               margin-right: auto;
               margin-top: 20rpx;
               display: block;

      }
    }
            }
         }

    .edit::before {
      content: " ";
      width: 2rpx;
      height: 46rpx;
      background-color: #EEEEEE;
      position: absolute;
      left: -24rpx;
      top: 20rpx;
    }
  }
}
         .edit::before {
            content: " ";
            width: 2rpx;
            height: 46rpx;
            background-color: #EEEEEE;
            position: absolute;
            left: -24rpx;
            top: 20rpx;
         }
      }
   }
</style>