zhongshujie
1 天以前 ce7cf2f67ec29aef55a889574942c58c8d7737bd
src/views/chronology/floatingWindow.vue
@@ -10,9 +10,9 @@
        <div class="journalInformation">{{ info.IssueNumber }}</div>
      </div>
      <div class="contentBox">
       <span>{{ info.author }}</span>
       <span style="margin-left: 20px"> {{ info.authorsUnits }}</span>
       <span></span>
        <span>{{ info.author }}</span>
        <span style="margin-left: 20px"> {{ info.authorsUnits }}</span>
        <span></span>
      </div>
      <div class="abstract">
        摘要:
@@ -43,44 +43,40 @@
      </div>
    </div>
    <div class="videoBox" v-if="info.cmsItemType === 'video'">
      <video
        width="370"
        height="240"
        controls
        :src="info.requestCtx"
      ></video>
      <video width="370" height="200" controls :src="info.requestCtx"></video>
      <div>
        <div class="subtitle">
          <div class="source">{{ info.name }}</div>
          <div class="source">{{ info.source }}</div>
          <div class="journalInformation">2005 3月 第40卷 第4期</div>
        </div>
        <div class="contentBox" style="text-align: left">
        </div>
          <div class="contentBox" style="text-align: left">
          <div class="audioContent" v-html="info.abstract"></div>
        </div></div>
      </div>
    </div>
    <div class="audioBox" v-if="info.cmsItemType === 'audio'">
      <div style="text-align: center">
        <audio
          style="width: 100%"
          style="width: 90%"
          src="https://www.w3schools.com/html/horse.ogg"
          controls
        ></audio>
      </div>
      <div>
        <div class="subtitle">
          <div class="source">中国中医基础医学杂志</div>
          <div class="source">{{ info.source }}</div>
          <div class="journalInformation">2005 3月 第40卷 第4期</div>
        </div>
        <div class="contentBox" style="text-align: left">
          <p>王睿 中国科学院大连化学物理研究所</p>
          <p>王睿 中国科学院大连化学物理研究所</p>
          <p>王睿 中国科学院大连化学物理研究所</p>
          <p>王睿 中国科学院大连化学物理研究所</p>
          <p>王睿 中国科学院大连化学物理研究所</p>
          <div class="audioContent" v-html="info.abstract"></div>
        </div>
      </div>
    </div>
    <div class="btnBox">
      <div class="detailBtn">查看详情</div>
    </div>
  </div>
</template>
@@ -94,12 +90,19 @@
      default: () => {},
    },
  },
  data() {
    return {};
  },
  mounted() {
    console.log(this.info);
  },
};
</script>
<style scoped>
.dialogBox {
  width: 400px;
  width: 524px;
  height: 100%;
  background-color: #fdf8f0;
  position: relative;
@@ -175,9 +178,32 @@
  font-weight: 700;
  color: #8f7a5a;
}
.source{
.source {
  max-width: 300px;
  overflow: hidden;
  white-space: normal;
}
.btnBox {
  text-align: center;
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
.detailBtn {
  width: 100px;
  height: 30px;
  border-radius: 30px;
  color: #8f7a5a;
  line-height: 30px;
  cursor: pointer;
  border: 1px solid #8f7a5a;
}
.audioContent{
  white-space: pre-line;
  line-height: 18px;
  margin-top: 10px;
  max-height: 100px;
  overflow-y: auto;
  margin-top: 20px;
}
</style>