Skip to content

N
NFT
Commit af372209 authored by salitedfish's avatar salitedfish
Browse files
Options

优化大文件md5值计算速度

parent 0a31c5f0
Hide whitespace changes
Inline Side-by-side
Showing with 102 additions and 17 deletions
package.json
View file @ af372209
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
"mui": "0.0.1", "mui": "0.0.1",
"quagga": "^0.12.1", "quagga": "^0.12.1",
"register-service-worker": "^1.7.1", "register-service-worker": "^1.7.1",
"spark-md5": "^3.0.1",
"validator": "^13.6.0", "validator": "^13.6.0",
"vant": "^2.12.22", "vant": "^2.12.22",
"vconsole": "^3.7.0", "vconsole": "^3.7.0",
...@@ -40,6 +41,7 @@ ...@@ -40,6 +41,7 @@
"@types/downloadjs": "^1.4.2", "@types/downloadjs": "^1.4.2",
"@types/lodash": "^4.14.170", "@types/lodash": "^4.14.170",
"@types/md5": "^2.3.1", "@types/md5": "^2.3.1",
"@types/spark-md5": "^3.0.2",
"@types/validator": "^13.6.3", "@types/validator": "^13.6.3",
"@typescript-eslint/eslint-plugin": "^4.18.0", "@typescript-eslint/eslint-plugin": "^4.18.0",
"@typescript-eslint/parser": "^4.18.0", "@typescript-eslint/parser": "^4.18.0",
......
src/components/CardList.vue
View file @ af372209
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="list-container font-light"> <div class="list-container font-light">
<div class="list-row flex justify-start relative text-font-white text-sm mb-3" v-for="(i,index) in outputData" :key="index" :id="i.id"> <div class="list-row flex justify-start relative text-font-white text-sm mb-3" v-for="(i,index) in outputData" :key="index" :id="i.id">
<div class='item flex flex-col w-4/12 items-center z-10 h-44' v-for="(k,kindex) in i" :key="kindex" @click="itemOnclick(k.id)"> <div class='item flex flex-col w-4/12 items-center z-10 h-44' v-for="(k,kindex) in i" :key="kindex" @click="itemOnclick(k.id)">
<div class='w-full h-full flex items-center '> <div class='desk_img_box'>
<!-- <img src='/img/cover.png' class=" w-11/12 mx-auto rounded-xl shadow-md"> --> <!-- <img src='/img/cover.png' class=" w-11/12 mx-auto rounded-xl shadow-md"> -->
<img :src="k.cover?k.cover :'/img/cover.png'" class="rounded-md w-11/12 h-full mx-auto" /> <img :src="k.cover?k.cover :'/img/cover.png'" class="desk_img rounded-md w-11/12 h-5/6 mx-auto" />
</div> </div>
<div class='mt-3'> <div class='mt-3'>
{{k.name}} {{k.name}}
...@@ -46,3 +46,16 @@ export default Vue.extend({ ...@@ -46,3 +46,16 @@ export default Vue.extend({
}); });
</script> </script>
<style scoped>
.desk_img_box {
height: 80%;
width: 100%;
}
.desk_img {
width: 90%;
height: 100%;
}
</style>
src/components/CollectionCard.vue
View file @ af372209
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
bg-font-light-black bg-font-light-black
" "
> >
<div class="imgbox left w-4/12 object-cover rounded-md"> <div class="imgbox left w-4/12 rounded-md">
<img :src="colletionData.cover?colletionData.cover:'/img/cover.png'" class="rounded-md" /> <img :src="colletionData.cover?colletionData.cover:'/img/cover.png'" class="rounded-md" />
</div> </div>
<div class="right w-8/12"> <div class="right w-8/12">
......
src/layout/Child.vue
View file @ af372209
...@@ -56,14 +56,16 @@ export default Vue.extend({ ...@@ -56,14 +56,16 @@ export default Vue.extend({
code:Number(newV), code:Number(newV),
codeType:'sms' codeType:'sms'
} }
console.log(data,this.formData); // console.log(data,this.formData);
const req = await this.$store.dispatch('codeConfirmer/doTransfer',data) const req = await this.$store.dispatch('codeConfirmer/doTransfer',data)
console.log(req); // console.log(req);
if(req&&!req.message){ if(req&&!req.message){
this.$router.push({name:'Home'}) this.$router.push({name:'Home'})
this.$toast.success('NFT已经成功转出') this.$toast.success('NFT已经成功转出')
}else{ }else{
this.$toast.fail(req.data || '发送失败') // this.$store.dispatch('codeConfirmer/codeError')
// this.$toast.fail((req && req.data) || '发送失败')
// console.log('//////',this.CodeData.onAction)
} }
}else if(newV.length>4){ }else if(newV.length>4){
this.codeValue = oldV this.codeValue = oldV
......
src/store/codeConfimer.ts
View file @ af372209
...@@ -59,14 +59,17 @@ const stateData = { ...@@ -59,14 +59,17 @@ const stateData = {
if(state.show){ if(state.show){
commit('ToggleCode') commit('ToggleCode')
} }
console.log(req,'nftTransfer',req.code); // console.log(req,'nftTransfer',req.code);
if(req&&!req.message){ if(req&&!req.message){
clearInterval(state.counter) clearInterval(state.counter)
state.count=30 state.count=30
} }
state.onAction = false state.onAction = false
return req return req
} },
codeError({commit,state} :any){
state.onAction = false
}
}, },
getters: {}, getters: {},
} }
......
src/view/NFT/Create/components/certificate/index.vue
View file @ af372209
...@@ -29,27 +29,27 @@ ...@@ -29,27 +29,27 @@
</div> </div>
<div class="bot bg-font-white text-font-black px-3 py-10 pt-12 text-3xs xs:text-2xs"> <div class="bot bg-font-white text-font-black px-3 py-10 pt-12 text-3xs xs:text-2xs">
<div class="ceritfy-item flex py-1"> <div class="ceritfy-item flex py-1">
<div class="w-4/12 text-left">{{getPreText()}}名称</div> <div class="w-3/12 text-left">{{getPreText()}}名称</div>
<div class="flex-1 text-left break-all">{{ certificateData?certificateData.value_name:'无'}}</div> <div class="flex-1 text-left break-all">{{ certificateData?certificateData.value_name:'无'}}</div>
</div> </div>
<div class="ceritfy-item flex py-1"> <div class="ceritfy-item flex py-1">
<div class="w-4/12 text-left">发行人地址</div> <div class="w-3/12 text-left">发行人地址</div>
<div class="flex-1 text-left break-all">{{ certificateData?certificateData.wallet:'无' }}</div> <div class="flex-1 text-left break-all">{{ certificateData?certificateData.wallet:'无' }}</div>
</div> </div>
<div class="ceritfy-item flex py-1"> <div class="ceritfy-item flex py-1">
<div class="w-4/12 text-left">发行人</div> <div class="w-3/12 text-left">发行人</div>
<div class="flex-1 text-left break-all">{{ certificateData?certificateData.value_publisher:'无' }}</div> <div class="flex-1 text-left break-all">{{ certificateData?certificateData.value_publisher:'无' }}</div>
</div> </div>
<div class="ceritfy-item flex py-1"> <div class="ceritfy-item flex py-1">
<div class="w-4/12 text-left">存证时间</div> <div class="w-3/12 text-left">存证时间</div>
<div class="flex-1 text-left break-all">{{ createTime }}</div> <div class="flex-1 text-left break-all">{{ createTime }}</div>
</div> </div>
<div class="ceritfy-item flex py-1" v-if="categoryId==1"> <div class="ceritfy-item flex py-1" v-if="categoryId==1">
<div class="w-4/12 text-left">剧本审核</div> <div class="w-3/12 text-left">剧本审核</div>
<div class="flex-1 text-left break-all" v-if="auditing === 0">剧本未审核</div> <div class="flex-1 text-left break-all" v-if="auditing === 0">剧本未审核</div>
</div> </div>
<div class="ceritfy-item flex py-1" v-if="categoryId==1"> <div class="ceritfy-item flex py-1" v-if="categoryId==1">
<div class="w-4/12 text-left">版权证明</div> <div class="w-3/12 text-left">版权证明</div>
<div class="flex-1 text-left break-all" v-if="copyRight === 0">版权未审核</div> <div class="flex-1 text-left break-all" v-if="copyRight === 0">版权未审核</div>
</div> </div>
</div> </div>
......
src/view/NFT/Create/upload.vue
View file @ af372209
...@@ -93,6 +93,7 @@ import Vue from "vue"; ...@@ -93,6 +93,7 @@ import Vue from "vue";
import { Uploader, Loading } from "vant"; import { Uploader, Loading } from "vant";
import { mapMutations, mapState } from "vuex"; import { mapMutations, mapState } from "vuex";
import md5 from "md5"; import md5 from "md5";
import SparkMD5 from "spark-md5";
import { ActionSheet } from 'vant'; import { ActionSheet } from 'vant';
Vue.use(ActionSheet); Vue.use(ActionSheet);
...@@ -243,7 +244,11 @@ export default Vue.extend({ ...@@ -243,7 +244,11 @@ export default Vue.extend({
async afterRead(file: File) { async afterRead(file: File) {
try { try {
const ab = await file.arrayBuffer(); const ab = await file.arrayBuffer();
const fileMd5 = md5(Buffer.from(ab)); // const fileMd5_old = md5(Buffer.from(ab));
let spark = new SparkMD5.ArrayBuffer();
spark.append(Buffer.from(ab))
const fileMd5 = spark.end()
// const fileMd5 = await this.computedHash(file)
if(this.uploadType == '封面图片') { if(this.uploadType == '封面图片') {
this.setState({ this.setState({
...@@ -262,6 +267,51 @@ export default Vue.extend({ ...@@ -262,6 +267,51 @@ export default Vue.extend({
this[this.uploadType == '封面图片'? 'coverstatus':'status'] = uploadStatus.failed; this[this.uploadType == '封面图片'? 'coverstatus':'status'] = uploadStatus.failed;
} }
}, },
// async computedHash(file:any){
// // const fileReadfun = (file:any)=>{
// var blobSlice = File.prototype.slice;
// //设置文件分块大小和分块数量
// let chunkSize = 104857600;
// let chunks = Math.ceil(file.size / chunkSize);
// let currentChunk = 0;
// let spark = new SparkMD5.ArrayBuffer();
// // let spark = new SparkMD5();
// // spark.append(e.target.files[0].name);
// // console.log(e.target.files[0].slice(0,10));
// // console.log((e.target as any).files[0].name);
// const fileReader = new FileReader();
// //第一次和下一次读取
// function loadNext() {
// const start = currentChunk * chunkSize,
// end = start + chunkSize >= file.size ? file.size : start + chunkSize;
// fileReader.readAsArrayBuffer(blobSlice.call(file, start, end));
// // fileReader.readAsBinaryString(blobSlice.call(file, start, end));
// }
// //文件读取回调
// fileReader.onload = function (event:any) {
// //获取文件块，每读取一次推到spark中,计算文件HASH
// spark.append(event.target.result);
// currentChunk++;
// //如果当前块的数量小于总数量则继续读取,否则打印hash
// if (currentChunk < chunks) {
// loadNext();
// } else {
// console.log(spark.end());
// return spark.end()
// }
// };
// loadNext();
// },
showFullImg(){ showFullImg(){
this.showFull = !this.showFull this.showFull = !this.showFull
}, },
......
src/view/NFT/Detail/index.vue
View file @ af372209
...@@ -196,11 +196,26 @@ ...@@ -196,11 +196,26 @@
></app-cell> ></app-cell>
<div class="flex justify-center"> <div class="flex justify-center">
<van-image <van-image
v-if="nftData.isCommemorate == 1"
class="my-3 self-center text-center" class="my-3 self-center text-center"
width="180" width="180"
lazy-load lazy-load
:src="nftData.fileUrl?!nftData.isGrant?nftData.fileUrl:'/img/mokeImg/已加密.png':'/img/mokeImg/暂无内容.png'" :src="nftData.fileUrl"
/> />
<van-image
v-if="nftData.isCommemorate == 0"
class="my-3 self-center text-center"
width="180"
lazy-load
:src="nftData.fileUrl?'/img/mokeImg/已加密.png':'/img/mokeImg/暂无内容.png'"
/>
<!-- <van-image
v-if="nftData.isCommemorate == 0"
class="my-3 self-center text-center"
width="180"
lazy-load
:src="nftData.fileUrl?!nftData.isGrant?nftData.fileUrl:'/img/mokeImg/已加密.png':'/img/mokeImg/暂无内容.png'"
/> -->
</div> </div>
</div> </div>
<div class='flex w-full items-center'> <div class='flex w-full items-center'>
...@@ -374,7 +389,7 @@ export default Vue.extend({ ...@@ -374,7 +389,7 @@ export default Vue.extend({
computed:{ computed:{
certificateData():any{ certificateData():any{
return { return {
nftHash:this.nftData.nftHash, NFTHash:this.nftData.nftHash,
value_name: this.nftData.name, value_name: this.nftData.name,
wallet: this.nftData.publishAddress, wallet: this.nftData.publishAddress,
value_publisher: this.nftData.publisher, value_publisher: this.nftData.publisher,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment