样式修改

a5752dd7 · 杨广俊 · d141c1b7 · a5752dd7 · a5752dd7 · a5752dd7
--- a/src/components/business/yqy-hot-lecturer.vue
+++ b/src/components/business/yqy-hot-lecturer.vue
@@ -108,7 +108,7 @@ export default {
  &-wrapper {
    width: 100%;
    overflow: hidden;
-    height: px2rem(115px);
+    height: px2rem(125px);
    overflow-x: scroll;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: 0;
@@ -118,11 +118,11 @@ export default {
      flex-direction: columns;
      margin-left: px2rem(12px);
      width: px2rem(666px);
-      height: px2rem(133px);
+      // height: px2rem(130px);
      &-item {
        display: inline-block;
        width: px2rem(105px);
-        height: px2rem(107px);
+        height: px2rem(115px);
        margin: px2rem(3px);
        text-align: center;
        background: rgba(255, 255, 255, 1);
@@ -142,14 +142,14 @@ export default {
    img {
      width: px2rem(60px);
      height: px2rem(60px);
-      margin-top: px2rem(5px);
+      margin-top: px2rem(7px);
      border-radius: 50%;
    }
    span {
      display: inline-block;
      position: absolute;
      left: px2rem(14px);
-      top: px2rem(25px);
+      top: px2rem(27px);
      font-size: px2rem(12px);
      span {
        width: px2rem(50px);
@@ -178,14 +178,14 @@ export default {
 .disp-blc.lect-ks {
  position: relative;
  left: 0;
-  top: px2rem(-8px);
+  top: px2rem(-6px);
  font-size: px2rem(12px);
  color: #666;
 }
 .disp-blc.study-num {
  position: relative;
  left: 0;
-  top: px2rem(-10px);
+  top: px2rem(-8px);
  font-size: px2rem(11px);
  color: #999;
 }

--- a/src/components/business/yqy-teacher-list.1.vue
+++ b/src/components/business/yqy-teacher-list.1.vue
+<template>
+  <section>
+    <div class="font-style">
+      <div class="teach-opt">
+        <div class="teach-list">
+          <div
+            :class="index % 2 == 1 ? 'list-item mr0' : 'list-item'"
+            v-for="(item, index) in cParamData"
+            :key="index"
+            @click="gotoDetail(item)"
+          >
+            <div class="tea-img" :style="'background:'+ item.bgColor">
+              <!-- <img :src="item.doctorAvatarImg"> -->
+              <img :src="item.doctorImg">
+              <span class="learn-p">{{item.joinNum | yLocalString}}人已学</span>
+              <span class="learn-p-cnum">课程: 共{{item.resourceNum}}门</span>
+            </div>
+            <div class="tea-txt">
+              <div class="tea-name">
+                <span>{{item.doctorName}}</span>
+                <span class="tea-department">{{item.department}}</span>
+              </div>
+              <div class="tea-position">{{item.doctorHospital}}</div>
+            </div>
+          </div>
+          <div class="no-content" v-show="!cParamData.length">
+            <img class="no-content-img" src="../../images//no-content.png" alt=" ">
+            <span class="no-content-desc">暂无相关内容</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script>
+import { getWebPageUrl } from '@/utils'
+import { teacher } from "../../utils/buryingPoint";
+import { mapGetters } from "vuex";
+
+import YqyLecturerOrder from "@/components/business/yqy-lecturer-order";
+export default {
+  data() {
+    return {
+      col: 1, //0综合，1人气，2资源数，3姓名首字母
+      dir: 2, //1:正序 2：逆序,
+      list: []
+    };
+  },
+  components: {
+    YqyLecturerOrder
+  },
+  props: {
+    parmData: {
+      type: Array,
+      default: () => []
+    }
+  },
+  mounted() {},
+  computed: {
+    cParamData() {
+      if (this.parmData && this.parmData.length) {
+        return this.randomBg(this.parmData);
+      } else {
+        return this.randomBg(this.list);
+      }
+    }
+  },
+  methods: {
+    // 跳转到详情页面
+    gotoDetail(item) {
+      // this.$router.push({
+      //   path: "/teachersDetail",
+      //   query: {
+      //     id: item.doctorId
+      //   }
+      // });
+      let paramList = [
+        {
+          id: 699,
+          key: "pageUrl",
+          value: getWebPageUrl('appl/#/teachersDetail') + '?id=' + item.doctorId + '&from=' + 'appHome',
+          // value: "https://uat-phome.yunqueyi.com/appl/#/teachersDetail",
+          type: 4,
+          seqNo: 1
+        }
+      ];
+      rocNative.dispatchEventByModuleCode({
+        modeCode: 'M300',
+        jsonString: paramList
+      });
+      this.appBuryingPointEntrust({
+        ...teacher,
+        labelId: item.doctorId,
+        labelValue: item.doctorName
+      });
+    },
+
+    // 随机生成背景颜色
+    randomBg(d) {
+      for (let i = 0; i < d.length; i++) {
+        if (i % 4 == 0) {
+          d[i].bgColor = "#EBF6F1";
+        } else if (i % 4 == 1) {
+          d[i].bgColor = "#EDF3FA";
+        } else if (i % 4 == 2) {
+          d[i].bgColor = "#F0F0FA";
+        } else if (i % 4 == 3) {
+          d[i].bgColor = "#F6EFE6";
+        }
+      }
+      return d;
+    },
+
+    // 埋点
+    appBuryingPointEntrust(val) {
+      rocNative.appBuryingPointEntrust(val);
+    }
+  }
+};
+</script>
+
+<style>
+body {
+  background: #fff;
+}
+</style>
+<style lang="scss" scoped>
+body {
+  background: #fff;
+}
+
+@import "../../style/mixin";
+.no-content {
+  display: flex;
+  flex-direction: column;
+  margin: px2rem(40px) 0 px2rem(50px);
+  align-items: center;
+  img {
+    width: px2rem(125px);
+    height: px2rem(125px);
+  }
+  span {
+    height: px2rem(21px);
+    line-height: px2rem(21px);
+    font-size: px2rem(15px);
+    font-weight: 400;
+    color: rgba(153, 153, 153, 1);
+  }
+}
+
+.mint-header {
+  background-color: rgba($color: #000000, $alpha: 0);
+}
+
+.font-style {
+  width: 100%;
+  overflow: hidden;
+  @include sc(0.6rem, #666);
+}
+
+.teach-opt {
+  padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);
+
+  .teach-title {
+    font-size: px2rem(18px);
+    // padding-bottom: px2rem(0px);
+    color: #333;
+  }
+
+  .teach-list {
+    margin-top: px2rem(-14px);
+    overflow: hidden;
+  }
+
+  .opt-span {
+    span {
+      color: #449284;
+      font-size: px2rem(13px);
+      display: inline-block;
+      vertical-align: middle;
+      height: px2rem(10px);
+      line-height: px2rem(10px);
+
+      img {
+        display: inline-block;
+        width: px2rem(15px);
+        height: px2rem(15px);
+        vertical-align: middle;
+      }
+    }
+  }
+
+  .list-item {
+    width: px2rem(170px);
+    margin-right: px2rem(5px);
+    margin-top: px2rem(15px);
+    border: 1px solid rgba(0, 0, 0, 0.02);
+    border-radius: 0 0 px2rem(3px) px2rem(3px);
+    float: left;
+    box-shadow: 0 px2rem(4px) px2rem(6px) RGBA(0, 0, 0, 0.06);
+  }
+
+  .mr0 {
+    margin-right: 0;
+  }
+
+  .tea-txt {
+    padding: px2rem(5px) px2rem(7px);
+  }
+
+  .tea-img {
+    width: px2rem(170px);
+    height: px2rem(83px);
+    position: relative;
+    border-radius: px2rem(3px) px2rem(3px) 0 0;
+
+    img {
+      width: 100%;
+      height: 100%;
+      display: block;
+      border-radius: px2rem(3px) px2rem(3px) 0 0;
+    }
+
+    .learn-p {
+      padding-left: px2rem(6px);
+      position: absolute;
+      width: 100%;
+      left: 0;
+      bottom: 0;
+      background: #333;
+      background: linear-gradient(
+        to right,
+        RGBA(0, 0, 0, 0.2),
+        RGBA(0, 0, 0, 0)
+      );
+      // background: linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.34) 100%);
+      color: #fff;
+      font-size: px2rem(11px);
+      height: px2rem(20px);
+      line-height: px2rem(22px);
+      &-cnum {
+        position: absolute;
+        right: px2rem(8px);
+        bottom: 0;
+        color: #fff;
+        font-size: px2rem(11px);
+        height: px2rem(20px);
+        line-height: px2rem(22px);
+      }
+    }
+  }
+
+  .tea-name {
+    padding: 0;
+    color: #333;
+    font-size: px2rem(14px);
+    font-weight: 500;
+  }
+
+  .tea-department {
+    padding: 0;
+    color: #333;
+    font-size: px2rem(12px);
+    font-weight: 400;
+  }
+  .tea-position {
+    height: px2rem(30px);
+    font-size: px2rem(12px);
+    line-height: px2rem(15px);
+    color: #666;
+    font-weight: 400;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -webkit-line-clamp: 2;
+  }
+}
+
+.home-header {
+  height: px2rem(185px);
+  @include bis("../../images//headerTop.png");
+
+  .logo_img {
+    height: px2rem(85px);
+    width: px2rem(345px);
+    text-align: center;
+  }
+}
+.ellipsis-1 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+}
+.ellipsis-2 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+}
+</style>
--- a/src/components/business/yqy-teacher-list.vue
+++ b/src/components/business/yqy-teacher-list.vue
@@ -4,7 +4,7 @@
      <div class="teach-opt">
        <div class="teach-list">
          <div
-            :class="index % 2 == 1 ? 'list-item mr0' : 'list-item'"
+            :class="index % 2 == 1 ? 'list-item mr0' : 'list-item ml15'"
            v-for="(item, index) in cParamData"
            :key="index"
            @click="gotoDetail(item)"
@@ -160,7 +160,7 @@ body {
 }

 .teach-opt {
-  padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);
+  // padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);

  .teach-title {
    font-size: px2rem(18px);
@@ -201,6 +201,9 @@ body {
    box-shadow: 0 px2rem(4px) px2rem(6px) RGBA(0, 0, 0, 0.06);
  }

+  .ml15 {
+    margin-left: px2rem(15px);
+  }
  .mr0 {
    margin-right: 0;
  }