ZhangXianQiang
2024-05-17 9f5a532c9213a34c7da9271cffd0ec2eb90461b4
src/views/onlineStudy/file.vue
@@ -31,14 +31,16 @@
      </el-table-column>
      <el-table-column prop="contentType" :formatter="typeFormatter" label="文件类型">
      </el-table-column>
      <el-table-column label="文件内容">
      <el-table-column label="文件内容" width="240">
        <template slot-scope="scope">
          <video controls v-if="scope.row.contentType === 'video'" :src="'/api/files/' + scope.row.contentUrl.url"
            class="showContent" />
          <img v-if="scope.row.contentType === 'img'" :src="'/api/files/' + scope.row.contentUrl.url"
            class="showContent" />
          <el-link type="primary" v-if="scope.row.contentType === 'pdf'"
            class="showContent" @click="checkPdf('/api/files/' + scope.row.contentUrl.url)">点击查看</el-link>
          <el-image v-if="scope.row.contentType === 'img'" :src="'/api/files/' + scope.row.contentUrl.url"
            class="showContent"></el-image>
          <!-- <img v-if="scope.row.contentType === 'img'" :src="'/api/files/' + scope.row.contentUrl.url"
            class="showContent" /> -->
          <el-link type="primary" v-if="scope.row.contentType === 'pdf'" class="showContent"
            @click="checkPdf('/api/files/' + scope.row.contentUrl.url)">点击查看</el-link>
        </template>
      </el-table-column>
      <el-table-column prop="attachment" label="附件">
@@ -297,8 +299,9 @@
<style scoped>
.showContent {
  width: 200px;
  height: 100px;
  width: 100%;
  min-height: 80px;
  object-fit: contain;
}
.warp {
@@ -308,4 +311,9 @@
.search {
  margin-top: 10px;
}
::v-deep .el-image__error {
  position: absolute;
  top: 0;
  bottom: 0;
}
</style>