public-fuse/src/view/newFireCase/newdispatch/editCrimical.vue

<template>
  <el-form ref="form" label-width="84px">
    <!-- {{ bindExample }} -->
    <el-form-item label="案件名称">
      <el-input v-model="bindExample.caseTitle" maxlength="50" placeholder="请输入案件名称" />
    </el-form-item>
    <el-form-item label="详细地址">
      <el-input v-model="bindExample.mapUrl" placeholder="输入名称搜索" clearable disabled>
        <template #append>
          <el-button :icon="Search" @click="searchAMapAddress" />
        </template>
      </el-input>
    </el-form-item>
    <el-form-item label="首页显示">
      <el-switch v-model="bindExample.mapShow" :disabled="!bindExample.latAndLong" />
    </el-form-item>
  </el-form>
  <!-- 地图弹窗（使用与 basicInfo.vue 相同的 creatMap 组件） -->
  <creatMap v-model="showMapDialog" :caseId="bindExample.caseId" @confirm="handleMapConfirm" />
</template>

<script setup lang="ts">
import { ref } from "vue";
import { Example, setExample, addExample } from "@/app/criminal/store/example";
import { ElMessage } from "element-plus";
import { QuiskExpose } from "@/helper/mount";
import { Search } from "@element-plus/icons-vue";
import creatMap from "../newFireDetails/components/creatMap.vue";

const props = defineProps<{ example?: Example }>();
const bindExample = ref<Example>(props.example ? { ...props.example } : ({} as Example));
const showMapDialog = ref(false);

defineExpose<QuiskExpose>({
  async submit() {
    if (!bindExample.value.caseTitle || !bindExample.value.caseTitle.trim()) {
      ElMessage.error("案件名称不能为空");
      throw "案件名称不能为空";
    } else if (!bindExample.value.latAndLong || !bindExample.value.latAndLong.trim()) {
      ElMessage.error("详细地址不能为空");
      throw "详细地址不能为空！";
    }
    await (bindExample.value.caseId
      ? setExample(bindExample.value)
      : addExample(bindExample.value));
  },
});


// 打开地图弹窗（与 basicInfo.vue 保持一致）
const searchAMapAddress = () => {
  showMapDialog.value = true;
};

// 处理地图选择确认，更新地址与经纬度
const handleMapConfirm = (locationInfo: any) => {
  const { cityname, adname, address, name, location } = locationInfo || {};
  // 更新展示地址
  bindExample.value.mapUrl = `${cityname || ''}${adname || ''}${address || ''}${name || ''}`;
  // 更新经纬度
  if (location && typeof location.lat === 'number' && typeof location.lng === 'number') {
    bindExample.value.latlng = bindExample.value.latAndLong = `${location.lat},${location.lng}`;
  }
  showMapDialog.value = false;
};
</script>