From f749e99fb77398475f429b47c30ea8479aef73f4 Mon Sep 17 00:00:00 2001 From: Wangwei <870653736@qq.com> Date: Sun, 7 May 2023 22:37:01 +0800 Subject: [PATCH 1/3] =?UTF-8?q?feat=20=E5=B9=BF=E5=91=8A=E4=BD=8D=E5=AF=B9?= =?UTF-8?q?=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 +- src/components/banner.vue | 541 +++++++++--------- src/router.js | 6 +- src/utils/advertisementSDK.js | 151 +++++ src/views/studypath/finebi.vue | 19 +- .../studypath/finereportStudyPath2023.vue | 21 +- src/views/studypath/jiandaoyun.vue | 19 +- src/views/video/indexVideo.vue | 3 +- 8 files changed, 422 insertions(+), 341 deletions(-) create mode 100644 src/utils/advertisementSDK.js diff --git a/package.json b/package.json index 44c63aa..1dc687a 100644 --- a/package.json +++ b/package.json @@ -54,7 +54,8 @@ "parser": "babel-eslint" }, "rules": { - "no-undef": "off" + "no-undef": "off", + "no-unused-vars": "off" } }, "browserslist": [ diff --git a/src/components/banner.vue b/src/components/banner.vue index 7fddd85..18e83d8 100644 --- a/src/components/banner.vue +++ b/src/components/banner.vue @@ -1,25 +1,24 @@ \ No newline at end of file +} + diff --git a/src/router.js b/src/router.js index f1ebc1f..61bcf46 100644 --- a/src/router.js +++ b/src/router.js @@ -2,7 +2,7 @@ import { createRouter, createWebHistory } from 'vue-router'; import Layout from '@/layout/index.vue'; import store from '@/store'; import { refreshToken } from '@/api/auth'; -// import '@/utils/fineClubSDK'; +import '@/utils/advertisementSDK'; import { getUid, getExpiresTime } from '@/utils/cookie'; import { delUrlParams } from '@/utils/urlQuery'; @@ -350,6 +350,10 @@ const router = createRouter({ }, }); +// 接入广告配置 +let getAdEnv = process.env.VUE_APP_ENV == 'dist' ? false : true; +window.fineAd.config({debug:getAdEnv,dev:getAdEnv}); + // 通过导航守卫 判断并刷新token let accessToken = store.getters.get_token; let expires = getExpiresTime(); diff --git a/src/utils/advertisementSDK.js b/src/utils/advertisementSDK.js new file mode 100644 index 0000000..0e33b62 --- /dev/null +++ b/src/utils/advertisementSDK.js @@ -0,0 +1,151 @@ +/** + * 广告调用SDK + * 2023-04-11 by Wangwei + */ + +import axios from "axios"; +const fineAd = (window.fineAd = window.fineAd || {}); +fineAd.options = fineAd.options || {}; + + /** + * 初始化SDK配置 + * @param debug + * @param dev + * @param adApiUrl + */ +const config = ({ debug = false, dev = false, adApiUrl }) => { + fineAd.options = { + ...fineAd.options, + debug, + dev, + adApiUrl: dev ? 'https://testjdy.fanruan.com/fcoin' : 'https://home.fanruan.com/fcoin', + }; + if(debug){ + console.log('adApiUrl', fineAd.config.adApiUrl); + } +}; + + +/** + * 获取并展示指定广告id的广告位 + * @param adId 广告位id + * @param adId2 如果adId没有匹配到则显示第二个广告位 + * @param top 顶边距 + * @param bottom 底边距 + */ +const getAdvertisement = async ({adId, adId2, top, bottom}) => { + const { debug, dev } = fineAd.options; + const dataPath = dev ? 'test' : 'prod'; + await axios.get("https://shequ-oss.obs.cn-east-2.myhuaweicloud.com/digit/ad/data/" + dataPath + "/advertisement.json?v=" + Date.now()) + .then(function (res) { + var isAdId = false; + res.data.forEach((item) => { + if(item.adId === adId){ + isAdId = true; + let getSize = splitPicSize(item.picSize); + if(debug){ + console.group("advertisement " + adId); + console.log('item',item); + console.log('picSize',getSize); + console.log('top',top); + console.log('bottom',bottom); + console.groupEnd(); + } + let adDomId = document.getElementById('AD-' + adId); + adDomId.innerHTML=''; + window.fineAd.adMargin({ adId:adId, top:top }); + // 无链接图片广告 + if(!item.adLink && item.type===1){ + adDomId.innerHTML+=``; + } + // 有链接图片广告 + if(item.adLink && item.type===1){ + adDomId.innerHTML+=``; + } + // 有链接文本广告 + if(item.adLink && item.type===2){ + adDomId.innerHTML+=`${item.adText}`; + } + window.fineAd.adMargin({ adId:adId, bottom:bottom }); + } + }); + + // 找第二个广告位 + if(adId2 && !isAdId){ + res.data.forEach((item) => { + if(item.adId === adId2){ + console.log('isAdId',isAdId); + let getSize = splitPicSize(item.picSize); + if(debug){ + console.group("advertisement " + adId2); + console.log('item',item); + console.log('picSize',getSize); + console.log('top',top); + console.log('bottom',bottom); + console.groupEnd(); + } + let adDomId = document.getElementById('AD-' + adId2); + adDomId.innerHTML=''; + window.fineAd.adMargin({ adId:adId2, top:top }); + // 有链接图片广告 + if(item.adLink && item.type===1){ + adDomId.innerHTML=``; + } + // 有链接文本广告 + if(item.adLink && item.type===2){ + adDomId.innerHTML=`${item.adText}`; + } + window.fineAd.adMargin({ adId:adId2, bottom:bottom }); + } + }); + } + + }) + .catch(function (error) { + console.log('ad error',error); + }); +}; + +/** + * 广告边距 + * @param top 顶边距 + * @param bottom 底边距 + */ +const adMargin = ({ adId, top = 0, bottom = 0 }) => { + let adDomId = document.getElementById('AD-' + adId); + if(top > 0){ + adDomId.innerHTML+=`
`; + }else if(bottom > 0){ + adDomId.innerHTML+=`
`; + } +} + +/** + * 拆分广告位尺寸 + * @param adSize 广告位尺寸 + * @return Array[w,h] 宽和高 + */ +const splitPicSize = (adSize) =>{ + let {w,h} = {w:'',h:''}; + if(adSize){ + let {[0]:w,[1]:h} = adSize.replace(/\s/g,"").split('*'); + return {w,h}; + }else{ + return {w,h}; + } +} + +/** + * 广告位埋点 + * @param adId 广告位id + */ +const advertisementHits = (adId) =>{ + const { adApiUrl } = fineAd.options; + axios.get(adApiUrl + "/api/advertisement/hits/" + adId); +} + +fineAd.config = config; +fineAd.adMargin = adMargin; +fineAd.getAdvertisement = getAdvertisement; +fineAd.advertisementHits = advertisementHits; + diff --git a/src/views/studypath/finebi.vue b/src/views/studypath/finebi.vue index b5ccd73..059b3d3 100644 --- a/src/views/studypath/finebi.vue +++ b/src/views/studypath/finebi.vue @@ -216,11 +216,7 @@ -
- - BI学习路径banner - -
+
@@ -807,7 +803,6 @@ import { reactive, toRefs } from "vue"; import { studentCount } from "@/api/guide"; import { getCourseNum } from "@/api/study"; -import { adurl } from "@/api/ad"; import downMenu from "@/views/studypath/downMenu"; import pathMenu from "@/views/studypath/pathMenu"; export default { @@ -860,17 +855,7 @@ export default { resgetNode(); // 获取广告链接 - const adgetNode = async () => { - const res = await adurl(31); - if (res.code === 200) { - if (res.data.img_url != null) { - state.ad_imgurl = res.data.img_url; - state.ad_clickurl = res.data.click_url; - state.is_ad = true; - } - } - }; - adgetNode(); + window.fineAd.getAdvertisement({ adId: "83346c28538542f6b678220a47e6fee3", top: 24 }); // 获取多少人已完成学习 const resCourseNum = async (pid, tmp) => { diff --git a/src/views/studypath/finereportStudyPath2023.vue b/src/views/studypath/finereportStudyPath2023.vue index 8a4462b..d5e483d 100644 --- a/src/views/studypath/finereportStudyPath2023.vue +++ b/src/views/studypath/finereportStudyPath2023.vue @@ -198,12 +198,7 @@ - -
- - FR学习路径banner - -
+
@@ -654,7 +649,6 @@ - - + + + - - -
- + + + - - - - - + + + + diff --git a/src/views/class/play.vue b/src/views/class/play.vue index 5dd4ddd..3dd5b17 100644 --- a/src/views/class/play.vue +++ b/src/views/class/play.vue @@ -1,17 +1,14 @@ \ No newline at end of file +.el-page-header__left:hover { + color: #0082fc; +} + diff --git a/src/views/studypath/jiandaoyun.vue b/src/views/studypath/jiandaoyun.vue index acb4ddf..e1f4a5f 100644 --- a/src/views/studypath/jiandaoyun.vue +++ b/src/views/studypath/jiandaoyun.vue @@ -77,7 +77,7 @@
了解简道云并完成注册或登录
- 简道云介绍 + 简道云介绍 简道云登录或注册
diff --git a/src/views/video/play.vue b/src/views/video/play.vue index 7508623..5944012 100644 --- a/src/views/video/play.vue +++ b/src/views/video/play.vue @@ -1,19 +1,17 @@ - \ No newline at end of file +} +