diff --git a/.env.development b/.env.development index 83cf2831..a61765ea 100644 --- a/.env.development +++ b/.env.development @@ -12,6 +12,7 @@ ENV = 'development' VITE_APP_BASE_API_Url = 'https://aitstest.jlbank.com.cn:7001' + # app入口 #VITE_APP_BASE_API_Url = 'http://25.16.122.65:7001' #VITE_APP_BASE_API_Url = 'http://25.16.122.91:9786' diff --git a/src/common/common.js b/src/common/common.js index 3f621653..0ac01c68 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -121,6 +121,7 @@ export const getUserInfo = (key = '') => { */ export const getPhoneEnvBool = (flag) => { // 获取当前设备的平台信息 + const { platform } = uni.getSystemInfoSync(); // 平台与标识的映射关系 diff --git a/src/common/dialogMessage.js b/src/common/dialogMessage.js new file mode 100644 index 00000000..522b4708 --- /dev/null +++ b/src/common/dialogMessage.js @@ -0,0 +1,223 @@ +export default function showDialog(options) { + const view = new plus.nativeObj.View('customModal', { + top: '0', + left: '0', + height: '100%', + width: '100%', + backgroundColor: 'rgba(0,0,0,0.5)', + position: 'fixed' + }); + + const screenWidth = plus.screen.resolutionWidth; + const screenHeight = plus.screen.resolutionHeight; + const borderRadius = 10; + const contentPadding = 20; // 内容左右内边距 + const lineHeight = 24; // 单行文本行高 + const maxLines = 2; // 最大行数 + const fontSize = 16; // 字体大小 + + // 判断内容和标题是否存在 + const hasContent = options.content && options.content.trim() !== ''; + const hasTitle = options.title && options.title.trim() !== ''; + + // 弹窗宽度计算 + const modalWidth = Math.min(0.8 * screenWidth, 500); + const modalLeft = (screenWidth - modalWidth) / 2; + + // 内容区域可用宽度 + const contentAvailableWidth = modalWidth - 2 * contentPadding - 10; + + // 动态计算各部分高度 + const titleHeight = hasTitle ? 30 : 0; + const titleToContentSpacing = (hasTitle && hasContent) ? 10 : 0; + const contentHeight = hasContent ? (lineHeight * maxLines) : 0; + const contentToBtnSpacing = 10; + const btnHeight = 50; + + // 弹窗总高度 + let modalHeight = contentPadding + titleHeight + titleToContentSpacing + contentHeight + contentToBtnSpacing + btnHeight; + modalHeight = options.showCancel ? Math.min(modalHeight, 300) : Math.min(modalHeight, 250); + + // 位置计算 + const modalTop = (screenHeight - modalHeight) / 2; + const contentAreaTop = modalTop + contentPadding; + const titleTop = hasTitle ? contentAreaTop : 0; + + // Fix: Calculate contentTop properly when there's no content + let contentTop; + if (hasContent) { + contentTop = hasTitle ? (titleTop + titleHeight + titleToContentSpacing) : contentAreaTop; + } else { + contentTop = hasTitle ? (titleTop + titleHeight) : contentAreaTop; + } + + const btnTop = hasContent + ? (contentTop + contentHeight + contentToBtnSpacing) + : (hasTitle + ? (titleTop + titleHeight + contentToBtnSpacing) + : (contentAreaTop + (modalHeight - btnHeight - contentPadding))); // 既无标题也无内容时 + + // 绘制弹窗背景 + view.draw([{ + tag: 'rect', + id: 'bg', + position: { top: modalTop + 'px', left: modalLeft + 'px', width: modalWidth + 'px', height: modalHeight + 'px' }, + rectStyles: { color: '#fff', radius: borderRadius + 'px' } + }]); + + // 绘制标题和内容 + const elements = []; + + // 标题(仅当存在时) + if (hasTitle) { + elements.push({ + tag: 'font', + id: 'title', + text: options.title, + position: { top: titleTop + 'px', left: modalLeft + 'px', width: modalWidth + 'px', height: titleHeight + 'px' }, + textStyles: { + color: '#000', + size: '20px', + align: 'center', + fontWeight: 'bold', + verticalAlign: 'middle' + } + }); + } + if (hasContent) { + const text = options.content; + const maxLines = 2; // 最大显示行数 + const lineHeightPx = lineHeight; + const leftPos = modalLeft + contentPadding; + const textWidth = contentAvailableWidth; + const fontSizePx = fontSize; + + // 按 \n 分割段落 + const paragraphs = text.split('\n'); + let lines = []; + + // 遍历每个段落,计算换行 + for (let para of paragraphs) { + if (lines.length >= maxLines) break; + + // 估算每行能容纳的字符数(中文按 1.2 倍宽度计算) + const avgCharWidth = fontSizePx * (isChinese(para) ? 1.2 : 0.6); + const maxCharsPerLine = Math.floor(textWidth / avgCharWidth); + + let currentLine = ''; + for (let i = 0; i < para.length; i++) { + const char = para[i]; + currentLine += char; + + // 如果当前行字符数超过限制,换行 + if (currentLine.length >= maxCharsPerLine) { + lines.push(currentLine); + currentLine = ''; + + if (lines.length >= maxLines) break; + } + } + + // 添加剩余部分 + if (currentLine && lines.length < maxLines) { + lines.push(currentLine); + } + } + + // 如果超出最大行数,最后一行加 "..." + if (lines.length > maxLines) { + lines = lines.slice(0, maxLines); + const lastLine = lines[maxLines - 1]; + lines[maxLines - 1] = lastLine.substring(0, lastLine.length - 3) + '...'; + } + + // 绘制每一行文本(确保行高正确) + lines.forEach((line, index) => { + const topPos = contentTop + index * lineHeightPx; + + elements.push({ + tag: 'font', + id: 'content_line_' + index, + text: line, + position: { + top: topPos + 'px', + left: leftPos + 'px', + width: textWidth + 'px', + height: lineHeightPx + 'px' + }, + textStyles: { + color: '#666', + size: fontSizePx + 'px', + align: 'center', + verticalAlign: 'top', + lineHeight: lineHeightPx + 'px' + } + }); + }); + } + + // 判断是否主要是中文 + function isChinese(text) { + return /[\u4e00-\u9fa5]/.test(text); + } + + // 分割线 + elements.push({ + tag: 'rect', + id: 'divider', + position: { top: btnTop + 'px', left: modalLeft + 'px', width: modalWidth + 'px', height: '1px' }, + rectStyles: { color: '#b3b3b3' } + }); + + view.draw(elements); + + // 绘制按钮(不变) + if (options.showCancel) { + const btnWidth = Math.floor((modalWidth - 2 * borderRadius) / 2); + view.draw([ + { tag: 'rect', id: 'cancelBtn', position: { top: (btnTop + 2) + 'px', left: (modalLeft + borderRadius) + 'px', width: btnWidth + 'px', height: (btnHeight - 3) + 'px' }, rectStyles: { color: '#fff' } }, + { tag: 'font', id: 'cancelText', text: options.cancelText || '取消', position: { top: btnTop + 'px', left: (modalLeft + borderRadius) + 'px', width: btnWidth + 'px', height: btnHeight + 'px' }, textStyles: { color: '#007AFF', size: '16px', align: 'center', verticalAlign: 'middle' } }, + { tag: 'rect', id: 'btnDivider', position: { top: btnTop + 'px', left: (modalLeft + borderRadius + btnWidth) + 'px', width: '1px', height: btnHeight + 'px' }, rectStyles: { color: '#b3b3b3' } }, + { tag: 'rect', id: 'confirmBtn', position: { top: (btnTop + 2) + 'px', left: (modalLeft + borderRadius + btnWidth + 1) + 'px', width: btnWidth + 'px', height: (btnHeight - 3) + 'px' }, rectStyles: { color: '#fff' } }, + { tag: 'font', id: 'confirmText', text: options.confirmText || '确定', position: { top: btnTop + 'px', left: (modalLeft + borderRadius + btnWidth + 1) + 'px', width: btnWidth + 'px', height: btnHeight + 'px' }, textStyles: { color: '#007AFF', size: '16px', align: 'center', verticalAlign: 'middle' } } + ]); + } else { + view.draw([ + { tag: 'rect', id: 'confirmBtn', position: { top: (btnTop + 2) + 'px', left: (modalLeft + borderRadius) + 'px', width: (modalWidth - 2 * borderRadius) + 'px', height: (btnHeight - 3) + 'px' }, rectStyles: { color: '#fff' } }, + { tag: 'font', id: 'confirmText', text: options.confirmText || '确定', position: { top: btnTop + 'px', left: (modalLeft + borderRadius) + 'px', width: (modalWidth - 2 * borderRadius) + 'px', height: btnHeight + 'px' }, textStyles: { color: '#007AFF', size: '16px', align: 'center', verticalAlign: 'middle' } } + ]); + } + + // 点击事件(不变) + view.addEventListener("click", function(e) { + const x = e.clientX; + const y = e.clientY; + if (options.showCancel) { + const btnWidth = Math.floor((modalWidth - 2 * borderRadius) / 2); + const cancelBtnLeft = modalLeft + borderRadius; + if (y > btnTop && y < btnTop + btnHeight) { + if (x >= cancelBtnLeft && x < cancelBtnLeft + btnWidth) { + options.cancel?.(); + view.close(); + } else if (x >= cancelBtnLeft + btnWidth + 1 && x < cancelBtnLeft + 2 * btnWidth + 1) { + options.success?.({ confirm: true }); + view.close(); + } + } + } else { + const btnLeft = modalLeft + borderRadius; + if (y > btnTop && y < btnTop + btnHeight && x >= btnLeft && x < btnLeft + (modalWidth - 2 * borderRadius)) { + options.success?.({ confirm: true }); + view.close(); + } + } + }, false); + + view.show(); + + return { + close: () => { + view.close(); + } + }; +} \ No newline at end of file diff --git a/src/pages/test/index.vue b/src/pages/test/index.vue index 32432e94..b8eeb68a 100644 --- a/src/pages/test/index.vue +++ b/src/pages/test/index.vue @@ -9,22 +9,63 @@ - + + - + +