wangchengming/YouKeChuanMei_VUE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

工作台添加跳转链接

Browse Source
This commit is contained in:
wangchengming 2025-09-01 23:00:15 +08:00
parent 0df2319062
commit 3f52daa131
3 changed files with 115 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
src/views/index.vue
View File

@ -3,37 +3,37 @@
<!-- 左侧内容 - 自动宽度 -->
<div class="left-content">
<div class="dashboard-4grid">
<div class="grid-item4">
<div class="grid-item4" @click="handleGoMediaMap">
<img :src="mediaMap" class="custom-icon" />
<div class="grid-title grid-item4-margin">媒体地图</div>
<div class="grid-line"></div>
</div>
<div class="grid-item4">
<div class="grid-item4" @click="handleGoSupplierManage">
<img :src="supplierManage" class="custom-icon" />
<div class="grid-title grid-item4-margin">供应商管理</div>
<div class="grid-line"></div>
</div>
<div class="grid-item4">
<div class="grid-item4" @click="handleGoMediaLibary">
<img :src="mediaLibary" class="custom-icon" />
<div class="grid-title grid-item4-margin">媒体库管理</div>
<div class="grid-line"></div>
</div>
<div class="grid-item4">
<div class="grid-item4" @click="handleGoOutdoorMediaMap">
<img :src="outdoorMediaMap" class="custom-icon" />
<div class="grid-title grid-item4-margin">户外媒介数据</div>
<div class="grid-line"></div>
</div>
</div>
<div class="dashboard-3grid">
<div class="grid-item3 calibrationPlatform">
<div class="grid-item3 calibrationPlatform" @click="handleGoCalibrationPlatform">
<div class="grid-title">校准平台</div>
<div class="grid-sub-title"><span>去使用</span>></div>
</div>
<div class="grid-item3 PPTAnalysisTool">
<div class="grid-item3 PPTAnalysisTool" @click="handleGoPPTAnalysisTool">
<div class="grid-title">PPT分析工具</div>
<div class="grid-sub-title"><span>去使用</span>></div>
</div>
<div class="grid-item3 longitudeConversion">
<div class="grid-item3 longitudeConversion" @click="handleGoLongitudeConversion">
<div class="grid-title">经纬度转换</div>
<div class="grid-sub-title"><span>去使用</span>></div>
</div>
@ -48,7 +48,7 @@
</div>
</div>
<ul class="resource-list" v-if="notices.length > 0">
<li v-for="(notice, index) in notices" :key="index" class="resource-link">
<li v-for="(notice, index) in notices" :key="index" class="resource-link" @click="handleGoSupplierManage">
{{ notice.content }}
</li>
</ul>
@ -68,41 +68,78 @@ import mediaLibary from '@/assets/images/mediaLibary.png'
import outdoorMediaMap from '@/assets/images/outdoorMediaMap.png'
import notic_icon from '@/assets/images/notic-icon.png'
import no_notice from '@/assets/images/no_notice.png'
import { useRouter } from 'vue-router'
import { useBackgroundStore } from '@/store/modules/background'
import bigBackgroud from '@/assets/images/bigBackgroud.png'
const bgStore = useBackgroundStore()
const router = useRouter()
// 初始化
onMounted(() => {
bgStore.setBgImage(bigBackgroud)
});
const notices = ref([
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
// { date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
]);
// 打开媒体地图
const handleGoMediaMap = () => {
// router.push('/pitchPrice')
}
// 打开供应商管理
const handleGoSupplierManage = () => {
router.push('/supplier')
}
// 打开媒体库管理
const handleGoMediaLibary = () => {
router.push('/mediaLibrary')
}
// 打开户外媒介数据
const handleGoOutdoorMediaMap = () => {
router.push('/outdoorMedia')
}
// 打开校准平台
const handleGoCalibrationPlatform = () => {
// router.push('/pitchPrice')
}
// 打开PPT分析工具
const handleGoPPTAnalysisTool = () => {
// router.push('/pitchPrice')
}
// 打开经纬度转换工具
const handleGoLongitudeConversion = () => {
// router.push('/pitchPrice')
}
</script>
<style scoped lang="scss">
.flex-container {
@ -157,6 +194,7 @@ const notices = ref([
background: #ffffffdb;
text-align: center;
padding: 38px 40px;
cursor: pointer;
}
.grid-item4-margin {
@ -169,6 +207,7 @@ const notices = ref([
border-radius: 6px 6px 6px 6px;
background: #ffffffdb;
padding: 40px 9px 7px 40px;
cursor: pointer;
}
.grid-title {
@ -278,5 +317,6 @@ const notices = ref([
.resource-link {
line-height: 28px;
cursor: pointer;
}
</style>

6
src/views/mediaLibrary/index.vue
View File

@ -12,14 +12,14 @@
:value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="媒体大类">
<el-form-item label="媒体大类:">
<el-select v-model="queryParams.mediaTypeTwo" placeholder="请选择"
@change="getMediaTypeThree" clearable style="min-width: 30px">
<el-option v-for="item in mediaTypeTwo" :key="item.id" :label="item.name"
:value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="展示形式">
<el-form-item label="展示形式:">
<el-select v-model="queryParams.mediaTypeThree" placeholder="请选择" clearable
style="min-width: 30px">
<el-option v-for="item in mediaTypeThree" :key="item.id" :label="item.name"
@ -84,7 +84,7 @@
<el-option v-for="item in town" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="商圈">
<el-form-item label="商圈:">
<el-select v-model="queryParams.approval_document_status" placeholder="请选择" clearable
style="min-width: 30px;">
<el-option v-for="dict in approval_document_status" :key="dict.value" :label="dict.label"

83
src/views/outdoorMedia/index.vue
View File

@ -11,14 +11,14 @@
:value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="媒体大类">
<el-form-item label="媒体大类:">
<el-select v-model="queryParams.mediaTypeTwo" placeholder="请选择" @change="getMediaTypeThree"
clearable style="min-width: 30px">
<el-option v-for="item in mediaTypeTwo" :key="item.id" :label="item.name"
:value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="展示形式">
<el-form-item label="展示形式:">
<el-select v-model="queryParams.mediaTypeThree" placeholder="请选择" clearable
style="min-width: 30px">
<el-option v-for="item in mediaTypeThree" :key="item.id" :label="item.name"
@ -62,7 +62,7 @@
<el-option v-for="item in town" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="商圈">
<el-form-item label="商圈:">
<el-select v-model="queryParams.approval_document_status" placeholder="请选择" clearable
style="min-width: 30px;">
<el-option v-for="dict in approval_document_status" :key="dict.value" :label="dict.label"
@ -134,7 +134,7 @@
v-hasPermi="['problemFeedback:edit']">查看
</div>
<div class="popBtns" @click="handleDownFiles(scope.row)"
v-hasPermi="['problemFeedback:edit']">下载</div>
v-hasPermi="['problemFeedback:edit']">下载PPT</div>
<template #reference>
<img style="cursor: pointer;" :src="scope.row.currentImageSrc"
@mouseenter="scope.row.currentImageSrc = hoverImageSrc"
@ -367,13 +367,6 @@ const addCustomControls = (AMap) => {
// 创建控件容器
const controlContainer = document.createElement('div');
controlContainer.className = 'custom-map-controls';
controlContainer.style.position = 'absolute';
controlContainer.style.top = '20px';
controlContainer.style.right = '20px';
controlContainer.style.zIndex = '1000';
controlContainer.style.display = 'flex';
controlContainer.style.gap = '10px';
controlContainer.style.flexDirection = 'column';
// 2D/3D切换按钮
const toggle2D3DBtn = document.createElement('div');
@ -511,26 +504,28 @@ const renderMassMarks = () => {
// 创建三种不同大小的样式
const styles = [
// 优势媒体颜色-红色
{
url: createPointStyle('#EC1B60', 18, 'circle').toDataURL(),
anchor: new AMap.Pixel(18, 18),
size: new AMap.Size(18, 18)
},
// 网络媒体颜色-蓝色
{
url: createPointStyle('#058DED', 18, 'circle').toDataURL(),
anchor: new AMap.Pixel(18, 18),
size: new AMap.Size(18, 18)
},
{
url: createPointStyle('#FFA200', 18, 'circle').toDataURL(),
anchor: new AMap.Pixel(18, 18),
size: new AMap.Size(18, 18)
},
{
url: createPointStyle('#00C272', 18, 'circle').toDataURL(),
anchor: new AMap.Pixel(18, 18),
size: new AMap.Size(18, 18)
}
// {
// url: createPointStyle('#FFA200', 18, 'circle').toDataURL(),
// anchor: new AMap.Pixel(18, 18),
// size: new AMap.Size(18, 18)
// },
// {
// url: createPointStyle('#00C272', 18, 'circle').toDataURL(),
// anchor: new AMap.Pixel(18, 18),
// size: new AMap.Size(18, 18)
// }
];
// 测试数据
@ -540,26 +535,26 @@ const renderMassMarks = () => {
{ "lnglat": [116.366794, 39.915309], "name": "西城区", "style": 1 },
{ "lnglat": [116.486409, 39.921489], "name": "朝阳区", "style": 1 },
{ "lnglat": [116.286968, 39.863642], "name": "丰台区", "style": 1 },
{ "lnglat": [116.195445, 39.914601], "name": "石景山区", "style": 2 },
{ "lnglat": [116.310316, 39.956074], "name": "海淀区", "style": 2 },
{ "lnglat": [116.105381, 39.937183], "name": "门头沟区", "style": 2 },
{ "lnglat": [116.139157, 39.735535], "name": "房山区", "style": 2 },
{ "lnglat": [116.658603, 39.902486], "name": "通州区", "style": 2 },
{ "lnglat": [116.653525, 40.128936], "name": "顺义区", "style": 2 },
{ "lnglat": [116.235906, 40.218085], "name": "昌平区", "style": 2 },
{ "lnglat": [116.338033, 39.728908], "name": "大兴区", "style": 2 },
{ "lnglat": [116.637122, 40.324272], "name": "怀柔区", "style": 2 },
{ "lnglat": [117.112335, 40.144783], "name": "平谷区", "style": 3 },
{ "lnglat": [116.843352, 40.377362], "name": "密云区", "style": 3 },
{ "lnglat": [115.985006, 40.465325], "name": "延庆区", "style": 3 },
{ "lnglat": [113.56925, 22.136546], "name": "路凼填海区", "style": 3 },
{ "lnglat": [117.195907, 39.118327], "name": "和平区", "style": 2 },
{ "lnglat": [117.226568, 39.122125], "name": "河东区", "style": 2 },
{ "lnglat": [117.217536, 39.101897], "name": "河西区", "style": 2 },
{ "lnglat": [117.164143, 39.120474], "name": "南开区", "style": 2 },
{ "lnglat": [117.201569, 39.156632], "name": "河北区", "style": 2 },
{ "lnglat": [117.163301, 39.175066], "name": "红桥区", "style": 2 },
{ "lnglat": [117.313967, 39.087764], "name": "东丽区", "style": 2 },
{ "lnglat": [116.195445, 39.914601], "name": "石景山区", "style": 1 },
{ "lnglat": [116.310316, 39.956074], "name": "海淀区", "style": 1 },
{ "lnglat": [116.105381, 39.937183], "name": "门头沟区", "style": 0 },
{ "lnglat": [116.139157, 39.735535], "name": "房山区", "style": 0 },
{ "lnglat": [116.658603, 39.902486], "name": "通州区", "style": 0 },
{ "lnglat": [116.653525, 40.128936], "name": "顺义区", "style": 0 },
{ "lnglat": [116.235906, 40.218085], "name": "昌平区", "style": 0 },
{ "lnglat": [116.338033, 39.728908], "name": "大兴区", "style": 0 },
{ "lnglat": [116.637122, 40.324272], "name": "怀柔区", "style": 0 },
{ "lnglat": [117.112335, 40.144783], "name": "平谷区", "style": 0 },
{ "lnglat": [116.843352, 40.377362], "name": "密云区", "style": 0 },
{ "lnglat": [115.985006, 40.465325], "name": "延庆区", "style": 1 },
{ "lnglat": [113.56925, 22.136546], "name": "路凼填海区", "style": 1 },
{ "lnglat": [117.195907, 39.118327], "name": "和平区", "style": 1 },
{ "lnglat": [117.226568, 39.122125], "name": "河东区", "style": 1 },
{ "lnglat": [117.217536, 39.101897], "name": "河西区", "style": 1 },
{ "lnglat": [117.164143, 39.120474], "name": "南开区", "style": 1 },
{ "lnglat": [117.201569, 39.156632], "name": "河北区", "style": 0 },
{ "lnglat": [117.163301, 39.175066], "name": "红桥区", "style": 1 },
{ "lnglat": [117.313967, 39.087764], "name": "东丽区", "style": 0 },
{ "lnglat": [117.012247, 39.139446], "name": "西青区", "style": 0 },
{ "lnglat": [117.382549, 38.989577], "name": "津南区", "style": 0 },
{ "lnglat": [117.13482, 39.225555], "name": "北辰区", "style": 0 },
@ -620,12 +615,12 @@ onMounted(() => {
.custom-map-controls {
position: absolute;
top: 10px;
right: 10px;
top: 5px;
right: 5px;
z-index: 1000;
display: flex;
flex-direction: column;
gap: 10px;
gap: 0px;
}
.map-control-btn {