|
|
@ -8,6 +8,7 @@ |
|
|
|
:destroy-on-close="true" |
|
|
|
:destroy-on-close="true" |
|
|
|
:show-close="true" |
|
|
|
:show-close="true" |
|
|
|
:wrapperClosable="true" |
|
|
|
:wrapperClosable="true" |
|
|
|
|
|
|
|
@close="destroyMap" |
|
|
|
> |
|
|
|
> |
|
|
|
<!-- header --> |
|
|
|
<!-- header --> |
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
@ -51,7 +52,7 @@ |
|
|
|
<el-button type="danger" plain>删除</el-button> |
|
|
|
<el-button type="danger" plain>删除</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-dompurify-html="followContent"></div> |
|
|
|
<div>{{ followContent }}</div> |
|
|
|
<div class="flex mt-10px" style="align-items: center"> |
|
|
|
<div class="flex mt-10px" style="align-items: center"> |
|
|
|
<div class="flex" style="color: #666; align-items: center"> |
|
|
|
<div class="flex" style="color: #666; align-items: center"> |
|
|
|
<Icon icon="ep:clock" class="mr-5px" /> |
|
|
|
<Icon icon="ep:clock" class="mr-5px" /> |
|
|
@ -78,7 +79,7 @@ |
|
|
|
<el-button type="danger" plain>删除</el-button> |
|
|
|
<el-button type="danger" plain>删除</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div key="followContent" v-dompurify-html="followContent2"></div> |
|
|
|
<div>{{ followContent2 }}</div> |
|
|
|
<div class="flex mt-10px" style="align-items: center"> |
|
|
|
<div class="flex mt-10px" style="align-items: center"> |
|
|
|
<div class="flex" style="color: #666; align-items: center"> |
|
|
|
<div class="flex" style="color: #666; align-items: center"> |
|
|
|
<Icon icon="ep:clock" class="mr-5px" /> |
|
|
|
<Icon icon="ep:clock" class="mr-5px" /> |
|
|
@ -95,22 +96,11 @@ |
|
|
|
</el-timeline> |
|
|
|
</el-timeline> |
|
|
|
</el-tab-pane> |
|
|
|
</el-tab-pane> |
|
|
|
<el-tab-pane label="详细信息" name="infoDetail"> |
|
|
|
<el-tab-pane label="详细信息" name="infoDetail"> |
|
|
|
<el-descriptions :column="2" border> |
|
|
|
<Descriptions :data="info" :schema="schema" :columns="2" /> |
|
|
|
<el-descriptions-item min-width="150px" label="线索名称">{{ |
|
|
|
<el-checkbox v-model="showSchool" :label="true" @change="handleShowSchool" |
|
|
|
info.name |
|
|
|
>展示场地</el-checkbox |
|
|
|
}}</el-descriptions-item> |
|
|
|
|
|
|
|
<el-descriptions-item min-width="150px" label="联系方式" |
|
|
|
|
|
|
|
>18888888888</el-descriptions-item |
|
|
|
|
|
|
|
> |
|
|
|
> |
|
|
|
<el-descriptions-item min-width="150px" label="线索来源">驾考宝典</el-descriptions-item> |
|
|
|
<div id="dialogMap" class="mt-20px" style="height: 400px; width: 100%"></div> |
|
|
|
<el-descriptions-item min-width="150px" label="意向状态">高意向</el-descriptions-item> |
|
|
|
|
|
|
|
<el-descriptions-item min-width="150px" :span="2" label="诉求" |
|
|
|
|
|
|
|
>这是诉求内容这是诉求内容这是诉求内容这是诉求内容这是诉求内容这是诉求内容这是诉求内容</el-descriptions-item |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<el-descriptions-item min-width="150px" :span="2" label="备注" |
|
|
|
|
|
|
|
>这是备注内容</el-descriptions-item |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
</el-descriptions> |
|
|
|
|
|
|
|
</el-tab-pane> |
|
|
|
</el-tab-pane> |
|
|
|
<el-tab-pane label="操作记录" name="operateRecord"> |
|
|
|
<el-tab-pane label="操作记录" name="operateRecord"> |
|
|
|
<el-timeline> |
|
|
|
<el-timeline> |
|
|
@ -188,10 +178,42 @@ |
|
|
|
|
|
|
|
|
|
|
|
<script setup> |
|
|
|
<script setup> |
|
|
|
import DialogFollow from './DialogFollow.vue' |
|
|
|
import DialogFollow from './DialogFollow.vue' |
|
|
|
|
|
|
|
import ImgFlag from '@/assets/imgs/flag/position_blue.png' |
|
|
|
|
|
|
|
import AMapLoader from '@amap/amap-jsapi-loader' |
|
|
|
const show = ref(false) |
|
|
|
const show = ref(false) |
|
|
|
const info = ref(null) |
|
|
|
const info = ref(null) |
|
|
|
const loading = ref(false) |
|
|
|
const loading = ref(false) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const schema = ref([ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'name', |
|
|
|
|
|
|
|
label: '线索名称' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'contact', |
|
|
|
|
|
|
|
label: '联系方式' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'supplier', |
|
|
|
|
|
|
|
label: '意向状态' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'supplier', |
|
|
|
|
|
|
|
label: '创建时间' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'purchaseCount', |
|
|
|
|
|
|
|
label: '诉求', |
|
|
|
|
|
|
|
span: 2 |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
field: 'remark', |
|
|
|
|
|
|
|
label: '备注', |
|
|
|
|
|
|
|
isEditor: true, |
|
|
|
|
|
|
|
span: 2 |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
]) |
|
|
|
|
|
|
|
|
|
|
|
const followContent = `<p style="color: red;">这是本次跟进的内容。</p><br/><p>我还能放图片,但需要你自己排版:</p><br/><img style="width: 200px;" src="https://q6.itc.cn/images01/20240407/0e6be21aebc847648109304f20370790.jpeg">` |
|
|
|
const followContent = `<p style="color: red;">这是本次跟进的内容。</p><br/><p>我还能放图片,但需要你自己排版:</p><br/><img style="width: 200px;" src="https://q6.itc.cn/images01/20240407/0e6be21aebc847648109304f20370790.jpeg">` |
|
|
|
|
|
|
|
|
|
|
|
const followContent2 = `<p style="color: red;">这是本次跟进的内容。</p>` |
|
|
|
const followContent2 = `<p style="color: red;">这是本次跟进的内容。</p>` |
|
|
@ -211,9 +233,65 @@ const followList = ref([ |
|
|
|
} |
|
|
|
} |
|
|
|
]) |
|
|
|
]) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 地图相关 |
|
|
|
|
|
|
|
const dialogMap = ref(null) |
|
|
|
|
|
|
|
const aMap = ref(null) |
|
|
|
|
|
|
|
|
|
|
|
function open(row) { |
|
|
|
function open(row) { |
|
|
|
info.value = row |
|
|
|
info.value = row |
|
|
|
show.value = true |
|
|
|
show.value = true |
|
|
|
|
|
|
|
if (!dialogMap.value) { |
|
|
|
|
|
|
|
nextTick(() => { |
|
|
|
|
|
|
|
initMap() |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function initMap() { |
|
|
|
|
|
|
|
AMapLoader.load({ |
|
|
|
|
|
|
|
key: '2ffb0e2ea90b1df0b8be48ed66e18fc8', //设置您的key |
|
|
|
|
|
|
|
version: '2.0' |
|
|
|
|
|
|
|
}).then((AMap) => { |
|
|
|
|
|
|
|
aMap.value = AMap |
|
|
|
|
|
|
|
dialogMap.value = new AMap.Map('dialogMap', { |
|
|
|
|
|
|
|
zoom: 12, |
|
|
|
|
|
|
|
zooms: [2, 22], |
|
|
|
|
|
|
|
center: [117.283042, 31.86119] |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const showSchool = ref(false) |
|
|
|
|
|
|
|
const schoolMarkers = ref([]) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function handleShowSchool() { |
|
|
|
|
|
|
|
if (showSchool.value) { |
|
|
|
|
|
|
|
let marker1 = new aMap.value.Marker({ |
|
|
|
|
|
|
|
map: dialogMap.value, |
|
|
|
|
|
|
|
position: [117.258001, 31.895216], |
|
|
|
|
|
|
|
label: { |
|
|
|
|
|
|
|
content: '慧安驾校桃花社区训练基地', |
|
|
|
|
|
|
|
direction: 'left' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
icon: ImgFlag, |
|
|
|
|
|
|
|
// extData: element, |
|
|
|
|
|
|
|
clickable: true |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
let marker2 = new aMap.value.Marker({ |
|
|
|
|
|
|
|
map: dialogMap.value, |
|
|
|
|
|
|
|
position: [117.286731, 31.902396], |
|
|
|
|
|
|
|
label: { |
|
|
|
|
|
|
|
content: '(皖西)瑞星驾校总校(D)', |
|
|
|
|
|
|
|
direction: 'left' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
icon: ImgFlag, |
|
|
|
|
|
|
|
// extData: element, |
|
|
|
|
|
|
|
clickable: true |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
schoolMarkers.value = [marker1, marker2] |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
dialogMap.value.remove(schoolMarkers.value) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const infoIndex = ref('followRecord') |
|
|
|
const infoIndex = ref('followRecord') |
|
|
@ -229,6 +307,11 @@ function addFollow() { |
|
|
|
function updateFollow() { |
|
|
|
function updateFollow() { |
|
|
|
followRef.value.open('update', { nextFollowTime: '2024-04-01 12:12' }) |
|
|
|
followRef.value.open('update', { nextFollowTime: '2024-04-01 12:12' }) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function destroyMap() { |
|
|
|
|
|
|
|
dialogMap.value = null |
|
|
|
|
|
|
|
aMap.value = null |
|
|
|
|
|
|
|
} |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped></style> |
|
|
|
<style lang="scss" scoped></style> |
|
|
|