Browse Source

富文本图片溢出处理

付宇航 1 năm trước cách đây
mục cha
commit
27dd9a2c13

+ 10 - 0
pages.json

@@ -201,6 +201,16 @@
 			}
 		},
 		{
+			"path": "pages/toLegal/toLegal",
+			"style": {
+				"usingComponents": {},
+				"navigationBarBackgroundColor": "#07c160",
+				"navigationBarTextStyle": "white",
+				"navigationBarTitleText": "法律下乡"
+		
+			}
+		},
+		{
 			"path": "pages/me/meOperate",
 			"style": {
 				"usingComponents": {},

+ 6 - 1
pages/index/index.vue

@@ -31,7 +31,7 @@
                 <image :src="loadImgSrc('/cnfl-fr.png')"></image>
             </view>
             <view class="cnfl">
-                <view class="fv">
+                <view class="fv" @click="toLegal()">
                     <text>法律乡下</text>
                     <image :src="loadImgSrc('/fv.jpg')"></image>
                 </view>
@@ -332,6 +332,11 @@ export default {
 		this.governmentListData()
 	},
     methods: {
+		toLegal(){
+			uni.navigateTo({
+			    url: '/pages/toLegal/toLegal'
+			});
+		},
 		toGovernmentList(){
 			uni.navigateTo({
 			    url: '/pages/toGovernmentList/toGovernmentList'

+ 1 - 0
pages/informationDetail/informationDetail.css

@@ -58,6 +58,7 @@
     line-height: 0;
 }
 .wenzhangCont {
+	width: 100vw;
     font-size: 34rpx;
     margin: 30rpx 0;
 }

+ 3 - 2
pages/informationDetail/informationDetail.vue

@@ -15,7 +15,7 @@
                 <!-- 积分 -->
 <!--                <span class="jf">100</span> -->
             </view>
-            <view class="wenzhangCont">
+            <view class="wenzhangCont article">
                 <span v-html="detailInfo.textDetails">
                 </span>
 			
@@ -89,7 +89,7 @@ export default {
 		console.log('options',options)
 		getServer(options).then(res => {
 			let result = res.data
-			result.textDetails = this.srcExcutedFunc(result.textDetails)
+			// result.textDetails = this.srcExcutedFunc(result.textDetails)
 			this.detailInfo = result
 		})
 	},
@@ -126,6 +126,7 @@ export default {
 </script>
 <style lang="scss">
 @import './informationDetail.css';
+
 .collect{
 	.icon-shoucang:before{
 		color: red;

+ 204 - 0
pages/toLegal/toLegal.css

@@ -0,0 +1,204 @@
+/* pages/fuwu.wxss */
+/* pages/sannong.wxss */
+.snTab {
+    width: 100%;
+}
+
+.fontColorBox,
+.fontColorBox1 {
+    color: #07c160;
+}
+
+.navBox {
+    /* 顶部tab盒子样式 */
+    width: 100%;
+    height: 108rpx;
+    background: white;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    justify-content: center;
+}
+/* 最后一个tab标题的样式 */
+
+.titleBox {
+    /* 未选中文字的样式 */
+    color: rgb(168, 170, 175);
+    font-size: 30rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 32%;
+}
+.lineBox,
+.notLineBox {
+    /* 选中及未选中底线共同样式 */
+    width: 32rpx;
+    height: 8rpx;
+}
+
+.lineBox {
+    /* 选中底线样式 */
+    background: #07c160;
+    margin-top: 16rpx;
+    border-radius: 4rpx;
+}
+
+.notLineBox {
+    /* 未选中底线样式 */
+    background: transparent;
+}
+
+.swiperTtemBox {
+    /* 底部内容样式 */
+    height: 100vh;
+    overflow: scroll;
+    margin: 12rpx 0rpx;
+    background: white;
+    font-size: 28rpx;
+}
+
+/* 热门问答 */
+.rnwdList {
+    width: 100%;
+    height: 100%;
+}
+.list {
+    border-bottom: solid 2rpx #f6f6f6;
+    padding: 10rpx 0;
+    width: 100%;
+}
+.listTitle {
+    font-size: 32rpx;
+    color: #333;
+    line-height: 40rpx;
+}
+.jlSj {
+    height: 40rpx;
+    display: flex;
+    justify-content: space-between;
+    font-size: 24rpx;
+    margin: 20rpx 0 0 0;
+}
+.jf {
+    color: #07c160;
+}
+.icon-jifen {
+    font-size: 28rpx;
+    color: #07c160;
+    margin: 0 0 0 6rpx;
+}
+.ck {
+    color: #c4c4c4;
+}
+.icon-pinglun,
+.icon-chakan,
+.icon-shoucang {
+    font-size: 28rpx;
+    margin: 0 6rpx 0 20rpx;
+    color: #c4c4c4;
+}
+.onePic {
+    width: 100%;
+    height: 360rpx;
+    border-radius: 20rpx;
+    overflow: hidden;
+    margin: 20rpx 0;
+}
+.onePic image {
+    width: 100%;
+    height: 100%;
+}
+.twoPic {
+    width: 100%;
+    height: 220rpx;
+    margin: 20rpx 0;
+    display: flex;
+    justify-content: space-between;
+}
+.twoPic image {
+    width: 49%;
+    height: auto;
+    border-radius: 20rpx;
+}
+.threePic {
+    width: 100%;
+    height: 160rpx;
+    margin: 20rpx 0;
+    display: flex;
+    justify-content: space-between;
+}
+.threePic image {
+    width: 32%;
+    height: auto;
+    border-radius: 20rpx;
+}
+
+.pane-con {
+    margin: 20rpx 0;
+}
+.tabs-pane {
+    padding: 10rpx 20rpx;
+    margin-right: 20rpx;
+    border: 1px solid lightgrey;
+}
+.tabs-pane:nth-last-child(1) {
+    margin-right: 0;
+}
+.tabs-pane.active {
+    background: #5495df;
+    border-color: #5495df;
+    color: #fff;
+}
+
+.tab-class {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    bottom: 0;
+}
+
+.guidebook .img_box {
+    margin-bottom: 12rpx;
+    padding-left: 4rpx;
+}
+.guidebook .img_box .many_img {
+    display: flex;
+    justify-self: start;
+    flex-wrap: wrap;
+}
+.guidebook .img_item.four {
+    width: 198rpx;
+    height: 198rpx;
+    margin-right: 16rpx;
+    margin-bottom: 16rpx;
+    border-radius: 16rpx;
+    overflow: hidden;
+}
+.guidebook .img_item.four:nth-child(2n) {
+    margin-right: 30rpx;
+}
+.guidebook .img_item.many {
+    width: 198rpx;
+    height: 198rpx;
+    margin-right: 16rpx;
+    margin-bottom: 16rpx;
+    border-radius: 16rpx;
+    overflow: hidden;
+}
+.guidebook .img_item.many:nth-child(3n) {
+    margin-right: 0;
+}
+.addInfomarionBtn{
+	position: fixed;
+	bottom: 3%;
+	right: 3%;
+	width: 40px;
+	height: 40px;
+	background: url('@/static/images/upload/add.png') 0 0 no-repeat;
+	background-size: 100% 100%;
+}
+.addInfomarionBtn::after{
+	border: none;
+}

+ 153 - 0
pages/toLegal/toLegal.vue

@@ -0,0 +1,153 @@
+<template>
+    <!-- pages/me.wxml -->
+	<view class="container">
+		<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" @blur="search"  @input="search"
+		style="width: 100%;"
+			@cancel="cancel">
+		</uni-search-bar>
+	    <view class="rnwdList">
+	        <view class="list" @tap="goDetails(item)" v-for="(item, index1) in qbwd" :key="index1">
+	            <span class="listTitle">{{ item.titleName }}</span>
+	
+	            <view class="onePic" v-if="item.urls.length == 1">
+	                <image :src="loadImgSrc(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
+					</image>
+	            </view>
+	            <view class="twoPic" v-if="item.urls.length == 2">
+	                <image :src="loadImgSrc(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
+					</image>
+	            </view>
+	
+	            <view class="threePic" v-if="item.urls.length == 3">
+	                <image :src="loadImgSrc(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
+					</image>
+	            </view>
+	
+	           <!-- <view class="jlSj">
+	                <span class="jf">
+	                    {{ item.jf }}
+	                    <em class="iconfont icon-jifen"></em>
+	                </span>
+	                <view class="ck">
+	                    <span>
+	                        <em class="iconfont icon-pinglun"></em>
+	                        {{ item.pl }}
+	                    </span>
+	                    <span>
+	                        <em class="iconfont icon-chakan"></em>
+	                        {{ item.ck }}
+	                    </span>
+	                    <span>
+	                        <em class="iconfont icon-shoucang"></em>
+	                        {{ item.dz }}
+	                    </span>
+	                </view>
+	            </view> -->
+	
+			</view>
+	    </view>
+		<!-- 新增资讯按钮 -->
+		<!-- <button class="addInfomarionBtn" @click="addInfomation()"></button> -->
+	</view>
+</template>
+
+<script>
+import { listWxs ,listWx} from '@/api/information/information.js'
+// pages/me.js
+export default {
+    data() {
+        return {
+			qbwd:[],
+			listParams:{
+			  pageNum: 1,
+			  pageSize: 7,
+			  titleName: '',
+			  type: 11,
+			  flag:''
+			},
+			total:0,
+			searchValue:''
+		};
+    },
+	created(){
+		this.getList()
+		// 查置顶
+		listWx({}).then(e => {
+		})
+	},
+	onReachBottom(){
+		let pageNum = this.listParams.pageNum
+		let pageSize = this.listParams.pageSize
+		let total = this.total
+		if(pageNum * pageSize >= total){
+			uni.showToast({
+				title:'暂无更多数据'
+			})
+			return
+		} else {
+			this.listParams.pageNum += 1;
+			this.getList()
+		}
+	},
+	methods:{
+		search(){
+			this.listParams.titleName = this.searchValue
+			this.qbwd = []
+			this.getList()
+		},
+		getList(){
+			listWxs(this.listParams).then(res => {
+				this.qbwd = [...this.qbwd,...res.rows]
+				this.total = res.total
+			})
+		},
+		goDetails(e) {
+			let id = e.id || ''
+			let type = 11
+		    uni.navigateTo({
+		        url: `../informationDetail/informationDetail?id=${id}&type=${type}`
+		    });
+		},
+		// 新增资讯
+		addInfomation(){
+			uni.navigateTo({
+			    url: `../informationAdd/informationAdd`
+			});
+		}
+	},
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {},
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {},
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {},
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {},
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {},
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {},
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage() {},
+};
+</script>
+<style>
+@import './toLegal.css';
+.container{
+	height: 100%;
+}
+</style>

+ 3 - 1
static/scss/colorui.css

@@ -102,7 +102,9 @@ checkbox .uni-checkbox-input {
 	width: 24px;
 	height: 24px;
 }
-
+.article [src]{
+    max-width: 100%;
+}
 checkbox.round .wx-checkbox-input,
 checkbox.round .uni-checkbox-input {
 	border-radius: 100upx;