页面显示更新

zxl

2025-07-17 1f233d9f5f5dafb6914fb488cd82065a8deb3e6c

 manager/src/views/video/VideoList.vue

@@ -55,11 +55,16 @@
        >
      </Form>

      <Row class="operation padding-row">
        <Button @click="recreateEsIndex" type="primary">重新构建es索引</Button>
      </Row>

      <Modal
        v-model="playVideoShow"
        :title="playVideoTitle"
        width="800"
        :mask-closable="false"
        @close="playVideoClose"
      >
        <div class="video-warp">
          <video :src="playVideoUrl" autoplay controls style="width: 768px;height: 432px"/>
@@ -72,7 +77,7 @@
      <Modal
        v-model="auditingShow"
        title="视频审核"
        width="800"
        width="1200"
        :loading="auditingLoading"
        :mask-closable="false"
      >
@@ -92,11 +97,61 @@
              </div>
            </div>
          </Form-item>
          <Form-item label="视频时长：" :label-width="72">
          <Form-item v-if="detail.videoContentType === 'video'" label="视频时长：" :label-width="72">
            <div>{{formatSeconds(detail.videoDuration)}}</div>
          </Form-item>
          <Form-item class="video-warp" :label-width="0">
            <video :src="detail.videoUrl" autoplay controls style="width: 768px;height: 432px"/>
          <Form-item v-if="detail.videoContentType === 'img'" label="图片张数：" :label-width="72">
            <div>{{detail.imgs.length}}</div>
          </Form-item>
          <Form-item v-if="detail.videoContentType === 'video'" class="video-warp" :label-width="0">
            <Row>
              <Col span="11">
                <video :src="detail.videoUrl" autoplay controls style="width: 500px;height: 300px"/>
              </Col>
              <Col span="13" style="max-height: 300px;overflow-y: scroll">
                <Row v-for="goods in detail.goodsList" :key="goods.goodsId" style="width: 100%">
                  <Row style="width:100%;align-items: center">
                    <Col span="6">
                      <img :src="goods.thumbnail" style="width: 100px;height: 100px"/>
                    </Col>
                    <Col span="10">
                      <p>商品名称: {{ goods.goodsName }}</p>
                    </Col>
                    <Col span="4">
                      <p>商品单价: ￥{{ goods.price }}</p>
                    </Col>
                    <Col span="4">
                      <p>商品数量: {{ goods.goodsNum }}</p>
                    </Col>
                  </Row>
                </Row>
              </Col>
            </Row>

          </Form-item>
          <Form-item v-if="detail.videoContentType === 'img'" :label-width="0">
            <div style="display: flex;flex-direction: row;flex-wrap: wrap">
              <div v-for="img in detail.imgs" :key="img" class="img-warp">
                <img :src="img" class="image">
              </div>
              <Row v-for="goods in detail.goodsList" :key="goods.goodsId" style="width: 100%">
                <Row style="width:100%;align-items: center; padding: 5px 10px">
                  <Col span="6">
                    <img :src="goods.thumbnail" style="width: 100px;height: 100px"/>
                  </Col>
                  <Col span="10">
                    <p>商品名称: {{ goods.goodsName }}</p>
                  </Col>
                  <Col span="4">
                    <p>商品单价: ￥{{ goods.price }}</p>
                  </Col>
                  <Col span="4">
                    <p>商品数量: {{ goods.goodsNum }}</p>
                  </Col>
                </Row>
              </Row>
            </div>

          </Form-item>
          <Form-item label="审核结果：" :label-width="100" prop="result">
            <RadioGroup v-model="auditingForm.result">
@@ -152,7 +207,7 @@
          </div>
        </template>
        <template slot-scope="{ row, index }" slot="videoFileKey">
          <div class="play-text" @click="playVideo(row.videoFileKey, row.title)">点击播放</div>
          <div v-if="row.videoContentType === 'video'" class="play-text" @click="playVideo(row.videoFileKey, row.title)">点击播放</div>
        </template>
        <template slot-scope="{ row, index }" slot="videoDuration">
          <div>{{formatSeconds(row.videoDuration)}}</div>
@@ -189,13 +244,14 @@
</template>

<script>
import {getVideos, recommendSet, getVideoById, auditingVideo, up, down} from "@/api/video";
import {getVideos, recommendSet, getVideoById, auditingVideo, up, down, recreateIndex} from "@/api/video";
import {getVideoTagList} from "@/api/videoTag";
import {getFilePreview} from "@/api/file";
import Editor from '@/components/editor/index.vue'
import GoodsExpandRow from '@/views/video/GoodsExpandRow'
export default {
  name: "VideoList",
  components: {Editor},
  components: {Editor,GoodsExpandRow},
  data() {
    return {
      videoDownForm: {
@@ -266,6 +322,17 @@
          align: 'center'
        },
        {
          width: 60,
          type: 'expand',
          render: (h, params) => {
            return h(GoodsExpandRow, {
              props: {
                goodsList: params.row.goodsList
              }
            })
          }
        },
        {
          title: "标题",
          key: "title",
          minWidth: 240,
@@ -324,7 +391,7 @@
        {
          title: "权重",
          key: "weight",
          width: 170,
          width: 80,
        },
        {
          title: "状态",
@@ -352,6 +419,11 @@
    this.getTags('')
  },
  methods: {
    recreateEsIndex() {
      recreateIndex().then(res => {
        this.$Message.success(res.msg)
      })
    },
    // 秒转x分x秒
    formatSeconds(seconds) {
      if (isNaN(seconds) || seconds < 0) return '0秒';
@@ -566,11 +638,18 @@
  cursor: pointer;
}
.video-warp {
  width: 786px;
  height: 432px;
  width: 100%;
  height: 440px;
}
.data-item {
  display: flex;
  align-items: center;
}
.img-warp {
  padding: 10px;
}
.image {
  width: 150px;
  height: 200px;
}
</style>