商家端订单列表

zxl

22 小时以前 e890f87ea274436461aacca1391bb9717240f210

 manager/src/views/kitchen/kitchenVideo.vue

@@ -112,6 +112,7 @@
              <FormItem label="视频">
                <video style="width: 150px;height: 150px"
                       controls
                       @loadedmetadata="getVideoDuration"
                       :poster="uploadVideoForm.showCoverUrl"
                       :autoplay="false"
                       id="remoteVideo" :src="uploadVideoForm.showVideoUrl"
@@ -251,9 +252,12 @@
        @on-selection-change="showSelect"
      >
        <template slot-scope="{ row, index }" slot="typeList">
          <div v-for="(tag, index) in row.typeList" :key="'tag' + index" style="margin-top: 5px">
            <Tag color="red">{{ tag.typeName }}</Tag>
          <div style="display: flex;flex-wrap: wrap">
            <div v-for="(tag, index) in row.typeList" :key="'tag' + index" style="margin-top: 5px">
              <Tag color="red">{{ tag.typeName }}</Tag>
            </div>
          </div>

        </template>
        <template slot-scope="{ row, index }" slot="videoFileKey">
          <div class="play-text" @click="playVideo(row.videoFileKey, row.title)">点击播放</div>
@@ -283,9 +287,30 @@
          <Button type="success" size="small" style="margin-right: 5px"
                  @click="deleteHealthVideo(row)">删除
          </Button>
          <Button type="error" size="small" style="margin-right: 5px" v-if="row.status === '1'"
                  @click="generalQrCode(row)">生成二维码
          </Button>
        </template>
      </Table>

      </Table>
      <Modal
        v-model="showGeneralQrCode"
        title="二维码"
        width="800"
        :mask-closable="false"
      >
        <vue-qr
          :text="QRCodeUrl"
          :margin="0"
          colorDark="#000"
          colorLight="#fff"
          :size="150"
        ></vue-qr>
        <div slot="footer">
          <Button type="text" @click="closeGeneralQrCode">关闭</Button>
          <!--          <Button type="primary" @click="generalQrCode">确认</Button>-->
        </div>
      </Modal>
      <Row type="flex" justify="end" class="mt_10">
        <Page
          :current="searchForm.pageNumber"
@@ -301,6 +326,8 @@
        ></Page>
      </Row>
    </Card>


  </div>
</template>

@@ -312,12 +339,17 @@
import COS from 'cos-js-sdk-v5';
import {getFileKey} from "@/utils/file.js";
import {getKitchenTypeAllList} from "@/api/kitchen";
import vueQr from "vue-qr";

export default {
  name: "VideoList",
  components: {Editor},
  components: {Editor,"vue-qr": vueQr},
  data() {
    return {
      showGeneralQrCode:false,
      codeUrl: this.QRcodeBaseUrl+ '/scanpage/cook',
      QRCodeUrl:'',

      videoDownForm: {
        id: '',
        reason: ''
@@ -393,7 +425,7 @@
        checkKitchenType: [
          {
            required: true,
            message: '请选择厨神标签',
            message: '请选择厨神标签且不能超过5个',
            trigger: 'blur',
            validator: (rule, value, callback) => {
              console.log('验证值:-------------->', value, '类型:', typeof value);
@@ -461,7 +493,7 @@
        {
          title: "视频分类",
          key: "typeList",
          width: 180,
          width: 310,
          slot: "typeList",
        },
        {
@@ -520,6 +552,7 @@
          slot: "action",
          align: "center",
          width: 200,
          fixed: "right",
        },
      ],
      data: [], // 表单数据
@@ -549,6 +582,23 @@
    this.getTypes('')
  },
  methods: {
    closeGeneralQrCode(){
      this.showGeneralQrCode = false;
    },

    generalQrCode(row){
      console.log(row)
      this.QRCodeUrl = '';
      this.showGeneralQrCode = true
      console.log('-------------------->',row);
      //shareType可能会是动态的，会加判断视频来源

      this.QRCodeUrl = this.codeUrl + '?shareType=cook' + '&videoId='+ row.id + '&source=' + 'system';
      //TODO 根据视频信息中的 ，作者id获得用户 判断 来源 ，用户作者的uniid为null则是系统上传，不为空则是用户上传
      console.log(this.QRCodeUrl)
      // console.log(this.QRCodeUrl)
    },

    // 秒转x分x秒
    formatSeconds(seconds) {
      if (isNaN(seconds) || seconds < 0) return '0秒';
@@ -580,6 +630,12 @@
      this.$set(this.uploadVideoForm, 'showCoverUrl', '');
      this.$set(this.uploadVideoForm, 'temp', new Date().getTime());
    },
    calculateVideoFit(width, height) {
      const videoRatio = width / height;
      // 规则2：竖屏视频（如9:16）
      if (videoRatio < 0.8) return 'cover';
      return 'contain';
    },
    //重新上传视频
    clearVideo() {
      this.clearCoverImage();
@@ -588,6 +644,16 @@
      this.$set(this.uploadVideoForm, 'temp', new Date().getTime());
      console.log(this.uploadVideoForm)
    },
    getVideoDuration(e){
      const duration = this.$refs.healthVideoInfo.duration;
      const videoWidth = this.$refs.healthVideoInfo.videoWidth;
      const videoHeight = this.$refs.healthVideoInfo.videoHeight;
      // 根据宽高比选择视频填充模式
      const fitType = this.calculateVideoFit(videoWidth, videoHeight)
      this.uploadVideoForm.videoFit = fitType
      console.log('------视频信息3------------>', videoWidth,videoHeight,fitType)
      this.uploadVideoForm.videoDuration = Math.floor(duration);
    },
    // 视频上架
    videoUp(row) {
      this.$Modal.confirm({