Merge branch 'develop3.0' of http://106.12.23.251:10080/TEAMMODEL/TEAMModelOS into develop3.0

TEAMModelOS/ClientApp/src/common/UploadFile.vue

@@ -21,15 +21,11 @@
     import '@/icons/svg/loading3.svg'
     import sha1 from 'js-sha1'
     import { Array } from 'core-js'
-    //require('@/utils/azure-storage-blob.js') //v10
     const { BlobServiceClient } = require("@azure/storage-blob")//v12
     export default {
         data() {
             return {
-                urlString: '',
-                blobContainer: '',
                 containerURL: undefined,
-                sasString: '',
                 uploadedList: [],
                 contentTypes: [
                     ['JPG', 'JPEG', 'PNG', 'GIF'],
@@ -40,32 +36,44 @@
             }
         },
         props: {
+            //默认文件列表
             defaultFileList: {
                 default: () => {
                     return []
                 },
                 type: Array
             },
-            accountName: {
-                default: 'teammodelostest',
+            //文件夹
+            folder: {
+                default: 'res',
                 type: String
             },
-            containerName: {
-                default: 'teammodelos',
+            //授权信息
+            sasString:{
+                default: 'res',
                 type: String
             },
-            pathName: {
+            //blob链接
+            urlString:{
                 default: '',
                 type: String
             },
+            //容器名称
+            containerName:{
+                default: '',
+                type: String
+            },
+            //缩略图压缩质量
             quality: {
                 default: 0.2,
                 type: Number
             },
+            //文件大小限制
             maxSize: {
                 default: 2 * 1024 * 1024 * 1024,
                 type: Number
             },
+            //文件格式限制
             format: {
                 default: () => {
                     return []
@@ -87,13 +95,10 @@
                 this.$emit('deleteFile', this.uploadedList[index])
                 this.uploadedList.splice(index, 1)
             },
+            //初始化blob
             initBlob() {
-                /**
-                 * v12
-                 * */
-                const blobServiceClient = new BlobServiceClient(this.urlString + this.sasString);
-                const containerName = this.blobContainer
-                this.containerURL = blobServiceClient.getContainerClient(containerName);
+                let blobServiceClient = new BlobServiceClient(this.urlString + this.sasString)
+                this.containerURL = blobServiceClient.getContainerClient(this.containerName)
             },
             dataURLtoFile(dataurl, filename) {
                 var arr = dataurl.split(','); var mime = arr[0].match(/:(.*?);/)[1]
@@ -103,6 +108,7 @@
                 }
                 return new File([u8arr], filename, { type: mime })
             },
+            //处理图片缩略图和视频封面
             compressFile(file, fileInfo) {
                 if (fileInfo.type == 'picture') {
                     let reader = new FileReader()
@@ -120,31 +126,10 @@
                             let newImgData = canvas.toDataURL(file.type, this.quality)
                             var resultFile = this.dataURLtoFile(newImgData, file.name)
                             this.initBlob()
-                            let options = {
-                                blockSize: 10 * 1024 * 1024
-                            }
-                            /**
-                             * v10
-                             * */
-                            //const compressBlobURL = this.$azblob.BlockBlobURL.fromContainerURL(
-                            //    this.containerURL,
-                            //    'compress' + file.name
-                            //)
-
-                            //this.$azblob.uploadBrowserDataToBlockBlob(
-                            //    this.$azblob.Aborter.none,
-                            //    resultFile,
-                            //    compressBlobURL,
-                            //    options
-                            //)
-
-                            /**
-                             * v12
-                             * */
-                            const blockBlobClient = this.containerURL.getBlockBlobClient(this.pathName + "/compress" + file.name)
+                            const blockBlobClient = this.containerURL.getBlockBlobClient(this.folder + "/compress" + file.name)
                             blockBlobClient.uploadBrowserData(resultFile).then(
                                 res => {
-                                    fileInfo['compressUrl'] = this.urlString + '/' + this.blobContainer + '/' + this.pathName + '/compress' + file.name
+                                    fileInfo['compressUrl'] = this.urlString + '/' + this.containerName + '/' + this.folder + '/compress' + file.name
                                     this.$emit('successData', fileInfo)
                                 },
                                 err => {
@@ -170,26 +155,10 @@
                         let resultFile = this.dataURLtoFile(newVideoData, file.name)
                         this.initBlob()
                         let posterName = 'compress' + file.name.replace(fileInfo.extension, 'png')
-                        /**
-                         * v10
-                         * */
-                        //const compressBlobURL = this.$azblob.BlockBlobURL.fromContainerURL(
-                        //    this.containerURL,
-                        //    posterName
-                        //)
-                        //this.$azblob.uploadBrowserDataToBlockBlob(
-                        //    this.$azblob.Aborter.none,
-                        //    resultFile,
-                        //    compressBlobURL
-                        //)
-
-                        /**
-                         * v12
-                         **/
-                        const blockBlobClient = this.containerURL.getBlockBlobClient(this.pathName + "/" + posterName)
+                        const blockBlobClient = this.containerURL.getBlockBlobClient(this.folder + "/" + posterName)
                         blockBlobClient.uploadBrowserData(resultFile).then(
                             res => {
-                                fileInfo['compressUrl'] = this.urlString + '/' + this.blobContainer + '/' + this.pathName + '/' + posterName
+                                fileInfo['compressUrl'] = this.urlString + '/'+ this.containerName + '/' + this.folder + '/' + posterName
                                 this.$emit('successData', fileInfo)
                             },
                             err => {
@@ -201,10 +170,9 @@
                 }
             },
             uploadToBlob(file) {
-                console.log(file)
                 let fileItem = {}
                 fileItem['fileName'] = file.name
-                fileItem['blobUrl'] = this.urlString + '/' + this.blobContainer + '/' + this.pathName + '/' + file.name
+                fileItem['blobUrl'] = this.urlString + '/' + this.containerName + '/' + this.folder + '/' + file.name
                 fileItem['extension'] = file.name.substring(file.name.lastIndexOf('.') + 1)
                 fileItem['size'] = file.size
                 fileItem['status'] = 0
@@ -231,19 +199,8 @@
                 fileItem['type'] = type
                 this.uploadedList.push(fileItem)
 
-                //v10
-                //const blockBlobURL = this.$azblob.BlockBlobURL.fromContainerURL(
-                //    this.containerURL,
-                //    file.name
-                //)
-                //this.$azblob.uploadBrowserDataToBlockBlob(
-                //    this.$azblob.Aborter.none,
-                //    file,
-                //    blockBlobURL
-                //)
-
                 //v12
-                const blockBlobClient = this.containerURL.getBlockBlobClient(this.pathName + "/" + file.name)
+                const blockBlobClient = this.containerURL.getBlockBlobClient(this.folder + "/" + file.name)
                 blockBlobClient.uploadBrowserData(file).then(
                     res => {
                         let reader = new FileReader()
@@ -291,23 +248,9 @@
                     })
                     return false
                 }
-
-                this.$api.uploadFile.getContainerSAS().then(
-                    (res) => {
-                        if (res.error == null) {
-                            this.sasString = res.result.data.SAS
-                            this.blobContainer = res.result.data.Container
-                            this.urlString = res.result.data.Url
-                            this.initBlob()
-                            this.uploadToBlob(file)
-                        } else {
-                            alert('API error!')
-                        }
-                    },
-                    (err) => {
-                        alert('API error!')
-                    }
-                )
+                this.initBlob()
+                this.uploadToBlob(file)
+                
                 return false
             },
             getIndex(_arr, _obj) {
@@ -335,7 +278,6 @@
             }
         },
         mounted() {
-            //this.uploadedList = []
             this.uploadedList = this.defaultFileList
         },
         created() {

TEAMModelOS/ClientApp/src/store/index.js

@@ -19,14 +19,13 @@ const mutations = {
     [MAIN_SET_COUNTER](state, obj) {
         state.counter = obj.counter
     },
-    setFileSas(state, obj) {
-        state.fileSas = obj
+    setPrivateSas(state, obj) {
+        console.log('state')
+        state.privateSas = obj
     },
-    setBlobR(state, obj) {
-        state.blobR = obj
-    },
-    setBlobRW(state, obj) {
-        state.blobRW = obj
+    setSchoolSas(state, obj) {
+        console.log('state')
+        state.schoolSas = obj
     }
 }
 

TEAMModelOS/ClientApp/src/utils/public.js

@@ -246,9 +246,6 @@ export default {
                         $api.uploadFile.urlSasR(param.data).then(
                             (res) => {
                                 if (res.error == null) {
-                                    console.log('新的')
-                                    store.commit('setFileSas', res.result.data)
-                                    console.log(store)
                                     r(res.result.data)
                                 } else {
                                     j(500)
@@ -267,8 +264,7 @@ export default {
                         $api.uploadFile.blobSasR(param.data).then(
                             (res) => {
                                 if (res.error == null) {
-                                    console.log('新的')
-                                    store.commit('setBlobR', res.result.data)
+                                    store.commit('setBlobR')
                                     r(res.result.data)
                                 } else {
                                     j(500)
@@ -279,7 +275,6 @@ export default {
                             }
                         )
                     } else {
-                        console.log('vuex缓存的')
                         r(store.state.blobR)
                     }
                     break
@@ -288,7 +283,7 @@ export default {
                         $api.uploadFile.blobSasRCW(param.data).then(
                             (res) => {
                                 if (res.error == null) {
-                                    store.commit('setBlobRw', res.result.data)
+                                    store.commit('setBlobRW', res.result.data)
                                     r(res.result.data)
                                 } else {
                                     j(500)
@@ -306,6 +301,83 @@ export default {
                     j('getSas() 参数错误:type')
             }
         })
+    },
+
+
+    /**
+     * 获取个人容器授权
+     */
+    getPrivateSas() {
+        return new Promise((r, j) => {
+            if (!store.state.privateSas || checkSas(store.state.privateSas.timeout)) {
+                $api.uploadFile.blobSasRCW({
+                    name: store.state.userInfo.TEAMModelId,
+                    role: 'teacher'
+                }).then(
+                    (res) => {
+                        if (res.error == null) {
+                            store.commit('setPrivateSas', res.result.data)
+                            r(res.result.data)
+                        } else {
+                            j(500)
+                        }
+                    },
+                    (err) => {
+                        j(500)
+                    }
+                )
+            } else {
+                console.log(store)
+                r(store.state.privateSas)
+            }
+        })
+    },
+    /**
+     * 获取学校容器授权
+     */
+    getSchoolSas() {
+        return new Promise((r, j) => {
+            if (!store.state.schoolSas || checkSas(store.state.schoolSas.timeout)) {
+                $api.uploadFile.blobSasRCW({
+                    name: store.state.userInfo.schoolCode,
+                    role: 'school'
+                }).then(
+                    (res) => {
+                        if (res.error == null) {
+                            store.commit('setSchoolSas', res.result.data)
+                            r(res.result.data)
+                        } else {
+                            j(500)
+                        }
+                    },
+                    (err) => {
+                        j(500)
+                    }
+                )
+            } else {
+                r(store.state.schoolSas)
+            }
+        })
+    },
+    /**
+     * 获取单个文件授权
+     */
+    getFileSas() {
+        return new Promise((r, j) => {
+            $api.uploadFile.blobSasRCW(param.data).then(
+                (res) => {
+                    if (res.error == null) {
+                        store.commit('setBlobRW', res.result.data)
+                        r(res.result.data)
+                    } else {
+                        j(500)
+                    }
+                },
+                (err) => {
+                    j(500)
+                }
+            )
+        })
     }
 
 }

TEAMModelOS/ClientApp/src/view/teachcontent/index.vue

@@ -130,7 +130,7 @@
         <!--上传文件-->
         <Modal v-model="uploadStatus"
                :title="$t('teachContent.btnUpload')" class="upload-modal" @on-ok="confirmUpload" width="660" :mask-closable="false">
-            <UploadFile @successData="getFileUrl" :uploadUrl="uploadUrl" :pathName="$store.state.userInfo.TEAMModelId.replace('#','')" :quality="1"></UploadFile>
+            <UploadFile @successData="getFileUrl" :sasString="sasString" :urlString="urlString" :folder="folder" :containerName="containerName" :quality="1"></UploadFile>
         </Modal>
         <!--文件预览-->
         <Modal v-model="previewStatus"
@@ -166,7 +166,6 @@
 </template>
 <script>
     import Loading from '@/common/Loading.vue'
-    
     import EditableLabel from '@/common/EditableLabel.vue'
     import UploadFile from '@/common/UploadFile.vue'
     import BasePoints from '@/view/evaluation/components/BasePoints.vue'
@@ -175,7 +174,6 @@
             EditableLabel,
             UploadFile,
             BasePoints,
-            
             Loading
         },
         data() {
@@ -192,6 +190,8 @@
                 pageSize: 20,
                 sasString: '',
                 urlString: '',
+                folder: 'res',
+                containerName:'',
                 showType: true,
                 model: [],
                 fileColumns: [],
@@ -349,21 +349,35 @@
             /**
              * 获取blob授权信息
              * */
-            getSasStr() {
-                this.$api.uploadFile.getContainerSAS().then(
-                    (res) => {
-                        if (res.error == null) {
-                            this.sasString = res.result.data.SAS
-                            this.urlString = res.result.data.Url
-                            this.uploadUrl = this.urlString + '/' + this.$store.state.userInfo.TEAMModelId.replace('#', '')
-                        } else {
-                            alert('API error!')
-                        }
-                    },
-                    (err) => {
-                        alert('API error!')
-                    }
-                )
+            async getSasStr() {
+                //废弃授权模式
+                //this.$api.uploadFile.getContainerSAS().then(
+                //    (res) => {
+                //        if (res.error == null) {
+                //            this.sasString = res.result.data.SAS
+                //            this.urlString = res.result.data.Url
+                //            this.uploadUrl = this.urlString + '/' + this.$store.state.userInfo.TEAMModelId.replace('#', '')
+                //        } else {
+                //            alert('API error!')
+                //        }
+                //    },
+                //    (err) => {
+                //        alert('API error!')
+                //    }
+                //)
+                let sasRes = undefined
+                if (this.rangeType == 0) {
+                    sasRes = await this.$tools.getSchoolSas()
+                } else {
+                    sasRes = await this.$tools.getPrivateSas()
+                }
+                if (sasRes) {
+                    this.sasString = sasRes.sas
+                    this.urlString = sasRes.url
+                    this.containerName = sasRes.name
+                } else {
+                    this.$Message.error('获取Blob授权失败')
+                }
             },
             checkSize(file) {
                 if (this.storageSpace + file.size > 2 * 1024 * 1024 * 1024) {
@@ -659,6 +673,7 @@
             handleTabClick(index) {
                 this.rangeType = index
                 this.activeTypeIndex = 0
+                this.getSasStr()
                 this.findFileList()
                 if (index == 1) {
                     this.fileListShow = this.fileList