优化代码

This commit is contained in:
java110 2020-10-18 11:05:39 +08:00
parent e754d954cf
commit bdf652ac26
5 changed files with 147 additions and 48 deletions

View File

@ -6,7 +6,7 @@
// 服务器域名
// const baseUrl = 'https://app.demo.winqi.cn/';
const baseUrl = '/';
const hcBaseUrl = 'https://hc.demo.winqi.cn'; // 登录接口
const hcBaseUrl = '/'; // 登录接口
const loginUrl = baseUrl + 'app/loginProperty';
const areaUrl = baseUrl + "app/area.listAreas";

View File

@ -1,5 +1,5 @@
const baseUrl = '/';
const hcBaseUrl = 'https://hc.demo.winqi.cn'; // 登录接口
const hcBaseUrl = '/'; // 登录接口
export default {
baseUrl: baseUrl,
hcBaseUrl: hcBaseUrl, // 登录接口

View File

@ -1,21 +1,21 @@
<template>
<view class="user-container">
<view class="flex-sub text-center bg-white">
<view class="solid-bottom text-xl padding">
<text class="text-black text-bold">{{notice.title}}</text>
<view class="user-container">
<view class="flex-sub text-center bg-white">
<view class="solid-bottom text-xl padding">
<text class="text-black text-bold">{{notice.title}}</text>
</view>
<view class="footer">时间: {{notice.timeStr}}</view>
</view>
<view class="footer">时间: {{notice.timeStr}}</view>
</view>
<view class="flex-sub bg-white">
<view class="content">
<rich-text class="solid-bottom text-df padding" :nodes="notice.context"></rich-text>
<view class="flex-sub bg-white">
<view class="content">
<rich-text class="solid-bottom text-df padding" :nodes="notice.context"></rich-text>
</view>
</view>
</view>
</view>
</template>
<script>
import {replaceImgSrc} from '../../../utils/ImageUtil.js'
export default {
data() {
return {
@ -54,7 +54,7 @@
console.log(res);
let notice = res.data.notices[0]
notice.timeStr = notice.startTime.replace(/:\d{1,2}$/, ' ');
notice.context = replaceImgSrc(notice.context,that.java110Constant.url.baseUrl);
that.notice = notice;
}
});
@ -64,31 +64,34 @@
</script>
<style>
.user-container {
padding: 25rpx 10rpx;
background-color: #F0F0F0;
padding: 25rpx 10rpx;
background-color: #F0F0F0;
/*border: 1px solid black;*/
}
.notice {
margin: 10rpx 7rpx;
padding: 25rpx;
background-color: #ffffff;
border-radius: 7rpx;
margin: 10rpx 7rpx;
padding: 25rpx;
background-color: #ffffff;
border-radius: 7rpx;
}
.title {
border-bottom: 1rpx solid #dedede;
font-weight: 700;
font-size: 34rpx;
color: #00AA00;
border-bottom: 1rpx solid #dedede;
font-weight: 700;
font-size: 34rpx;
color: #00AA00;
}
.content{
padding: 15rpx 0;
font-size: 25rpx;
color: #7B7B7B;
.content {
padding: 15rpx 0;
font-size: 25rpx;
color: #7B7B7B;
}
.footer {
padding: 15rpx 0;
font-size: 22rpx;
color: #ADADAD;
padding: 15rpx 0;
font-size: 22rpx;
color: #ADADAD;
}
</style>

54
utils/ImageUtil.js Normal file
View File

@ -0,0 +1,54 @@
import {
isEmpty
} from './StringUtil'
/**
* 处理富文本里的图片宽度自适应
* 1.去掉img标签里的stylewidthheight属性
* 2.img标签添加style属性max-width:100%;height:auto
* 3.修改所有style里的width属性为max-width:100%
* 4.去掉<br/>标签
* @param html
* @returns {void|string|*}
*/
export function formatRichText(html) {
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
return match;
});
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
return match;
});
newContent = newContent.replace(/<br[^>]*\/>/gi, '');
newContent = newContent.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;margin:10px 0;"');
return newContent;
}
/**
* 替换 图片src
* @param {Object} _content 富文本
* @param {Object} _url 图片前缀
*/
export function replaceImgSrc(_content, _url) {
console.log('_content', typeof(_content))
if (isEmpty(_content)) {
return _content;
}
// a 为富文本的字符串内容为了测试只写了img标签
let b = /<img [^>]*src=['"]([^'"]+)[^>]*>/g; // img 标签取src里面内容的正则
let s = _content.match(b); // 取到所有img标签 放到数组 s里面
if (!isEmpty(s)) {
for (let i = 0; i < s.length; i++) {
let srcImg = s[i].replace(b, '$1'); //取src面的内容
if (srcImg.slice(0, 4) == 'http' || srcImg.slice(0, 5) == 'https') {
//若src前4位置或者前5位是http、https则不做任何修改
} else {
//修改富文本字符串内容 img标签src 相对路径改为绝对路径
_content = _content.replace(srcImg, _url + srcImg);
}
}
}
return formatRichText(_content);
}

View File

@ -21,7 +21,49 @@ const isNotNull = function(_obj){
return true;
}
/**
* 字符串工具类
*
* add by 吴学文 2020-09-25
*/
/**
* 判断是否为空
* @param {Object} _value 字符串
*/
const isEmpty=function (_value) {
let type = typeof _value;
switch (type) {
case 'number':
if (isFinite(_value)) {
if (_value == 0) {
return true;
} else {
return false;
}
} else {
return true;
}
case 'object':
for (let i in _value) {
return false;
}
return true;
case 'string':
if (_value.length == 0) {
return true;
} else {
return false
}
default:
return true
}
}
module.exports = {
isNull: isNull,
isNotNull: isNotNull
isNotNull: isNotNull,
isEmpty:isEmpty
};