diff --git a/src/assets/styles/portal.scss b/src/assets/styles/portal.scss index 6dcb0b5c..fa4cb486 100644 --- a/src/assets/styles/portal.scss +++ b/src/assets/styles/portal.scss @@ -1,49 +1,14 @@ /** * 门户页面的一些通用样式定义在这里面 */ -body { - margin: 0px; - padding: 0px; -} - -//页面版心区域 -.xcontent{ - // width: 1000px; - // margin: 0px auto; - margin: 0px 5%; -} -.index-course{ - // width: 25%; -} - -.course-index{ - // width: 33.34%; -} - -.xrow{ - margin-left: -5px; - margin-right: -5px; - box-sizing: border-box; -} - -.xcol{ - margin-right: 26px; - display: inline-block; - box-sizing: border-box; -} - -.xrow-course{ - // padding-left: 5px; - // padding-right: 5px; - display: inline-block; - box-sizing: border-box; -} +body {margin: 0px;padding: 0px;} +//[文章，案例，问答]详细页面内容部分 .xpage-detail-content{ padding: 50px; background-color: #fff; } -// 详细页面的面包屑 +//[文章，案例，问答]详细页面的面包屑 .xpage-detail-crumbs{ .crumbs-first{ color:#cccccc; @@ -59,15 +24,8 @@ body { color:#3d3d3d; } } -//门户页面右边 -.xpage-right{ - width: 410px; -} -.portal-right-box{ - width: 410px; - border-radius: 8px; - padding: 30px; -} + +//原样式，未修改 .portal-model-btn{// 写文章，发课程等按钮 width: 100%; height: 67px; @@ -81,95 +39,299 @@ body { text-align: center; margin-bottom: 22px; } - - .portal-ranking-box{ - width: 344px; - // height: 544px; - // overflow-y: auto; - .course-index-list{ - height: 410px; - overflow-y: auto; - } - .case-index-list{ - height: 114px; - overflow-y: auto; - } - .anking-index-list{ - height: 320px; - overflow-y: auto; - } - .qa-index-qa{ - height: 64px; - overflow-y: auto; - } +//页面中的排行内容块 +.portal-ranking{ + border-radius: 8px; + padding: 30px; + // height: 544px; + // overflow-y: auto; + .ranking-title{ + font-size: 24px; + font-family: FZLTCHJW--GB1-0, FZLTCHJW--GB1; + font-weight: 600; + color: #000000; + line-height: 28px; + padding-bottom:12px } + .ranking-data{ + min-height: 246px; + margin: 0px; + overflow-y: auto; + } +} +//排行块的背景 +.ranking-bg{ + background: url('/images/qa-box.png') no-repeat top left; + // background: linear-gradient(180deg, #C3DEF8 0%, #FFFFFF 37%); + //background-size:100% 100%; + background-size:cover; +} +.ranking-bg1{ + background: url('/images/list-or.png') no-repeat top left; + //background-size:100% 100%; + background-size:cover; +} +.ranking-bg2{ + background: url('/images/list-pink.png') no-repeat top left; + //background-size:100% 100%; + background-size:cover; +} +//左右内容栏 +.xcontent2{ + display: flex; + justify-content: space-between; + margin: 0px auto; +} +.xcontent2-main{ + flex: 1; +} + +.xcontent2-minor{ + width: auto; +} + +//课程卡片 +.xcourse-card{ + width: 33%; + margin-bottom: 36px; + display: inline-block; + vertical-align: top; +} + +.course-card { + // padding: 30px; + // padding-bottom: 18px; + // margin-bottom: 36px; + background: #fff; + border-radius: 8px; + // margin-right: 35px; + + // .cor-icon { + // position: absolute; + // left: 100px; + // top: 54px; + // border-radius: 50%; + // background: rgba(88, 138, 252, 0.37); + + // .el-icon-caret-right { + // font-size: 36px; + // color: #588afc; + // } + // } + .course-image-box { + position: relative; + width: 100%; + height: 100%; + ::v-deep .el-image{ + border-radius: 4px !important; + } + .course-image { + width: 100%; + height: 100%; + } + .course-type { + position: absolute; + top: 5px; + right: 0px; + width: 90px; + height: 30px; + line-height: 30px; + text-align: center; + background-color: #292828; + opacity: 0.4; + border-top-left-radius: 15px; + border-bottom-left-radius: 15px; + color: #ffffff; + -moz-user-select: none; /*火狐*/ + -webkit-user-select: none; /*webkit浏览器*/ + -ms-user-select: none; /*IE10*/ + -khtml-user-select: none; /*早期浏览器*/ + user-select: none; + } + .course-type-title { + position: absolute; + top: 5px; + right: 0px; + width: 90px; + height: 30px; + line-height: 30px; + text-align: center; + color: #ffffff; + -moz-user-select: none; /*火狐*/ + -webkit-user-select: none; /*webkit浏览器*/ + -ms-user-select: none; /*IE10*/ + -khtml-user-select: none; /*早期浏览器*/ + user-select: none; + } + } + .course-title { + height: 44px; + // margin: 10px 0; + margin: 10px 0 10px 0px; + line-height: 24px; + font-size: 16px; + font-weight: 600; + color: #333333; + -moz-user-select: none; /*火狐*/ + -webkit-user-select: none; /*webkit浏览器*/ + -ms-user-select: none; /*IE10*/ + -khtml-user-select: none; /*早期浏览器*/ + user-select: none; + } + .course-info { //图片下面的一行信息 + // margin: 5px 15px; + // padding-bottom: 10px; + display: flex; + justify-content: space-between; + line-height: 30px; + .course-info-user{ + font-size: 14px; + color: #6E7B84; + width: 60%; + .course-info-author{ + + } + .course-info-studys { + margin-left: 12px; + -moz-user-select: none; /*火狐*/ + -webkit-user-select: none; /*webkit浏览器*/ + -ms-user-select: none; /*IE10*/ + -khtml-user-select: none; /*早期浏览器*/ + user-select: none; + } + } + .course-info-score{ + display:flex; + width: 40%; + ::v-deep .cor-praises { + // position: absolute; + -moz-user-select: none; /*火狐*/ + -webkit-user-select: none; /*webkit浏览器*/ + -ms-user-select: none; /*IE10*/ + -khtml-user-select: none; /*早期浏览器*/ + user-select: none; + .interact-bar-btn { + margin-top: -2px; + min-width: 26px !important; + width: 32px; + height: 20px; + background:rgba(237, 239, 240,0.5); + border-radius: 20px; + margin-top: 4px; + margin-right: 12px; + .interact-bar-value { + display: none; + } + .svg-icon{ + font-size: 12px !important; + margin-left: 10px; + margin-bottom: 6px; + } + } + } + .course-score-value { + font-size: 14px; + color: #FA6400; + text-align: right; + margin-left: 5px; + font-family: "Arial"; + // font-size: 30px; + } + .course-score-no { + text-align: right; + font-size: 14px; + color: #6B7C85; + } + + } + } + +} +//以下是多分辨率的控制，注意，只是一些样式的高度，宽度，大小控制，非大小控制不要在这里写 @media screen and (max-width: 1366px){ - .xcontent{ - // width: 1000px; - // margin: 0px auto; + .xcontent2{ + width: 1100px; + padding: 20px 5px; } - .index-course{ - // width: 25%; + .xcontent2-minor{ + width: 234px; } - .course-index{ - // width: 33.3333%; + .portal-ranking{ + padding: 30px 15px; + } + .course-card { + padding:20px; + margin-right: 20px; + .course-image-box { + width: 200px; + height: 114px; + } } - .portal-model-btn{width: 300px;} - .xpage-right{width: 300px;} } @media screen and (max-width: 1680px) and (min-width:1367px){ - .xcontent{ - // width: 1260px; - // margin: 0px auto; - // width: 100%; - // margin: 0px 87px; + .xcontent2{ + width: 1366px; + padding: 30px 20px; } - .index-course{ - // width: 20%; - // width: 33.3333%; + .xcontent2-minor{ + width: 300px; } - .course-index{ - // width: 25%; - // width: 33.3333%; + .portal-ranking{ + padding: 30px 20px; + } + .course-card { + padding:25px; + margin-right: 25px; + .course-image-box { + width: 285px; + height: 160px; + } } - .portal-model-btn{width: 410px;} - .xpage-right{width: 410px;} } @media screen and (max-width: 1920px) and (min-width: 1681px){ - .xcontent{ - // width: 1520px; - // margin: 0px auto; - // width: 100%; - // margin: 0px 87px; + .xcontent2{ + width: 1640px; + padding: 30px 26px; } - .index-course{ - // width: 16.6666666667%; - width: 33.3333%; + .xcontent2-minor{ + width: 400px; } - .course-index{ - // width: 20%; - width: 33.3333%; + + .portal-ranking{ + padding: 30px 30px; + } + .course-card { + padding:25px; + margin-right: 25px; + .course-image-box { + width: 320px; + height: 180px; + } } - .portal-model-btn{width: 410px;} - .xpage-right{width: 410px;} } @media screen and (min-width: 1921px){ - .xcontent{ - // width: 1520px; - // margin: 0px auto; + .xcontent2{ + width: 1880px; + padding: 30px 26px; } - .index-course{ - // width: 16.6666666667%; - // width: 33.3333%; + .xcontent2-minor{ + width: 400px; } - .course-index{ - // width: 20%; - // width: 33.3333%; + + .portal-ranking{ + padding: 30px 30px; } - .portal-model-btn{width: 410px;} - .xpage-right{width: 410px;} + .course-card { + padding:25px; + margin-right: 25px; + .course-image-box { + width: 340px; + height: 191px; + } + } + } diff --git a/src/components/Portal/guideBox.vue b/src/components/Portal/guideBox.vue index 97e08ee5..fab31d75 100644 --- a/src/components/Portal/guideBox.vue +++ b/src/components/Portal/guideBox.vue @@ -96,9 +96,12 @@ }, showImg(item) { - this.description = item.description; - this.resonimg = []; - this.resonimg = item.images; + this.resonimg = []; + if(item){ + this.description = item.description; + this.resonimg = item.images; + } + // this.swiper.update(); }, notYet() { diff --git a/src/views/portal/article/Detail.vue b/src/views/portal/article/Detail.vue index 6d47bff3..86ad5cce 100644 --- a/src/views/portal/article/Detail.vue +++ b/src/views/portal/article/Detail.vue @@ -3,14 +3,13 @@
-
- -
-
+
+
+
-
+
文章列表 / @@ -21,7 +20,7 @@
-
+
{{authorSign}}
@@ -39,24 +38,27 @@
-
+
-
- -
+
+ +
-
- +
- 写文章 -
-

贡献榜

-
    +
    + + 写文章 +
    + +
    +

    贡献榜

    +
    • @@ -192,10 +194,11 @@ export default { //console.log(el_anking.clientWidth,'clientWidth'); //el_anking.wid let innerHeight = document.querySelector('#article-index').clientHeight + let outerWidth = el_anking.clientWidth; let outerHeight = document.documentElement.clientHeight let scrollTop = document.documentElement.scrollTop if(scrollTop > 400) { - document.querySelector('#articleAnking').style.cssText = "position: fixed;top: 0;width:242.5px"; + document.querySelector('#articleAnking').style.cssText = "position: fixed;top: 0;width:"+outerWidth+"px"; } else { document.querySelector('#articleAnking').style.cssText = "position: static"; } diff --git a/src/views/portal/article/Index.vue b/src/views/portal/article/Index.vue index a5c860ad..c5f45dc4 100644 --- a/src/views/portal/article/Index.vue +++ b/src/views/portal/article/Index.vue @@ -4,90 +4,80 @@
    -
    -
    -
    -
    -
    -
    -
    - - +
    +
    +
    +
    +
    +
    +
    + 最热 + 最新 +
    +
    -
    -
    -
    - 最热 - 最新 -
    - -
    -
    -
    -
    - - -
    -
    -
    {{article.sysCreateTime}}
    - -
    -     - -
    - -
    - -
    -
    {{ article.summary }}
    -
    -     -
    - -
    - +
    +
    +
    + + +
    +
    +
    {{article.sysCreateTime}}
     -
    - -
    -
    - -
    -
    - -
    - + +
    + +
    + +
    +
    {{ article.summary }}
    +
    +     +
    + +
    + +
    +     +
    + +
    +
    + +
    +
    + +
    + +
    -
    - -
    - 加载更多 - 数据加载中 - 没有更多数据了 - 没有查询到相关内容 -
    -
    - + +
    + 加载更多 + 数据加载中 + 没有更多数据了 + 没有查询到相关内容 +
    +
    -
    -
    - -
    -
    - 写文章 -
    -

    贡献榜

    -
      +
      +
      +
      +
      +
      + + 写文章 +
      +
      +
      +

      贡献榜

      +
      • @@ -119,12 +109,7 @@
      - - - - -
      @@ -194,7 +179,10 @@ export default { // let el_anking = document.querySelector('#articleAnking'); // this.ankingWidth=el_anking.clientWidth; //console.log(el_anking.clientWidth,'clientWidth'); - this.articleList.keyword = this.$route.query.keyword; + if(this.$route.query){ + this.articleList.keyword = this.$route.query.keyword; + } + if(this.articleList.keyword != '') { this.isSeach = true; } @@ -243,6 +231,7 @@ export default { //el_anking.wid let innerHeight = document.querySelector('#article-list-content').clientHeight let outerHeight = document.documentElement.clientHeight + let outerWidth = el_anking.clientWidth; let scrollTop = document.documentElement.scrollTop if ((outerHeight + scrollTop + 350) >= innerHeight) { if(this.moreState == 1) { @@ -265,7 +254,7 @@ export default { // } // } if(scrollTop > 400) { - document.querySelector('#articleAnking').style.cssText = "position: fixed;top: 0;width:242.5px"; + document.querySelector('#articleAnking').style.cssText = "position: fixed;top: 0;width:"+outerWidth+"px"; } else { document.querySelector('#articleAnking').style.cssText = "position: static"; } @@ -409,7 +398,7 @@ export default { diff --git a/src/views/portal/qa/Answer.vue b/src/views/portal/qa/Answer.vue index 8a56ee54..986a2ca4 100644 --- a/src/views/portal/qa/Answer.vue +++ b/src/views/portal/qa/Answer.vue @@ -3,9 +3,9 @@
      -
      -
      -
      +
      +
      +
      @@ -229,16 +229,16 @@
      -
      +
      -
      +
      提问题
      -
      -

      贡献榜

      -
        +
        +

        贡献榜

        +
        • diff --git a/src/views/portal/qa/Index.vue b/src/views/portal/qa/Index.vue index d8311de5..7d845f30 100644 --- a/src/views/portal/qa/Index.vue +++ b/src/views/portal/qa/Index.vue @@ -3,86 +3,86 @@
          - +
          -
          -
          - - - - - - 最热 - - - 最新 - - 精华问题 - - - - 全部 - - - 待解决 - - 已解决 - - -
          -
          -
          -
          -
          -
          - 【待解决】 - 【已解决】 - -
          -
          - {{qa.sysCreateTime}} -
          -
          -
          -
          -
          - +
          +
          +
          +
          +
          + + + 最热 + + + 最新 + + 精华问题 + + + + 全部 + + + 待解决 + + 已解决 + +
          +
          +
          +
          +
          +
          +
          + 【待解决】 + 【已解决】 + +
          +
          + {{qa.sysCreateTime}}
          -
          - -
          -
          -
          -
          +
          +
          +
          + +
          +
          + +
          +
          + +
          +
          +
          -
          -
          - 加载更多 - 数据加载中 - 没有更多数据了 - 没有查询到相关内容 -
          -
          +
          + 加载更多 + 数据加载中 + 没有更多数据了 + 没有查询到相关内容 +
          +
          +
          - - +
          -
          +
          提问题
          -
          -

          贡献榜

          -
            +
            +

            贡献榜

            +
            • @@ -109,11 +109,10 @@
          - +
          -
          @@ -215,7 +214,7 @@ export default { let key = 'qa'; apiPlace.detail(key).then(res=>{ console.log(res) - let lmj = JSON.parse(res.result.content) + let lmj = JSON.parse(res.result.content) this.resonimg = lmj[0] console.log(this.resonimg.image) })