@@ -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 . s chema,
... newS chema,
{
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 ) // 表单的加载中： ） ； ）
@@ -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