|
|
|
|
@ -1,6 +1,6 @@ |
|
|
|
|
<template> |
|
|
|
|
<Dialog :title="dialogTitle" v-model="dialogVisible" width="800px" @close="destroyMap"> |
|
|
|
|
<el-tabs v-model="tabName"> |
|
|
|
|
<el-tabs v-model="tabName" @tab-change="changeTab"> |
|
|
|
|
<el-tab-pane label="线索信息" name="info"> |
|
|
|
|
<Form ref="formRef" v-loading="formLoading" :rules="rules" isCol :schema="formSchema" /> |
|
|
|
|
</el-tab-pane> |
|
|
|
|
@ -41,6 +41,8 @@ |
|
|
|
|
<template #default="{ row }"> |
|
|
|
|
<el-input |
|
|
|
|
v-model="row.content" |
|
|
|
|
type="textarea" |
|
|
|
|
:autoSize="{ minRows: 2 }" |
|
|
|
|
placeholder="输入跟进内容" |
|
|
|
|
:disabled="!row.editable" |
|
|
|
|
/> |
|
|
|
|
@ -60,18 +62,15 @@ |
|
|
|
|
</el-tab-pane> |
|
|
|
|
<el-tab-pane v-if="appStore.getAppInfo?.instanceType == 1" label="位置信息" name="map"> |
|
|
|
|
<div class="flex justify-between items-center"> |
|
|
|
|
<el-select |
|
|
|
|
<el-autocomplete |
|
|
|
|
v-model="areaValue" |
|
|
|
|
filterable |
|
|
|
|
clearable |
|
|
|
|
remote |
|
|
|
|
style="width: 250px" |
|
|
|
|
reserve-keyword |
|
|
|
|
placeholder="输入并搜索位置" |
|
|
|
|
:remote-method="remoteMethod" |
|
|
|
|
@change="currentSelect" |
|
|
|
|
:fetch-suggestions="remoteMethod" |
|
|
|
|
@select="currentSelect" |
|
|
|
|
> |
|
|
|
|
<el-option |
|
|
|
|
<!-- <el-option |
|
|
|
|
v-for="item in areaList" |
|
|
|
|
:key="item.id" |
|
|
|
|
:label="item.name" |
|
|
|
|
@ -80,8 +79,8 @@ |
|
|
|
|
> |
|
|
|
|
<span style="float: left">{{ item.name }}</span> |
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.district }}</span> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-option> --> |
|
|
|
|
</el-autocomplete> |
|
|
|
|
<div class="flex-1 flex items-center ml-10px mr-10px"> |
|
|
|
|
<div class="w-100px">线索位置：</div> |
|
|
|
|
<el-input v-model="address" disabled placeholder="请输入线索位置" clearable /> |
|
|
|
|
@ -119,18 +118,17 @@ |
|
|
|
|
</el-collapse> |
|
|
|
|
</el-tab-pane> |
|
|
|
|
</el-tabs> |
|
|
|
|
<div style="position: absolute; top: 75px; right: 20px"> |
|
|
|
|
<el-button @click="dialogVisible = false">取 消</el-button> |
|
|
|
|
<el-button :disabled="formLoading" type="primary" @click="handleSave">保 存</el-button> |
|
|
|
|
</div> |
|
|
|
|
<DialogSchoolInfo ref="schoolInfoDialog" /> |
|
|
|
|
<template #footer> |
|
|
|
|
<span> |
|
|
|
|
<el-button @click="dialogVisible = false">取 消</el-button> |
|
|
|
|
<el-button :disabled="formLoading" type="primary" @click="handleSave">保 存</el-button> |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
</Dialog> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script setup name="DialogClue"> |
|
|
|
|
import { useAppStore } from '@/store/modules/app' |
|
|
|
|
import { useUserStore } from '@/store/modules/user' |
|
|
|
|
import { getPlaceList } from '@/api/school/place' |
|
|
|
|
import * as ClueApi from '@/api/clue' |
|
|
|
|
import { getDiyFieldList } from '@/api/clue/clueField' |
|
|
|
|
@ -139,7 +137,7 @@ import AMapLoader from '@amap/amap-jsapi-loader' |
|
|
|
|
|
|
|
|
|
import DialogSchoolInfo from './DialogSchoolInfo.vue' |
|
|
|
|
|
|
|
|
|
import ImgPostion from '@/assets/imgs/flag/position_blue.png' |
|
|
|
|
import ImgPostion from '@/assets/imgs/flag/position_black.png' |
|
|
|
|
import FlagRed from '@/assets/imgs/flag/flag_red.png' |
|
|
|
|
import FlagYellow from '@/assets/imgs/flag/flag_yellow.png' |
|
|
|
|
import FlagPurple from '@/assets/imgs/flag/flag_purple.png' |
|
|
|
|
@ -148,7 +146,6 @@ import FlagBlue from '@/assets/imgs/flag/flag_blue.png' |
|
|
|
|
import FlagBlack from '@/assets/imgs/flag/flag_black.png' |
|
|
|
|
|
|
|
|
|
const message = useMessage() // 消息弹窗 |
|
|
|
|
const { t } = useI18n() // 国际化 |
|
|
|
|
const appStore = useAppStore() |
|
|
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
|
|
@ -161,8 +158,14 @@ const props = defineProps({ |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
const formSchema = computed(() => { |
|
|
|
|
const newSchema = [...props.schema] |
|
|
|
|
newSchema.forEach((it) => { |
|
|
|
|
if (it.field == 'consultTime') { |
|
|
|
|
it.componentProps['disabled-date'] = dateAfterToday |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
return [ |
|
|
|
|
...props.schema, |
|
|
|
|
...newSchema, |
|
|
|
|
{ |
|
|
|
|
component: 'Input', |
|
|
|
|
label: '诉求', |
|
|
|
|
@ -185,6 +188,10 @@ const formSchema = computed(() => { |
|
|
|
|
] |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
const dateAfterToday = (t) => { |
|
|
|
|
return t.getTime() > Date.now() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const dialogVisible = ref(false) // 弹窗的是否展示 |
|
|
|
|
const dialogTitle = ref('') // 弹窗的标题 |
|
|
|
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 |
|
|
|
|
@ -204,7 +211,6 @@ const tabName = ref('info') |
|
|
|
|
const followList = ref([]) |
|
|
|
|
|
|
|
|
|
const areaValue = ref('') |
|
|
|
|
const areaList = ref([]) |
|
|
|
|
const address = ref('') |
|
|
|
|
const defaultLatLng = ref({ |
|
|
|
|
lat: 31.86119, |
|
|
|
|
@ -235,36 +241,54 @@ const open = async (type, id) => { |
|
|
|
|
formLoading.value = false |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
followList.value = [] |
|
|
|
|
followList.value = [ |
|
|
|
|
{ |
|
|
|
|
userId: useUserStore().getUser.id, |
|
|
|
|
content: undefined, |
|
|
|
|
nextFollowTime: formatDate(new Date()), |
|
|
|
|
editable: true |
|
|
|
|
} |
|
|
|
|
] |
|
|
|
|
address.value = '' |
|
|
|
|
defaultLatLng.value = { |
|
|
|
|
lat: 31.86119, |
|
|
|
|
lng: 117.283042 |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if (appStore.getAppInfo?.instanceType == 1 && !dialogMap.value) { |
|
|
|
|
nextTick(async () => { |
|
|
|
|
await getSchoolPlace() |
|
|
|
|
initMap(info.value) |
|
|
|
|
remoteMethod(address.value) |
|
|
|
|
nextTick(() => { |
|
|
|
|
formRef.value.setValues(info.value) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function changeTab() { |
|
|
|
|
if (tabName.value == 'map') { |
|
|
|
|
if (!dialogMap.value) { |
|
|
|
|
nextTick(async () => { |
|
|
|
|
await getSchoolPlace() |
|
|
|
|
initMap(info.value) |
|
|
|
|
// remoteMethod(address.value) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
destroyMap() |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗 |
|
|
|
|
|
|
|
|
|
function resetForm() { |
|
|
|
|
info.value.address = undefined |
|
|
|
|
info.value.lat = undefined |
|
|
|
|
info.value.lng = undefined |
|
|
|
|
info.value.consultTime = formatDate(new Date()) |
|
|
|
|
info.value.followUsers = [] |
|
|
|
|
info.value.diyParams = {} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const placeList = ref([]) |
|
|
|
|
async function getSchoolPlace() { |
|
|
|
|
const data = await getPlaceList() |
|
|
|
|
placeList.value = data.placeList.filter((it) => it.status == 0 && it.schoolStatus == 0) |
|
|
|
|
const data = await getPlaceList({ placeStatus: 0 }) |
|
|
|
|
placeList.value = data.placeList |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const emit = defineEmits(['success']) |
|
|
|
|
@ -274,7 +298,7 @@ async function handleSave() { |
|
|
|
|
if (!formRef.value) return |
|
|
|
|
const valid = await formRef.value.getElFormRef().validate() |
|
|
|
|
if (!valid) return |
|
|
|
|
if (!followList.value && followList.value.length == 0) { |
|
|
|
|
if (!followList.value || followList.value.length == 0) { |
|
|
|
|
message.info('请添加跟进人') |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
@ -303,11 +327,11 @@ async function handleSave() { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if (formType.value === 'create') { |
|
|
|
|
await ClueApi.createClue(params) |
|
|
|
|
message.success(t('common.createSuccess')) |
|
|
|
|
const data = await ClueApi.createClue(params) |
|
|
|
|
message.success(data) |
|
|
|
|
} else { |
|
|
|
|
await ClueApi.updateClue(params) |
|
|
|
|
message.success(t('common.updateSuccess')) |
|
|
|
|
const data = await ClueApi.updateClue(params) |
|
|
|
|
message.success(data) |
|
|
|
|
} |
|
|
|
|
dialogVisible.value = false |
|
|
|
|
// 发送操作成功的事件 |
|
|
|
|
@ -353,11 +377,9 @@ function initMap(data) { |
|
|
|
|
zooms: [2, 22], |
|
|
|
|
center: [defaultLatLng.value.lng, defaultLatLng.value.lat] |
|
|
|
|
}) |
|
|
|
|
if (data.lng || data.lat) { |
|
|
|
|
addmark(data.lng, data.lat, AMap) |
|
|
|
|
} |
|
|
|
|
addmark(defaultLatLng.value.lng, defaultLatLng.value.lat, AMap) |
|
|
|
|
AutoComplete.value = new AMap.AutoComplete({ |
|
|
|
|
city: '全国' |
|
|
|
|
city: '合肥' |
|
|
|
|
}) |
|
|
|
|
geoCoder.value = new AMap.Geocoder() |
|
|
|
|
dialogMap.value.on('click', (e) => { |
|
|
|
|
@ -459,7 +481,8 @@ function addmark(lat, lng, AMap) { |
|
|
|
|
marker.value = new AMap.Marker({ |
|
|
|
|
position: new AMap.LngLat(lat, lng), |
|
|
|
|
zoom: 13, |
|
|
|
|
icon: ImgPostion |
|
|
|
|
icon: ImgPostion, |
|
|
|
|
offset: [-16, -32] |
|
|
|
|
}) |
|
|
|
|
dialogMap.value.add(marker.value) |
|
|
|
|
dialogMap.value.setCenter([lat, lng], '', 500) |
|
|
|
|
@ -508,28 +531,34 @@ function showSchoolInfo(val) { |
|
|
|
|
schoolInfoDialog.value.open(val) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function remoteMethod(searchValue) { |
|
|
|
|
if (searchValue !== '') { |
|
|
|
|
setTimeout(() => { |
|
|
|
|
AutoComplete.value?.search(searchValue, (status, result) => { |
|
|
|
|
if (result.tips?.length) { |
|
|
|
|
areaList.value = result?.tips |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, 200) |
|
|
|
|
function remoteMethod(searchValue, cb) { |
|
|
|
|
if (searchValue) { |
|
|
|
|
AutoComplete.value?.search(searchValue, (status, result) => { |
|
|
|
|
if (result.tips?.length) { |
|
|
|
|
// areaList.value = result?.tips |
|
|
|
|
const list = result.tips.map((it) => ({ |
|
|
|
|
...it, |
|
|
|
|
value: it.name |
|
|
|
|
})) |
|
|
|
|
cb(list) |
|
|
|
|
} else { |
|
|
|
|
cb([]) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
cb([]) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function currentSelect(val) { |
|
|
|
|
const area = areaList.value.find((it) => it.name == val) |
|
|
|
|
if (area) { |
|
|
|
|
if (val) { |
|
|
|
|
defaultLatLng.value = { |
|
|
|
|
lng: area.location?.lng, |
|
|
|
|
lat: area.location?.lat |
|
|
|
|
lng: val.location?.lng, |
|
|
|
|
lat: val.location?.lat |
|
|
|
|
} |
|
|
|
|
addmark(area.location?.lng, area.location?.lat, aMap.value) |
|
|
|
|
dialogMap.value.setCenter([area.location?.lng, area.location?.lat], '', 500) |
|
|
|
|
regeoCode(area.location?.lng, area.location?.lat) |
|
|
|
|
addmark(val.location?.lng, val.location?.lat, aMap.value) |
|
|
|
|
dialogMap.value.setCenter([val.location?.lng, val.location?.lat], '', 500) |
|
|
|
|
regeoCode(val.location?.lng, val.location?.lat) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
qsh
5 months ago