elevator/elevator-ui/bak/src/pages/expert/order/not-started.vue

<script setup>
import { getExpertConsultInfoApi } from '@/api/expert'
import { postExpertConsultReceiveApi } from '@/api/expert'
import { useCdn } from '@/composables/use-cdn'
const { cdnUrl } = useCdn('/elevator/2024/11/images')

const noAgreeHandler = () => {
  uni.navigateBack({
    delta: 1
  })
}
const agreeHandler = async () => {
  const { id } = options.value
  const { latitude: lat, longitude: lng } = locations.value
  const { error, result } = await postExpertConsultReceiveApi({
    id,
    // consultType: 3,
    lat,
    lng
  })
  if (error) {
    return uni.$u.toast(result.msg)
  }
  uni.$u.toast('接单成功')
  setTimeout(() => {
    uni.navigateBack({
      delta: 1
    })
  }, 1500)
}
const options = ref({})
onLoad(async (e) => {
  options.value = e
})

const locations = ref({
  latitude: 30.59276,
  longitude: 114.30525
})
const getLocation = () => {
  uni.getLocation({
    type: 'gcj02',
    success: ({ latitude, longitude }) => {
      locations.value = {
        latitude,
        longitude
      }
    }
  })
}
onMounted(() => {
  getLocation()
})

const dataDetail = ref({})
const getWorkDataInfo = async () => {
  const { error, data } = await getExpertConsultInfoApi(options.value)
  if (!error) {
    dataDetail.value = data
  }
}
onMounted(() => {
  getWorkDataInfo()
})

const marker = ref({
  id: 1,
  latitude: 30.59276,
  longitude: 114.30525,
  iconPath: `${cdnUrl}/position.png`,
  width: 35,
  height: 35,
  callout: {
    height: 50,
    padding: 5,
    fontSize: 20,
    borderWidth: 1,
    borderRadius: 10,
    bgColor: '#ffffff',
    display: 'ALWAYS',
    textAlign: 'center',
    anchorX: 0,
    anchorY: 0,
    content: ''
  }
})
watchEffect(() => {
  const { latitude, longitude } = locations.value
  marker.value.latitude = latitude
  marker.value.longitude = longitude

  const { elevatorName } = dataDetail.value
  marker.value.callout.content = elevatorName
})
</script>

<template>
  <view w-full h-100vh relative bg="#FFFFFF">
    <map
      id="map"
      class="map"
      style="width: 100%; height: 100%"
      :markers="[marker]"
      :show-location="true"
      :latitude="locations.latitude"
      :longitude="locations.longitude"
    ></map>

    <cover-view
      absolute
      w-200
      h-80
      lh-80
      text-center
      bottom-150
      left-80
      rounded-40
      border-solid
      border-1
      border-gray
      bg="#FFF"
      @tap="noAgreeHandler"
    >
      不接单
    </cover-view>
    <cover-view
      absolute
      w-200
      h-80
      lh-80
      text-center
      bottom-150
      rounded-40
      border-solid
      border-1
      border-gray
      bg="#4395D5"
      color="#FFFFFF"
      right-80
      @tap="agreeHandler"
    >
      接单
    </cover-view>
  </view>
</template>