Forráskód Böngészése

认证通v1.7.5版本提测

yuwenjun1997 2 éve
szülő
commit
10de83b16e

+ 2 - 0
apis/index.js

@@ -2,6 +2,7 @@ import authApi from './module/auth'
 import commonApi from './module/common'
 import userApi from './module/user'
 import docApi from './module/doc'
+import challengeApi from './module/challenge'
 
 export default ($axios) => {
   return {
@@ -9,5 +10,6 @@ export default ($axios) => {
     ...authApi($axios),
     ...userApi($axios),
     ...docApi($axios),
+    ...challengeApi($axios),
   }
 }

+ 18 - 0
apis/module/challenge.js

@@ -0,0 +1,18 @@
+// 抖音挑战赛
+export default ($axios) => {
+  const challengeApis = {}
+
+  challengeApis.fetchVideoList = (params = {}) =>
+    $axios.get('/wx/auth/get/published/video/list', { params })
+
+  challengeApis.publishVideoSave = (data = {}) =>
+    $axios.post('/wx/auth/save/video/info', data)
+
+  challengeApis.checkActivityPublish = (data = {}) =>
+    $axios.post('/wx/auth/check/video/info', data)
+
+  challengeApis.fetchActivityStatus = (params = {}) =>
+    $axios.get('/wx/auth/get/activitty', { params })
+
+  return challengeApis
+}

+ 4 - 6
components/SimpleOssUpload/index.vue

@@ -28,7 +28,9 @@
             ></el-progress>
             <div class="status">
               <span>{{ file.percentage }}%</span>
-              <span>上传中</span>
+              <span v-if="file.status === 1">上传成功</span>
+              <span v-if="file.status === 2">上传中</span>
+              <span v-if="file.status === 0">上传失败</span>
             </div>
           </div>
         </div>
@@ -86,13 +88,9 @@ export default {
     // 取消上传
     async onAbortUpload(file, index) {
       try {
-        await this.$confirm('确定删除该视频?', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-        })
         this.fileList.splice(index, 1)
         const { checkpoint } = file
-        this.ossUpload.abortMultipartUpload(checkpoint)
+        await this.ossUpload.abortMultipartUpload(checkpoint)
       } catch (error) {
         console.log(error)
       }

+ 14 - 0
components/SimpleOssUpload/upload.js

@@ -53,6 +53,8 @@ class OssUploadUtils {
     try {
       // 指定上传到examplebucket的Object名称,例如exampleobject.txt。
       rawFile.bucketName = this.generateFileName(rawFile)
+
+      rawFile.uuid = this.formatOssName(rawFile)
       // 分片上传
       const res = await this.client.multipartUpload(
         rawFile.bucketName,
@@ -133,6 +135,18 @@ class OssUploadUtils {
     return name
   }
 
+  // 处理ossName
+  formatOssName(rawfile) {
+    const name = rawfile.name.replace(
+      /([^\\/]+)\.([^\\/]+)/i,
+      (match, $1, $2) => {
+        const lastName = rawfile.uuid + '.' + $2
+        return lastName
+      }
+    )
+    return name
+  }
+
   // 处理文件字段信息
   generateRawfile(file) {
     return {

+ 1 - 1
middleware/intercept.js

@@ -67,7 +67,7 @@ async function initTemplateEntry(context) {
       return
     }
 
-    if (dev !== 'development' || true) {
+    if (dev !== 'development') {
       // 默认模板
       if (prefix === 'app') {
         if (isFixedTemplate(authUserId)) {

+ 23 - 5
pages/_template/ross/activity/challenge/index.vue

@@ -23,25 +23,43 @@ export default {
   layout: 'app-ross',
   data() {
     return {
-      status: 1,
+      activityState: 0,
     }
   },
   computed: {
-    ...mapGetters(['routePrefix']),
+    ...mapGetters(['routePrefix', 'authUserId']),
     activity() {
       const result = {
-        0: { type: 'end', text: '已结束' },
+        2: { type: 'end', text: '已结束' },
         1: { type: 'start', text: '进行中' },
-        2: { type: 'wait', text: '未开始' },
+        0: { type: 'wait', text: '未开始' },
       }
-      return result[this.status]
+      return result[this.activityState]
     },
   },
+  created() {
+    this.fetchActivityStatus()
+  },
   methods: {
     toDetail() {
+      if (this.activityState !== 1) {
+        this.$toast(`活动${this.activity.text}`)
+        return
+      }
       const url = `${this.routePrefix}/activity/challenge/list`
       this.$router.push(url)
     },
+    async fetchActivityStatus() {
+      try {
+        const res = await this.$http.api.fetchActivityStatus({
+          authUserId: this.authUserId,
+        })
+        if (!res.data) return
+        this.activityState = res.data.activityState
+      } catch (error) {
+        console.log(error)
+      }
+    },
   },
 }
 </script>

+ 121 - 13
pages/_template/ross/activity/challenge/list.vue

@@ -4,7 +4,11 @@
     <div class="page-content">
       <div class="control">
         <div class="search">
-          <el-input placeholder="搜索登录账户后四位或所属机构">
+          <el-input
+            placeholder="搜索登录账户后四位或所属机构"
+            @keyup.enter="getList"
+            v-model="listQuery.clubUserName"
+          >
             <i slot="prefix" class="el-input__icon el-icon-search"></i>
           </el-input>
         </div>
@@ -13,28 +17,34 @@
       <div class="video-content">
         <div class="title">视频排名</div>
         <div class="video-list">
-          <div class="video" v-for="(i, index) in 7" :key="index">
+          <div
+            class="video"
+            v-for="(item, index) in list"
+            :key="index"
+            @click="onPlay(item)"
+          >
             <div class="cover">
-              <img src="https://picsum.photos/288/198" alt="" />
-              <div class="name">医用透明质酸钠凝胶</div>
+              <img :src="item.cover" alt="" />
+              <div class="name">{{ item.title }}</div>
               <div class="rank" :class="'rank-0' + (index + 1)">
                 {{ index + 1 }}
               </div>
-              <div class="play"></div>
+              <div class="play" @click="onPlay(item)"></div>
             </div>
             <div class="info">
-              <div class="club-name">上海禾雅堂科技有限公司</div>
-              <div class="mobile">137****6611</div>
+              <div class="club-name">{{ item.authParty }}</div>
+              <div class="mobile">{{ item.userName | mobileFormat }}</div>
             </div>
             <div class="foot">
-              <div class="date">2022-09-28</div>
-              <div class="praise">90</div>
-              <div class="pv">513</div>
+              <div class="date">{{ item.releaseTime | dateFormat }}</div>
+              <div class="praise">{{ item.diggCount }}</div>
+              <div class="pv">{{ item.diggCount }}</div>
             </div>
           </div>
         </div>
         <!-- 列表为空 -->
         <SimpleEmpty
+          v-if="!total"
           name="icon-empty-video.png"
           description="敬请期待~"
         ></SimpleEmpty>
@@ -47,6 +57,11 @@
           @confirm="onConfirm"
           @cancel="onCancel"
         ></SimpleDialog>
+
+        <SimpleVideoPlayer
+          :videoSrc="videoUrl"
+          ref="videoPlayer"
+        ></SimpleVideoPlayer>
       </div>
     </div>
   </div>
@@ -64,27 +79,120 @@
 import { mapGetters } from 'vuex'
 export default {
   layout: 'app-ross',
+  filters: {
+    mobileFormat(mobile) {
+      return mobile ? mobile.replace(/^(\w{3})\w+(\w{4})$/, '$1****$2') : ''
+    },
+  },
   data() {
     return {
+      listQuery: {
+        clubUserName: '',
+        pageNum: 1,
+        pageSize: 10,
+        status: 1,
+      },
+      list: [],
+      total: 0,
       dialog: false,
       dialogOption: {
         confirmText: '确定',
         description: '抱歉,活动已结束,暂无法发布视频!',
         cancel: false,
       },
+      publishStatus: {},
+      publishInfo: {},
+      videoUrl: '',
     }
   },
   computed: {
-    ...mapGetters(['routePrefix']),
+    ...mapGetters(['routePrefix', 'accessToken', 'userInfo', 'authUserId']),
+  },
+  created() {
+    this.checkActivityPublish()
+    this.getList()
   },
   methods: {
-    onConfirm() {},
-    onCancel() {},
+    // 获取列表
+    getList() {
+      this.listQuery.pageNum = 1
+      this.list = []
+      this.fetchVideoList()
+    },
+    // 获取视频列表
+    async fetchVideoList() {
+      try {
+        this.listQuery.authUserId = this.authUserId
+        const res = await this.$http.api.fetchVideoList(this.listQuery)
+        this.list = res.data.list
+        this.total = res.data.total
+        this.listQuery.pageNum++
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    onConfirm() {
+      this.dialog = false
+      if (this.dialogOption.confirmText === '去认证') {
+        const path = `${this.routePrefix}/form/club-register`
+        this.$router.push(path)
+      }
+    },
+    onCancel() {
+      this.dialog = false
+    },
     // 去发布视频
     onPublish() {
+      if (!this.accessToken) {
+        this.$toast('请先登录')
+        this.formType = 'login'
+        this.$store.commit('app/SHOW_LOGIN')
+        return
+      }
+      if (!this.userInfo.authId) {
+        this.dialogOption.description = '抱歉,由于您未认证机构,无法参与!'
+        this.dialogOption.confirmText = '去认证'
+        this.dialog = true
+        return
+      }
+      if (this.publishInfo.activityState === 0) {
+        this.dialogOption.description = '抱歉,活动未开始!'
+        this.dialog = true
+        return
+      }
+      if (this.publishInfo.activityState === 2) {
+        this.dialogOption.description = '抱歉,活动已结束,暂无法发布视频!'
+        this.dialog = true
+        return
+      }
+      if (this.publishInfo.releaseStatus === 1) {
+        this.dialogOption.description =
+          '抱歉,平台规定每个用户只能发布一个视频,由于您已发布过视频,请勿再次发布!'
+        this.dialog = true
+        return
+      }
       const url = `${this.routePrefix}/activity/challenge/publish`
       this.$router.push(url)
     },
+    // 验证发布状态
+    async checkActivityPublish() {
+      if (!this.accessToken) return
+      const { authId, mobile } = this.userInfo
+      try {
+        const res = await this.$http.api.checkActivityPublish({
+          authId,
+          userName: mobile,
+        })
+        this.publishInfo = res.data
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    // 播放视频
+    onPlay(row) {
+      this.videoUrl = row.ossUrl
+      this.$refs.videoPlayer.open()
+    },
   },
 }
 </script>

+ 27 - 0
pages/_template/ross/activity/challenge/message.vue

@@ -11,17 +11,31 @@
         <a href="tel:0755-85885625">0755-85885625</a>
       </div>
     </div>
+    <div class="btn back" @click="onBack">返回</div>
   </div>
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 export default {
   layout: 'app-ross',
+  computed: {
+    ...mapGetters(['routePrefix']),
+  },
+  methods: {
+    onBack() {
+      const path = `${this.routePrefix}/activity/challenge`
+      this.$router.push(path)
+    },
+  },
 }
 </script>
 
 <style lang="scss" scoped>
 @media screen and (min-width: 768px) {
+  .btn.back {
+    display: none;
+  }
   .page-top {
     display: flex;
     align-items: center;
@@ -101,5 +115,18 @@ export default {
       }
     }
   }
+
+  .btn {
+    width: 85.6vw;
+    height: 12vw;
+    background: #f3920d;
+    border-radius: 0.2vw;
+    margin: 0 auto;
+    color: #fff;
+    text-align: center;
+    line-height: 12vw;
+    font-size: 3.6vw;
+    margin-top: 25.9vw;
+  }
 }
 </style>

+ 42 - 6
pages/_template/ross/activity/challenge/publish.vue

@@ -1,13 +1,15 @@
 <template>
   <div class="page">
     <div class="page-content">
-      <el-form label-position="top" :model="formData" :rules="rules">
+      <el-form label-position="top" :model="formData" :rules="rules" ref="form">
         <el-form-item label="发布抖音视:" prop="description">
           <el-input
             type="textarea"
             rows="6"
             v-model="formData.description"
             placeholder="添加作品描述,能让更多的人看到..."
+            maxlength="300"
+            show-word-limit
           ></el-input>
         </el-form-item>
         <el-form-item label="视频封面:" prop="coverImage">
@@ -39,21 +41,23 @@
       </div>
       <div class="control">
         <div class="button cancel">取消</div>
-        <div class="button publish">发布</div>
+        <div class="button publish" @click="onPublish">发布</div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 export default {
   layout: 'app-ross',
   data() {
     return {
       formData: {
-        coverImage: '',
+        coverImage: '111',
         fileUrl: '',
         description: '',
+        ossName: '',
       },
       rules: {
         coverImage: [
@@ -81,12 +85,43 @@ export default {
       coverList: [],
     }
   },
+  computed: {
+    ...mapGetters(['routePrefix', 'userInfo', 'authUserId']),
+  },
   methods: {
-    // 发票上传
+    // 发布视频
+    async onPublish() {
+      try {
+        await this.$refs.form.validate()
+        this.publishVideoSave()
+      } catch (error) {
+        console.log(error)
+      }
+    },
+
+    // 保存视频
+    async publishVideoSave() {
+      try {
+        const { authId, mobile } = this.userInfo
+        await this.$http.api.publishVideoSave({
+          authId,
+          authUserId: this.authUserId,
+          userName: mobile,
+          title: this.formData.description,
+          ossName: this.formData.ossName,
+          cover: this.formData.coverImage,
+          ossUrl: this.formData.fileUrl,
+        })
+        this.$router.replace(`${this.routePrefix}/activity/challenge/message`)
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    // 视频封面上传
     beforeCoverImageUpload(file) {
       const flag = file.size / 1024 / 1024 < 5
       if (!flag) {
-        this.$message.error('发票图片大小不能超过 5MB!')
+        this.$message.error('视屏封面图片大小不能超过 5MB!')
       }
       return flag
     },
@@ -94,13 +129,14 @@ export default {
       this.coverList = fileList
       this.formData.coverImage = response.data
     },
-    handleCoverImageRemove({ file, fileList }) {
+    handleCoverImageRemove() {
       this.coverList = []
       this.formData.coverImage = ''
     },
     // 视频上传成功
     onVideoUploadSuccess({ file, fileList }) {
       this.formData.fileUrl = file.url
+      this.formData.ossName = file.uuid
     },
   },
 }

+ 1 - 0
store/getters.js

@@ -15,6 +15,7 @@ export default {
   accessToken: (state) => state.user.userInfo.accessToken,
   clubUserId: (state) => state.user.userInfo.clubUserId,
   accountType: (state) => state.user.accountType,
+  mobile: (state) => state.user.userInfo.mobile,
   // 供应商相关
   supplierInfo: (state) => state.supplier.supplierInfo,
   authUserId: (state) => state.supplier.supplierInfo.authUserId,