123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116 |
- <template>
- <div class="page_newsDetail">
- <div class="newsTitle">{{articles.title}}</div>
- <div class="msg" v-html="articles.content" v-show="articleshow"></div>
- <<<<<<< .mine
- <div class="video" v-show="videoshow">
- <video id="example_video_1" class="video-js vjs-default-skin"
- controls preload="auto" width="100%" height="100%"
- poster="http://video-js.zencoder.com/oceans-clip.png"
- data-setup='{"example_option":true}' ref="video">
- <source :src="articles.video_url" type='video/mp4' />
- </video>
- </div>
-
-
-
-
-
-
-
- =======
- <div class="video" v-show="videoshow">
- <video
- id="example_video_1"
- class="video-js vjs-default-skin"
- controls
- preload="auto"
- width="640"
- height="300"
- poster="http://video-js.zencoder.com/oceans-clip.png"
- data-setup="{"example_option":true}"
- ref="video"
- >
- <source :src="articles.video_url" type="video/mp4" />
- </video>
- </div>
- >>>>>>> .theirs
- </div>
- </template>
- <script>
- import { singleArticleInfo } from "@/api/micro/micro";
- export default {
- data() {
- return {
- articles: [],
- videoshow: false,
- articleshow: true
- };
- },
- methods: {
- singleArticleInfo(id, orgid) {
- singleArticleInfo(id, orgid).then(response => {
- if (response.data.state == 1) {
- var articles = response.data.data.articles;
- console.log("articles是什么", articles);
- this.articles = articles;
- if (articles.video_url != "") {
- this.articleshow = false;
- this.videoshow = true;
- this.$refs.video.src = articles.video_url;
- }
- }
- });
- }
- },
- created() {
- const id = this.$route.query.id;
- const orgid = this.$route.query.orgid;
- console.log("id是多少", id);
- console.log("orgid是多少", orgid);
- this.singleArticleInfo(id, orgid);
- }
- };
- </script>
-
-
- <style lang="scss" scoped>
- .page_newsDetail {
- overflow: hidden;
- height: 100%;
- overflow-y: auto;
- &::-webkit-scrollbar {
- width: 0;
- }
- }
- .newsTitle {
- width: 19.9375rem;
- height: 3.75rem;
- font-size: 1.25rem;
- font-weight: 600;
- color: rgba(7, 18, 40, 1);
- line-height: 1.875rem;
- margin: 1.3125rem 2.1875rem 0 1.3125rem;
- word-break: break-all;
- display: -webkit-box;
- -webkit-line-clamp: 2;
- -webkit-box-orient: vertical;
- overflow: hidden;
- }
- .msg {
- width: 21rem;
- min-height: 12.0625rem;
- font-size: 1rem;
- font-weight: 600;
- color: rgba(7, 18, 40, 1);
- line-height: 1.375rem;
- margin: 1.25rem 1.25rem 0 1.125rem;
- }
-
- .video{
- width: 100%;
- height: 250px;
- // border: solid 1px red;
- }
- </style>
|