Skip to content

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

阶段性提交

parent fb253934
Hide whitespace changes
Inline Side-by-side
Showing with 88 additions and 44 deletions
package.json
View file @ 60787343
......@@ -17,6 +17,7 @@
"downloadjs": "^1.4.7",
"epic-spinners": "^1.1.0",
"html-to-image": "^1.6.2",
"html2canvas": "^1.1.4",
"lodash": "^4.17.21",
"md5": "^2.3.0",
"moment": "^2.29.1",
......
src/components/CardList.vue
View file @ 60787343
......@@ -3,7 +3,8 @@
<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' v-for="(k,kindex) in i" :key="kindex" @click="itemOnclick(k.id)">
<div class='w-full '>
<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 max-h-36 mx-auto" />
</div>
<div class='mt-3'>
{{k.name}}
......@@ -33,7 +34,7 @@ export default Vue.extend({
}
},
computed:{
outputData:function(){
outputData:function():any{
return _chunk(this.data,this.rowSize)
}
},
......
src/components/CollectionCard.vue
View file @ 60787343
......@@ -11,8 +11,9 @@
bg-font-light-black
"
>
<div class="left w-4/12 object-cover rounded-md">
<img src="/img/cover.png" class="rounded-md" />
<div class="flex items-center text-center left w-4/12 object-cover rounded-md">
<img :src="colletionData.cover?colletionData.cover :'/img/cover.png'" class="rounded-md max-h-36 mx-auto" />
<!-- <img src="/img/cover.png" class="rounded-md" /> -->
</div>
<div class="right w-8/12">
<div class="w-full px-4">
......
src/layout/NavHeader.vue
View file @ 60787343
......@@ -21,26 +21,27 @@ import Vue from 'vue';
export default Vue.extend({
data() {
return{
title:'',
saveBtn:{
show:false,
enable:false,
}
},
}
},
components:{
'app-icon':()=>import('@/components/common/Icon.vue')
},
computed:{
title():string{
return this.$route.query.text?this.$route.query.text:(this.$route.query.type?`上传${this.$route.query.type}`:this.$route.meta?.title)
}
},
mounted(){
this.title = this.$route.meta?.title
if(this.$route.path.includes('/User/edit')){
this.saveBtn.show = true
}else{
this.saveBtn.show = false
}
}
},
methods:{
clickSaveBtn(){
......
src/view/NFT/Create/components/certificate/index.vue
View file @ 60787343
......@@ -4,15 +4,15 @@
<div class="w-6/12 object-cover mx-auto">
<img src="./stars.png" class="mx-auto" />
</div>
<div class="box xs:mt-6 mt-3" ref="certifyCard">
<div class="top xs:h-60 h-48 relative bg-certifyBG bg-no-repeat bg-cover">
<div class="box xs:mt-6 mt-3" ref="certifyCard" id="certifyCard">
<div id="certificate-title" class=" top xs:h-60 h-48 relative bg-certifyBG bg-no-repeat bg-cover">
<div class="blur-img h-full w-full absolute top-0 left-0"></div>
<div class="pt-6 xs:text-sm text-xs">
<div>影视区块链版权电子数据确权书</div>
</div>
<div>
<img v-if="!coverName" src="/img/cover.png" class=" w-20 xs:w-24 mx-auto mt-4" />
<img id="coverImg" :src="showUploadFile" v-else class=" w-20 xs:w-24 mx-auto mt-4" />
<div class=" h-40 flex items-center ">
<img id="coverImg" v-if="!coverName" src="/img/cover.png" class=" max-w-20 xs:max-w-24 mx-auto mt-4 mb-4 max-h-32" />
<img id="coverImg" :src="showUploadFile" v-else class=" max-w-20 xs:max-w-24 mx-auto mt-4 mb-4 max-h-32" />
</div>
<div class="float-box w-full absolute -bottom-10 text-3xs xs:text-2xs">
<div class="w-11/12 p-2 flex-wrap mx-auto flex break-all bg-font-white shadow-md rounded text-font-black">
......@@ -61,8 +61,10 @@
import Vue from "vue";
import download from 'downloadjs'
import moment from 'moment'
// import html2canvas from 'html2canvas'
import { toPng } from 'html-to-image';
import { mapState } from "vuex";
'bg-certifyBG'
export default Vue.extend({
data(){
return {
......@@ -79,13 +81,13 @@ export default Vue.extend({
}
}
},
mounted(){
const fileReader = new FileReader();
fileReader.readAsDataURL(this.coverFile);
fileReader.onload = function (){
(document.getElementById("coverImg") as any).src = fileReader.result;
}
},
// mounted(){
// const fileReader = new FileReader();
// fileReader.readAsDataURL(this.coverFile);
// fileReader.onload = function (){
// (document.getElementById("coverImg") as any).src = fileReader.result;
// }
// },
props: {
name: {
type: String,
......@@ -123,17 +125,41 @@ export default Vue.extend({
},
methods:{
async downloadImg(){
let certifyCard = this.$refs.certifyCard as HTMLElement
toPng(certifyCard).then(function (dataUrl) {
// var img = new Image();
// img.src = dataUrl;
// console.log(img.src);
download(dataUrl, 'my-node.png');
})
.catch(function (error) {
console.error('oops, something went wrong!', error);
});
// let certifyCard = this.$refs.certifyCard as HTMLElement
try {
let certifyCard = document.getElementById('certifyCard') as HTMLElement
let dataUrl = await toPng(certifyCard)
// var img = new Image();
// img.src = dataUrl;
// console.log(img.src);
download(dataUrl, 'my-node.png');
}catch(error){
console.error('oops, something went wrong!', error)
}
// const canvas2 = document.createElement('canvas');
// let _canvas = document.getElementById('certifyCard');
// const w = parseInt(window.getComputedStyle(_canvas).width);
// const h = parseInt(window.getComputedStyle(_canvas).height);
// const dpr = window.devicePixelRatio || 1;
// canvas2.width = w * dpr;
// canvas2.height = h * dpr;
// canvas2.style.width = w + 'px'
// canvas2.style.height = h + 'px'
// var context = canvas2.getContext('2d');
// context.scale(1, 1);
// window.scrollTo(0, 0);
// html2canvas(_canvas, { canvas: canvas2 }).then(function(canvas) {
// const imgUrl = canvas.toDataURL('image/png')
// download(imgUrl,'certify.png')
// // window.location.href = imgUri;
// });
}
},
});
</script>
<style scoped>
/* #certificate-title {
background: url('/img/certify-bg.png') no-repeat ;
background-size: cover;
} */
</style>
src/view/NFT/Create/form.vue
View file @ 60787343
......@@ -36,7 +36,7 @@
:text="fromText.themeText"
:placeholder="fromText.themePlaceholder"
class="text-font-white my-3"
@click.native="$router.push('/Nft/create/pick')"
@click.native="$router.push({name:'NftPick',query:{text:`${getPreText()}题材`}})"
></app-cell>
<div>
<div class="my-4 text-font-gray text-sm ml-4">{{fromText.desText}}</div>
......@@ -76,7 +76,7 @@
type="upload"
:placeholder="fromText.filePlaceholder"
:name="fileName"
@cellOnChange="$router.push({ name: 'NftUpload',params:{type:getPreText()}})"
@cellOnChange="$router.push({ name: 'NftUpload',query:{type:getPreText()}})"
></app-cell>
<app-cell
text="封面上传(非必填)"
......@@ -84,7 +84,7 @@
type="upload"
placeholder="请上传相关封面"
:name="coverName"
@cellOnChange="$router.push({ name: 'NftUpload',params:{type:'封面图片'}})"
@cellOnChange="$router.push({ name: 'NftUpload',query:{type:'封面图片'}})"
></app-cell>
<app-cell
:text="fromText.fileHashText"
......@@ -386,6 +386,14 @@ export default Vue.extend({
return '剧本'
case '2':
return '视频'
case '3':
return '电影'
case '4':
return '音频'
case '5':
return '图片'
case '6':
return '衍生品'
default:
return ''
}
......@@ -538,6 +546,7 @@ export default Vue.extend({
}
}catch(err){
this.loading2 = false
this.$toast('上传失败，请稍后再试~')
return
}
if (this.currentStep < this.mySteps.length + 1) {
......
src/view/NFT/Create/upload.vue
View file @ 60787343
......@@ -137,12 +137,12 @@ export default Vue.extend({
}
},
uploadType():any{
return this.$route.params.type
return this.$route.query.type
},
uploadAccept():object{
switch(this.uploadType){
case '剧本':
return {acceptTitle:'请上传剧本附件',acceptType:'application/pdf,application/msword,text/plain',acceptText:'支持扩展名格式PDF'}
return {acceptTitle:'请上传剧本附件',acceptType:'.pdf,.doc,.word,.txt',acceptText:'支持扩展名格式PDF'}
case '视频':
return {acceptTitle:'请上传视频附件',acceptType:'video/*',acceptText:'上传视频仅支持MOV、MP4格式文件，大小限制为500M以内'}
case '电影':
......
src/view/User/index.vue
View file @ 60787343
......@@ -5,9 +5,9 @@
<input type="file" accept="image/*" class=" hidden" ref='fileElem' @change="fileUpload"/>
<van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
<app-cell text='头像' boxType='border' type='image' :value='avatarImgUrl?avatarImgUrl:this.userInfo.avatar?this.userInfo.avatar : "/img/mokeImg/avatar.png"' icon='icon-xiayibu' @click.native='uploadImg'></app-cell>
<app-cell text='昵称' boxType='border' :value='userInfo.nickname?userInfo.nickname:"无昵称"' icon='icon-xiayibu' @click.native="goEdit({type:'nickname',title:'设置昵称'})"></app-cell>
<app-cell text='昵称' boxType='border' :value='userInfo.nickname?userInfo.nickname:"无昵称"' icon='icon-xiayibu' @click.native="goEdit({type:'nickname',title:'设置昵称'})"></app-cell>
<app-cell text='手机号' boxType='border' type='click' :value='userInfo.telephone?userInfo.telephone:""' ></app-cell>
<app-cell text='邮箱绑定' boxType='border' :value='userInfo.email?userInfo.email:""' icon='icon-xiayibu' @click.native="goEdit({type:'email',title:'邮箱绑定'})"></app-cell>
<app-cell text='邮箱绑定' boxType='border' :value='userInfo.email?userInfo.email:""' icon='icon-xiayibu' @click.native="goEdit({type:'email',title:'邮箱绑定'})"></app-cell>
<app-cell text='个性签名' boxType='border' icon='icon-xiayibu' @click.native="goEdit({type:'signature',title:'个性签名'})"></app-cell>
<app-cell text='安全中心' boxType='border' icon='icon-xiayibu' ></app-cell>
<app-cell text='消息管理' boxType='border' icon='icon-xiayibu' ></app-cell>
......@@ -61,16 +61,21 @@ export default Vue.extend({
this.show= true
},
async fileUpload(event:any){
this.$toast.loading('头像更新中...')
this.file = event.target.files[0]
try{
this.$toast.loading('头像更新中...')
this.file = event.target.files[0]
// this.$store.commit('app/SET_FILEDATA',event.target.files)
const upload = await this.$service.userService.avatarUpload(event.target.files[0])
if(upload){
const upload = await this.$service.userService.avatarUpload(event.target.files[0])
if(upload){
this.avatarImgUrl = (upload as any).avatar
this.$util.userMsg.updateUserMsg(upload)
this.$toast.success('头像更新成功')
}
}
// this.$router.push({name:'PhotoEdit'})
}catch(err){
this.$toast('头像更新失败')
}
},
onSelect(item:any){
this.show = false;
......
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