first commit
This commit is contained in:
@@ -0,0 +1,72 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
Vue.use(Vuex)
|
||||
const store = new Vuex.Store({
|
||||
state: {
|
||||
siteData:{
|
||||
internalUrl : '',
|
||||
externalUrl : '',
|
||||
apiPath : '',
|
||||
internalTag : false,
|
||||
macauIp:true,
|
||||
internalSSOUrl: '',
|
||||
externalSSOUrl: '',
|
||||
version:'',
|
||||
debugMode: true,
|
||||
mockSSO:false,
|
||||
mockTPD:false,
|
||||
},
|
||||
deviceData:{
|
||||
saveArea: false,
|
||||
statusBarHeight: 0,
|
||||
windowWidth: 375,
|
||||
windowHeight: 0,
|
||||
navBarHeight: 45,
|
||||
menuButtonLeft: 0,
|
||||
menuButtonTop:0,
|
||||
menuButtonHeight:0,
|
||||
},
|
||||
userData:{
|
||||
id: '',
|
||||
employeeNo:'',
|
||||
loginTag:false,
|
||||
propertyData:null,
|
||||
teamData:null,
|
||||
blockData:null,
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
setSiteData(state,data){
|
||||
state.siteData = data;
|
||||
},
|
||||
setDeviceData(state,data){
|
||||
state.deviceData = data;
|
||||
},
|
||||
setUserData(state,data){
|
||||
state.userData = data;
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
setSiteData: ({commit}, data) => {
|
||||
commit('setSiteData', data)
|
||||
},
|
||||
setDeviceData: ({commit}, data) => {
|
||||
commit('setDeviceData', data)
|
||||
},
|
||||
setUserData: ({commit}, data) => {
|
||||
commit('setUserData', data)
|
||||
}
|
||||
},
|
||||
getters: {
|
||||
getSiteData: (state) => {
|
||||
return state.siteData
|
||||
},
|
||||
getDeviceData: (state) => {
|
||||
return state.deviceData
|
||||
},
|
||||
getUserData: (state) => {
|
||||
return state.userData
|
||||
}
|
||||
}
|
||||
})
|
||||
export default store
|
||||
@@ -0,0 +1,212 @@
|
||||
/**
|
||||
* uniapp全局水印插件(支持排除特定页面)
|
||||
*/
|
||||
import store from '@/store/index.js'
|
||||
export default {
|
||||
install(app, options = {}) {
|
||||
// 默认配置
|
||||
const defaultOptions = {
|
||||
defaultContent: 'Cannot get user data',
|
||||
width: 170, // 水印宽度
|
||||
height: 170, // 水印高度
|
||||
fontSize: 16, // 字体大小
|
||||
color: 'rgba(0, 0, 0,0.1)', // 水印字体颜色及透明度
|
||||
rotate: -30, // 旋转角度
|
||||
zIndex: 9999, // 在哪一层
|
||||
salesSupportPaths: ['/salessupport/todoList/todoList','/pages/playerDetail/playerDetail'],
|
||||
};
|
||||
|
||||
const opts = { ...defaultOptions, ...options };
|
||||
let watermarkEl = null;
|
||||
let currentContent = '';
|
||||
|
||||
// 获取当前页面路径
|
||||
function getCurrentPagePath() {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length) {
|
||||
const currentPage = pages[pages.length - 1];
|
||||
return `/${currentPage.route}`;
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
// 检查是否为SaleSupport相关页面
|
||||
function isSalesSupportPathsPage() {
|
||||
const currentPath = getCurrentPagePath();
|
||||
//console.log('[Watermark] Checking path:', currentPath);
|
||||
//console.log('[Watermark] Configured paths:', opts.salesSupportPaths);
|
||||
const isMatch = opts.salesSupportPaths.some(path => {
|
||||
const matches = currentPath.includes(path);
|
||||
//console.log('[Watermark] Path check:', currentPath, 'includes', path, '=', matches);
|
||||
return matches;
|
||||
});
|
||||
//console.log('[Watermark] Final match result:', isMatch);
|
||||
return isMatch;
|
||||
}
|
||||
|
||||
// 创建水印元素
|
||||
function createWatermark(content) {
|
||||
// #ifdef H5
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = opts.width;
|
||||
canvas.height = opts.height;
|
||||
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.rotate(opts.rotate * Math.PI / 180);
|
||||
ctx.font = `${opts.fontSize}px sans-serif`;
|
||||
ctx.fillStyle = opts.color;
|
||||
ctx.textAlign = 'left';
|
||||
ctx.textBaseline = 'middle';
|
||||
ctx.fillText(content, canvas.width / 10, canvas.height / 2);
|
||||
|
||||
return canvas.toDataURL('image/png');
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
// App端使用CSS方式创建水印
|
||||
return `data:image/svg+xml;base64,${btoa(`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="${opts.width}" height="${opts.height}">
|
||||
<text x="50%" y="50%"
|
||||
font-family="sans-serif"
|
||||
font-size="${opts.fontSize}"
|
||||
fill="${opts.color}"
|
||||
text-anchor="middle"
|
||||
dominant-baseline="middle"
|
||||
transform="rotate(${opts.rotate} ${opts.width/2} ${opts.height/2})">
|
||||
${content}
|
||||
</text>
|
||||
</svg>
|
||||
`)}`;
|
||||
// #endif
|
||||
}
|
||||
|
||||
// 更新水印
|
||||
function updateWatermark(force = false) {
|
||||
//console.log('[Watermark] updateWatermark called, force:', force);
|
||||
//console.log('[Watermark] Current page path:', getCurrentPagePath());
|
||||
//console.log('[Watermark] Is sales support page:', isSalesSupportPathsPage());
|
||||
|
||||
if (!isSalesSupportPathsPage()) {
|
||||
// #ifdef H5
|
||||
if (watermarkEl) {
|
||||
watermarkEl.style.display = 'none';
|
||||
//console.log('[Watermark] Hidden watermark (not sales support page)');
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
// App端通过事件通知隐藏水印
|
||||
uni.$emit('watermark-hide');
|
||||
//console.log('[Watermark] Sent watermark-hide event for App');
|
||||
// #endif
|
||||
return;
|
||||
}
|
||||
|
||||
// #ifdef H5
|
||||
// H5端使用DOM方式
|
||||
const userData = uni.getStorageSync('userData');
|
||||
//console.log('[Watermark] User data:', userData);
|
||||
|
||||
const h5Content = !isSalesSupportPathsPage()
|
||||
? opts.defaultContent
|
||||
: (userData && userData.userName && userData.userId ? userData.userId + userData.userName : opts.defaultContent);
|
||||
|
||||
//console.log('[Watermark] H5 content:', h5Content);
|
||||
//console.log('[Watermark] Current content:', currentContent);
|
||||
|
||||
if (!watermarkEl) {
|
||||
//console.log('[Watermark] Creating watermark element for H5');
|
||||
watermarkEl = document.createElement('div');
|
||||
watermarkEl.className = 'global-watermark';
|
||||
watermarkEl.style.cssText = `
|
||||
position: fixed;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
z-index: ${opts.zIndex};
|
||||
font-weight: bold;
|
||||
`;
|
||||
document.body.appendChild(watermarkEl);
|
||||
} else {
|
||||
watermarkEl.style.display = 'block';
|
||||
//console.log('[Watermark] Showing existing watermark element for H5');
|
||||
}
|
||||
|
||||
if (h5Content !== currentContent || force) {
|
||||
currentContent = h5Content;
|
||||
const watermarkUrl = createWatermark(h5Content);
|
||||
//console.log('[Watermark] Generated watermark URL for H5:', watermarkUrl.substring(0, 100) + '...');
|
||||
watermarkEl.style.backgroundImage = `url("${watermarkUrl}")`;
|
||||
//console.log('[Watermark] Applied watermark to H5 element');
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
// App端水印显示逻辑
|
||||
const currentPath = getCurrentPagePath();
|
||||
if (currentPath.includes('/todoList/todoList')||currentPath.includes('/playerDetail/playerDetail')) {
|
||||
//console.log('[Watermark] Path matches todoList, checking user data');
|
||||
|
||||
const userData = uni.getStorageSync('userData');
|
||||
//console.log('[Watermark] User data:', userData);
|
||||
|
||||
// 组合用户名和用户ID作为水印内容
|
||||
const appContent = userData && userData.userName && userData.userId
|
||||
? `${userData.userName} ${userData.userId}`
|
||||
: opts.defaultContent;
|
||||
|
||||
//console.log('[Watermark] App content:', appContent);
|
||||
//console.log('[Watermark] Current content:', currentContent);
|
||||
|
||||
// 总是更新内容并发送事件
|
||||
currentContent = appContent;
|
||||
//console.log('[Watermark] Sending watermark-show event for App with content:', appContent);
|
||||
uni.$emit('watermark-show', appContent);
|
||||
//console.log('[Watermark] Event sent successfully');
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
|
||||
// 初始化路由监听
|
||||
function initRouteWatcher() {
|
||||
// 轮询检查页面变化
|
||||
let lastPagesLength = 0;
|
||||
setInterval(() => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length !== lastPagesLength) {
|
||||
lastPagesLength = pages.length;
|
||||
updateWatermark();
|
||||
}
|
||||
}, 300);
|
||||
}
|
||||
|
||||
// 全局混入
|
||||
app.mixin({
|
||||
onLoad() {
|
||||
this.$nextTick(updateWatermark);
|
||||
},
|
||||
onShow() {
|
||||
updateWatermark();
|
||||
},
|
||||
mounted() {
|
||||
// 监听用户状态变化
|
||||
this.userWatcher = store?.watch(
|
||||
(state) => state.user?.name,
|
||||
() => updateWatermark()
|
||||
);
|
||||
},
|
||||
beforeUnmount() {
|
||||
// 清理监听器
|
||||
if (this.userWatcher) {
|
||||
this.userWatcher();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化
|
||||
initRouteWatcher();
|
||||
setTimeout(updateWatermark, 100);
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user