Skip to content

G
gs1
Commit 52bc5cab by 林家欣
Options

修改详情页图片未设置最大宽度导致H5样式bug

parent 328c45b5
Showing with 219 additions and 210 deletions
src/views/Knowledge/Statuteinfo.vue
<template> <template>
<div class="org container"> <div class="org container">
<breadcrumb /> <breadcrumb />
<div class="row status-container" v-loading='loading'> <div class="row status-container" v-loading="loading">
<p class="title-style">{{title}}</p> <p class="title-style">{{ title }}</p>
<div class="showHtml" v-html="content"></div> <div class="showHtml" v-html="content"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import breadcrumb from "../comps/breadcrumb.vue"; import breadcrumb from "../comps/breadcrumb.vue";
import pages from "../comps/pages2.vue"; import pages from "../comps/pages2.vue";
export default { export default {
...@@ -19,65 +17,61 @@ export default { ...@@ -19,65 +17,61 @@ export default {
}, },
data() { data() {
return { return {
loading:false, loading: false,
id:this.$route.query.id, id: this.$route.query.id,
content:'', content: "",
title:'' title: "",
}; };
}, },
computed: { computed: {
routes() { routes() {},
},
}, },
created() { created() {
this.policyInfoFn(); this.policyInfoFn();
}, },
mounted() { mounted() {},
methods: {
},
methods:{
// 政策法规列表 // 政策法规列表
async policyInfoFn() { async policyInfoFn() {
this.loading=true this.loading = true;
const params = { const params = {
id:this.id, id: this.id,
}; };
const policyInfoRes = const policyInfoRes = await this.$api.knowledge.policyInfo(params);
await this.$api.knowledge.policyInfo(params);
const { returnCode, data } = policyInfoRes; const { returnCode, data } = policyInfoRes;
if (returnCode === "0") { if (returnCode === "0") {
this.loading=false this.loading = false;
this.content=data.content; this.content = data.content;
this.title=data.title this.title = data.title;
this.$store.commit("system/SET_BREADCRUMB", [ this.$store.commit("system/SET_BREADCRUMB", [
{ name: "知识中心", path: "/Knowledge" }, { name: "知识中心", path: "/Knowledge" },
{ name: "政策法规", path: "/Knowledge/Statute" }, { name: "政策法规", path: "/Knowledge/Statute" },
{ name: this.title }, { name: this.title },
]); ]);
console.log(1) console.log(1);
} }
}, },
},
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
@media screen and(min-width: 992px) {
@media screen and(min-width: 992px) { }
@media screen and (max-width: 992px) {
}
.showHtml {
p {
overflow: hidden;
}
img {
max-width: 100%;
} }
@media screen and (max-width: 992px) {
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.org { .org {
padding-bottom: 20px; padding-bottom: 20px;
.title-style{ .title-style {
font-size: 24px; font-size: 24px;
text-align: center; text-align: center;
padding: 30px; padding: 30px;
...@@ -85,27 +79,25 @@ export default { ...@@ -85,27 +79,25 @@ export default {
color: #002c6c; color: #002c6c;
margin-bottom: 10px; margin-bottom: 10px;
} }
.status-container{ .status-container {
border-top: 7px solid #002c6c; border-top: 7px solid #002c6c;
background: #fff; background: #fff;
padding:0 20px; padding: 0 20px;
>div{ > div {
font-size: 14px; font-size: 14px;
padding-bottom:30px; padding-bottom: 30px;
word-wrap:break-word; word-wrap: break-word;
word-break:break-all; word-break: break-all;
} }
.showHtml{ .showHtml {
line-height: 24px; line-height: 24px;
font-size: 14px; font-size: 14px;
// text-indent: 28px; // text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px; margin: 0 0 10px;
} }
} }
} }
} }
</style> </style>
\ No newline at end of file
src/views/Knowledge/article.vue
...@@ -2,12 +2,11 @@ ...@@ -2,12 +2,11 @@
<div class="org container"> <div class="org container">
<div class="row status-container"> <div class="row status-container">
<p class="title-style"> <p class="title-style">
<span>{{title}}</span> <span>{{ title }}</span>
<span>日期：{{checkTime(showtime)}}</span> <span>日期：{{ checkTime(showtime) }}</span>
</p> </p>
<div class="showHtml" v-html="content"></div> <div class="showHtml" v-html="content"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
...@@ -21,10 +20,10 @@ export default { ...@@ -21,10 +20,10 @@ export default {
}, },
data() { data() {
return { return {
id:this.$route.query.id, id: this.$route.query.id,
content:'', content: "",
title:'', title: "",
showtime:'', showtime: "",
breadcrumb: [{ name: "技术与标准", path: "/Knowledge" }], breadcrumb: [{ name: "技术与标准", path: "/Knowledge" }],
}; };
}, },
...@@ -36,95 +35,91 @@ export default { ...@@ -36,95 +35,91 @@ export default {
created() { created() {
this.initInfoFn(); this.initInfoFn();
}, },
mounted() { mounted() {},
methods: {
}, checkTime(val) {
methods:{ val = val.substring(0, val.indexOf(" "));
checkTime(val){ return val;
val=val.substring(0, val.indexOf(' '))
return val
}, },
// 政策法规列表 // 政策法规列表
async initInfoFn() { async initInfoFn() {
const params = { const params = {
id:this.id, id: this.id,
}; };
const infoRes = const infoRes = await this.$api.knowledge.knowledgeinfo(params);
await this.$api.knowledge.knowledgeinfo(params);
const { returnCode, data } = infoRes; const { returnCode, data } = infoRes;
if (returnCode === "0") { if (returnCode === "0") {
console.log(data) console.log(data);
this.content=data.content; this.content = data.content;
this.title=data.title this.title = data.title;
this.showtime=data.inputdate this.showtime = data.inputdate;
this.breadcrumb = this.breadcrumb.concat(this.matche); this.breadcrumb = this.breadcrumb.concat(this.matche);
this.breadcrumb.push({ this.breadcrumb.push({
name: this.title, name: this.title,
}); });
this.$store.commit("system/SET_BREADCRUMB", this.breadcrumb); this.$store.commit("system/SET_BREADCRUMB", this.breadcrumb);
console.log(1) console.log(1);
} }
}, },
},
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
@media screen and(min-width: 992px) {
@media screen and(min-width: 992px) { }
@media screen and (max-width: 992px) {
}
.showHtml {
p {
overflow: hidden;
}
img {
max-width: 100%;
} }
@media screen and (max-width: 992px) {
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.org { .org {
padding-bottom: 20px; padding-bottom: 20px;
.title-style{ .title-style {
padding: 35px 0 10px; padding: 35px 0 10px;
border-bottom: 1px solid #b2b2b8; border-bottom: 1px solid #b2b2b8;
color: #002c6c; color: #002c6c;
margin-bottom: 10px; margin-bottom: 10px;
line-height: 32px; line-height: 32px;
span{ span {
&:first-child{ &:first-child {
font-size: 18px; font-size: 18px;
float: left; float: left;
} }
&:last-child{ &:last-child {
font-size: 14px; font-size: 14px;
color: #000; color: #000;
float: right; float: right;
} }
} }
} }
.status-container{ .status-container {
border-top: 7px solid #002c6c; border-top: 7px solid #002c6c;
background: #fff; background: #fff;
padding:0 20px; padding: 0 20px;
>div{ > div {
font-size: 14px; font-size: 14px;
padding-bottom:30px; padding-bottom: 30px;
} }
.showHtml{ .showHtml {
border-bottom: 1px solid #b2b2b8; border-bottom: 1px solid #b2b2b8;
padding-bottom: 30px; padding-bottom: 30px;
margin-bottom: 25px; margin-bottom: 25px;
margin-top: 20px; margin-top: 20px;
line-height: 28px; line-height: 28px;
font-size: 14px; font-size: 14px;
text-indent: 28px; text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px margin: 0 0 10px;
} }
} }
} }
} }
</style> </style>
\ No newline at end of file
src/views/News/HealthDetail.vue
...@@ -45,7 +45,14 @@ export default { ...@@ -45,7 +45,14 @@ export default {
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
.health-detail {
p {
overflow: hidden;
}
img {
max-width: 100%;
}
}
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
......
src/views/News/NoticeArticle.vue
...@@ -3,20 +3,20 @@ ...@@ -3,20 +3,20 @@
<breadcrumb /> <breadcrumb />
<div class="row status-container"> <div class="row status-container">
<div class="title-style"> <div class="title-style">
<p><b>{{title}}</b></p> <p>
<p> <b>{{ title }}</b>
<span style="float:left">作者{{author}}</span> </p>
<span style="float:right">日期{{showtime}}</span> <p>
</p> <span style="float: left">作者{{ author }}</span>
<span style="float: right">日期{{ showtime }}</span>
</p>
</div> </div>
<div class="showHtml" v-html="content"></div> <div class="showHtml" v-html="content"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import breadcrumb from "../comps/breadcrumb.vue"; import breadcrumb from "../comps/breadcrumb.vue";
import pages from "../comps/pages2.vue"; import pages from "../comps/pages2.vue";
export default { export default {
...@@ -26,96 +26,93 @@ export default { ...@@ -26,96 +26,93 @@ export default {
}, },
data() { data() {
return { return {
id:this.$route.query.id, id: this.$route.query.id,
content:'', content: "",
title:'', title: "",
showtime:'', showtime: "",
author:'' author: "",
}; };
}, },
computed: { computed: {
routes() { routes() {},
},
}, },
created() { created() {
this.InfoFn(); this.InfoFn();
}, },
mounted() { mounted() {
console.log(2) console.log(2);
// 面包屑单独处理 // 面包屑单独处理
}, },
methods:{ methods: {
// 详情 // 详情
async InfoFn() { async InfoFn() {
const params = { const params = {
id:this.id, id: this.id,
}; };
const listRes = const listRes = await this.$api.news.announInfo(params);
await this.$api.news.announInfo(params);
const { returnCode, data } = listRes; const { returnCode, data } = listRes;
if (returnCode === "0") { if (returnCode === "0") {
console.log(data, "公告详情"); console.log(data, "公告详情");
this.content=data.content; this.content = data.content;
this.title=data.title this.title = data.title;
this.showtime = data.showtime this.showtime = data.showtime;
this.author=data.author this.author = data.author;
this.$store.commit("system/SET_BREADCRUMB", [ this.$store.commit("system/SET_BREADCRUMB", [
{ name: "资讯中心", path: "/New/index" }, { name: "资讯中心", path: "/New/index" },
{ name: "公告通知", path: "/News/Notice" }, { name: "公告通知", path: "/News/Notice" },
{ name: this.title }, { name: this.title },
]); ]);
} }
}, },
},
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
@media screen and(min-width: 992px) {
@media screen and(min-width: 992px) { }
@media screen and (max-width: 992px) {
}
.showHtml {
p {
overflow: hidden;
}
img {
max-width: 100%;
} }
@media screen and (max-width: 992px) {
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.org { .org {
padding-bottom: 20px; padding-bottom: 20px;
.title-style{ .title-style {
font-size: 24px; font-size: 24px;
text-align: center; text-align: center;
border-bottom: 1px solid #b2b2b8; border-bottom: 1px solid #b2b2b8;
color: #002c6c; color: #002c6c;
margin-bottom: 10px; margin-bottom: 10px;
P{ P {
&:first-child{ &:first-child {
padding: 30px; padding: 30px;
font-size: 24px; font-size: 24px;
margin-bottom: 15px; margin-bottom: 15px;
} }
&:last-child{ &:last-child {
color: #666666; color: #666666;
font-size: 12px; font-size: 12px;
} }
} }
} }
.status-container{ .status-container {
border-top: 7px solid #002c6c; border-top: 7px solid #002c6c;
background: #fff; background: #fff;
padding:0 20px; padding: 0 20px;
padding-bottom: 20px; padding-bottom: 20px;
>div{ > div {
font-size: 14px; font-size: 14px;
padding-bottom: 15px; padding-bottom: 15px;
} }
.showHtml{ .showHtml {
border-bottom: 1px solid #b2b2b8; border-bottom: 1px solid #b2b2b8;
padding-bottom: 30px; padding-bottom: 30px;
margin-bottom: 25px; margin-bottom: 25px;
...@@ -124,11 +121,10 @@ export default { ...@@ -124,11 +121,10 @@ export default {
font-size: 14px; font-size: 14px;
text-indent: 28px; text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px margin: 0 0 10px;
} }
} }
} }
} }
</style> </style>
\ No newline at end of file
src/views/News/msg.vue
...@@ -179,7 +179,7 @@ export default { ...@@ -179,7 +179,7 @@ export default {
} }
}, },
// getBreadcrumb(classId){ // getBreadcrumb(classId){
// }, // },
// top列表 // top列表
async newsTop10() { async newsTop10() {
...@@ -235,16 +235,15 @@ export default { ...@@ -235,16 +235,15 @@ export default {
window.open(link.href, "_blank"); window.open(link.href, "_blank");
} }
}, },
getNoticeInfo(id,directpath){ getNoticeInfo(id, directpath) {
if(directpath&&directpath!==''&& directpath.length>0){ if (directpath && directpath !== "" && directpath.length > 0) {
window.open(directpath,'_blank'); window.open(directpath, "_blank");
}else{ } else {
let link = this.$router.resolve({ let link = this.$router.resolve({
path: `/News/NoticeArticle?id=${id}`, path: `/News/NoticeArticle?id=${id}`,
}); });
window.open(link.href,'_blank') window.open(link.href, "_blank");
} }
}, },
// weibo // weibo
toweibo() { toweibo() {
...@@ -269,6 +268,14 @@ export default { ...@@ -269,6 +268,14 @@ export default {
} }
} }
} }
.msg-text {
p{
overflow: hidden;
}
img{
max-width: 100%;
}
}
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -329,12 +336,10 @@ export default { ...@@ -329,12 +336,10 @@ export default {
font-size: 14px; font-size: 14px;
text-indent: 28px; text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px margin: 0 0 10px;
} }
} }
} }
.xglj { .xglj {
@include module-box; @include module-box;
......
src/views/News/msgVideo.vue
...@@ -35,9 +35,14 @@ ...@@ -35,9 +35,14 @@
</div> </div>
<div class="msg-text" v-html="content"></div> <div class="msg-text" v-html="content"></div>
<div class="videoStyle"> <div class="videoStyle">
<video controls="controls" :src="videoStr" width="100%" height="100%" webkit-playsinline="" ></video> <video
controls="controls"
:src="videoStr"
width="100%"
height="100%"
webkit-playsinline=""
></video>
</div> </div>
</div> </div>
</div> </div>
<div class="xglj"> <div class="xglj">
...@@ -131,7 +136,7 @@ export default { ...@@ -131,7 +136,7 @@ export default {
author: "", author: "",
source: "", source: "",
editor: "", editor: "",
videoStr:'', videoStr: "",
breadcrumb: [{ name: "资讯中心", path: "/News/index" }], breadcrumb: [{ name: "资讯中心", path: "/News/index" }],
xglj: { xglj: {
data: [ data: [
...@@ -255,16 +260,21 @@ export default { ...@@ -255,16 +260,21 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.container { .container {
@media screen and (min-width: 992px) { @media screen and (min-width: 992px) {
} }
@media screen and (max-width: 992px) { @media screen and (max-width: 992px) {
.videoStyle{ .videoStyle {
width: 100%!important; width: 100% !important;
height: 200px!important; height: 200px !important;
} }
}
} .msg-text {
p {
overflow: hidden;
}
img {
max-width: 100%;
}
}
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -299,12 +309,12 @@ export default { ...@@ -299,12 +309,12 @@ export default {
} }
} }
.videoStyle{ .videoStyle {
width: 449px; width: 449px;
height: 300px; height: 300px;
margin-top: 30px; margin-top: 30px;
text-align: center; text-align: center;
margin:0 auto margin: 0 auto;
} }
.msg-cont { .msg-cont {
@include module-box; @include module-box;
...@@ -344,10 +354,9 @@ export default { ...@@ -344,10 +354,9 @@ export default {
font-size: 14px; font-size: 14px;
text-indent: 28px; text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px margin: 0 0 10px;
} }
} }
} }
.xglj { .xglj {
......
src/views/Service/Partners/caseMsg.vue
...@@ -7,7 +7,11 @@ ...@@ -7,7 +7,11 @@
<div class="msg-head"> <div class="msg-head">
<div class="msg-head-left"> <div class="msg-head-left">
<!-- <span>作者：{{ partnersMsg.auditor }}</span> --> <!-- <span>作者：{{ partnersMsg.auditor }}</span> -->
<span>日期：{{ $moment(partnersMsg.updatedate).format("YYYY-MM-DD") }}</span> <span
>日期：{{
$moment(partnersMsg.updatedate).format("YYYY-MM-DD")
}}</span
>
<!-- <span>编辑：{{ partnersMsg.editor }}</span> --> <!-- <span>编辑：{{ partnersMsg.editor }}</span> -->
</div> </div>
</div> </div>
...@@ -21,7 +25,7 @@ export default { ...@@ -21,7 +25,7 @@ export default {
data() { data() {
return { return {
partnersMsg: {}, partnersMsg: {},
} };
}, },
created() { created() {
this.serviceGetCaseDetailInfo(); this.serviceGetCaseDetailInfo();
...@@ -29,16 +33,16 @@ export default { ...@@ -29,16 +33,16 @@ export default {
mounted() { mounted() {
// 面包屑单独处理 // 面包屑单独处理
this.$store.commit("system/SET_BREADCRUMB", [ this.$store.commit("system/SET_BREADCRUMB", [
{name: "服务中心", path: "/Service/BarcodeV"}, { name: "服务中心", path: "/Service/BarcodeV" },
{name: "标准服务提供商", path: "/Service/Partners/index"}, { name: "标准服务提供商", path: "/Service/Partners/index" },
{name: "GS1标准服务提供商案例"}, { name: "GS1标准服务提供商案例" },
]); ]);
}, },
methods: { methods: {
async serviceGetCaseDetailInfo() { async serviceGetCaseDetailInfo() {
const query = { const query = {
id: this.$route.query.id, id: this.$route.query.id,
} };
const serviceGetCaseDetailInfoRes = const serviceGetCaseDetailInfoRes =
await this.$api.service.serviceGetCaseDetailInfo(query); await this.$api.service.serviceGetCaseDetailInfo(query);
const { returnCode, data } = serviceGetCaseDetailInfoRes; const { returnCode, data } = serviceGetCaseDetailInfoRes;
...@@ -90,20 +94,18 @@ export default { ...@@ -90,20 +94,18 @@ export default {
} }
} }
.msg-text { .msg-text {
margin-top: 20px; margin-top: 20px;
line-height: 28px; line-height: 28px;
font-size: 14px; font-size: 14px;
text-indent: 28px; text-indent: 28px;
color: #454545; color: #454545;
/deep/p{ /deep/p {
margin: 0 0 10px margin: 0 0 10px;
}
img {
max-width: 95%;
} }
img {
max-width: 95%;
} }
}
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment