| @@ -3,9 +3,9 @@ | |||||
| # VUE_APP_API_ROOT_USER=https://smapitest.malls.iformall.com/C | # VUE_APP_API_ROOT_USER=https://smapitest.malls.iformall.com/C | ||||
| # 开发 | # 开发 | ||||
| NODE_ENV=development | |||||
| VUE_APP_ENV=development | |||||
| VUE_APP_API_ROOT=https://mtest.metavatar.cc/C | |||||
| # NODE_ENV=development | |||||
| # VUE_APP_ENV=development | |||||
| # VUE_APP_API_ROOT=https://mtest.metavatar.cc/C | |||||
| # VUE_APP_API_ROOT=https://smapitest.malls.iformall.com/C 已废弃 | # VUE_APP_API_ROOT=https://smapitest.malls.iformall.com/C 已废弃 | ||||
| @@ -15,3 +15,9 @@ VUE_APP_API_ROOT=https://mtest.metavatar.cc/C | |||||
| # VUE_APP_ENV=production | # VUE_APP_ENV=production | ||||
| # VUE_APP_API_ROOT=http://m.metavatar.cc/C | # VUE_APP_API_ROOT=http://m.metavatar.cc/C | ||||
| # .env 无论开发环境还是生成环境都会加载 | |||||
| # .env.development 开发环境加载这个文件 | |||||
| # .env.production 生成环境加载这个文件 | |||||
| @@ -1,4 +1,5 @@ | |||||
| # NODE_ENV=development | |||||
| # VUE_APP_ENV=development | |||||
| # VUE_APP_API_ROOT=https://smapitest.malls.iformall.com/C | |||||
| NODE_ENV=development | |||||
| VUE_APP_ENV=development | |||||
| VUE_APP_API_ROOT=https://mtest.metavatar.cc/C | |||||
| @@ -1,4 +1,4 @@ | |||||
| # NODE_ENV=production | |||||
| # VUE_APP_ENV=production | |||||
| # VUE_APP_API_ROOT=http://m.metavatar.cc/C | |||||
| NODE_ENV=production | |||||
| VUE_APP_ENV=production | |||||
| VUE_APP_API_ROOT=http://m.metavatar.cc/C | |||||
| @@ -3,8 +3,8 @@ | |||||
| "version": "0.1.0", | "version": "0.1.0", | ||||
| "private": true, | "private": true, | ||||
| "scripts": { | "scripts": { | ||||
| "dev": "vue-cli-service serve", | |||||
| "build": "vue-cli-service build" | |||||
| "dev": "vue-cli-service serve --mode development", | |||||
| "build": "vue-cli-service build --mode production" | |||||
| }, | }, | ||||
| "dependencies": { | "dependencies": { | ||||
| "axios": "0.18.1", | "axios": "0.18.1", | ||||
| @@ -36,4 +36,4 @@ | |||||
| "uglifyjs-webpack-plugin": "^2.2.0", | "uglifyjs-webpack-plugin": "^2.2.0", | ||||
| "vue-template-compiler": "^2.6.11" | "vue-template-compiler": "^2.6.11" | ||||
| } | } | ||||
| } | |||||
| } | |||||
| @@ -0,0 +1,348 @@ | |||||
| <template> | |||||
| <div class="uploder"> | |||||
| <div class="change-photo-setter" style="height: 240px; width: 160px"> | |||||
| <van-uploader ref="uploader" class="sett-item" :before-read="beforeRead" style="height: 240px; width: 160px"> | |||||
| <div style="height: 240px; width: 160px"> | |||||
| <!-- <img :src="ImgUrl" alt="" /> --> | |||||
| </div> | |||||
| </van-uploader> | |||||
| </div> | |||||
| <div class="uploadava"> | |||||
| <!-- van-popup有bug,某些1情况需要绑定app为根 --> | |||||
| <van-popup :get-container="this.isAndroid ? '' : '#app'" class="vanPopup" duration="0" v-model="showCropper" position="top" :style="{ height: '100%' }"> | |||||
| <div class="cropper-container" :style="{ height: '94vh' }"> | |||||
| <van-loading v-show="loadingShow" size="50" color="#fff" vertical text-color="#fff">上传中...</van-loading> | |||||
| <!-- 切图组件 --> | |||||
| <vueCropper | |||||
| style="background-image: none" | |||||
| ref="cropper" | |||||
| :img="option.img" | |||||
| :outputSize="option.outputSize" | |||||
| :outputType="option.outputType" | |||||
| :info="option.info" | |||||
| :full="option.full" | |||||
| :autoCropWidth="option.autoCropWidth" | |||||
| :autoCropHeight="option.autoCropHeight" | |||||
| :canMove="option.canMove" | |||||
| :canMoveBox="option.canMoveBox" | |||||
| :original="option.original" | |||||
| :autoCrop="option.autoCrop" | |||||
| :fixed="option.fixed" | |||||
| :fixedNumber="option.fixedNumber" | |||||
| :centerBox="option.centerBox" | |||||
| :infoTrue="option.infoTrue" | |||||
| :fixedBox="option.fixedBox" | |||||
| :high="option.high" | |||||
| :mode="option.mode" /> | |||||
| <!-- <div style="display: flex; justify-content: space-between; padding: 10px; height: 8vh"> | |||||
| <div @click="onClickLeft">取消</div> | |||||
| <div @click="onClickRight">确定</div> | |||||
| </div> --> | |||||
| <van-nav-bar left-text="取消" right-text="确定" @click-left="onClickLeft" @click-right="onClickRight" /> | |||||
| </div> | |||||
| </van-popup> | |||||
| </div> | |||||
| </div> | |||||
| </template> | |||||
| <script> | |||||
| import { awsImgUpload } from '@/api/editModel'; | |||||
| import { Toast } from 'vant'; | |||||
| import { VueCropper } from 'vue-cropper'; | |||||
| import { scrollToID, getDeviceType } from '../utils'; | |||||
| import { saveImgApi } from '../api/editModel'; | |||||
| import { watch } from 'vue'; | |||||
| export default { | |||||
| name: 'uploadAva', | |||||
| components: { | |||||
| VueCropper | |||||
| }, | |||||
| props: { | |||||
| showAta: { | |||||
| default: false, | |||||
| type: Boolean | |||||
| }, | |||||
| avaUrl: { | |||||
| default: '', | |||||
| type: String | |||||
| }, | |||||
| type: { | |||||
| default: '', | |||||
| type: Number | |||||
| }, | |||||
| videoType: { | |||||
| default: null, | |||||
| type: Number | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| isAndroid: false, //判断是不是ios | |||||
| aaa: null, | |||||
| ImgUrl: '', | |||||
| show: true, // 上传类型的弹窗 | |||||
| imageFileName: '', | |||||
| showCropper: false, // 裁剪的弹窗 | |||||
| option: { | |||||
| img: '', | |||||
| outputSize: 0.8, | |||||
| info: false, // 裁剪框的大小信息 | |||||
| // outputType: 'jpeg', // 裁剪生成图片的格式 | |||||
| outputType: 'png', // 裁剪生成图片的格式 | |||||
| canScale: true, // 图片是否允许滚轮缩放 | |||||
| autoCrop: true, // 是否默认生成截图框 | |||||
| autoCropWidth: window.innerWidth - 100 + 'px', // 默认生成截图框宽度 | |||||
| autoCropHeight: window.innerWidth - 100 + 'px', // 默认生成截图框高度 | |||||
| high: true, // 是否按照设备的dpr 输出等比例图片 | |||||
| fixedBox: false, // 固定截图框大小 不允许改变 | |||||
| fixed: false, // 是否开启截图框宽高固定比例 | |||||
| // fixedNumber: [1, 1], // 截图框的宽高比例 | |||||
| full: true, // 是否输出原图比例的截图 | |||||
| canMoveBox: true, // 截图框能否拖动 | |||||
| original: false, // 上传图片按照原始比例渲染 | |||||
| centerBox: true, // 截图框是否被限制在图片里面 | |||||
| infoTrue: false, // true 为展示真实输出图片宽高 false 展示看到的截图框宽高 | |||||
| mode: '100% auto' // 图片默认渲染方式 | |||||
| }, | |||||
| loadingShow: false // 是否展示loading | |||||
| }; | |||||
| }, | |||||
| created() { | |||||
| const deviceType = getDeviceType(); | |||||
| this.isAndroid = false; | |||||
| if (!deviceType) { | |||||
| // 设备类型为pc | |||||
| this.isAndroid = false; | |||||
| } else { | |||||
| if (deviceType[0] == 'Android') { | |||||
| // 设备类型为安卓 | |||||
| this.isAndroid = true; | |||||
| } else { | |||||
| // 其他设备 | |||||
| this.isAndroid = false; | |||||
| } | |||||
| } | |||||
| if (this.type == 4 && this.videoType == 1) { | |||||
| this.option.autoCropWidth = 1080 + 'px'; // 默认生成截图框宽度 | |||||
| this.option.autoCropHeight = 1920 + 'px'; // 默认生成截图框高度 | |||||
| this.option.fixed = true; | |||||
| this.option.fixedNumber = [1080, 1920]; | |||||
| } | |||||
| if (this.type == 4 && this.videoType == 2) { | |||||
| this.option.autoCropWidth = 1920 + 'px'; // 默认生成截图框宽度 | |||||
| this.option.autoCropHeight = 1080 + 'px'; // 默认生成截图框高度 | |||||
| this.option.fixed = true; | |||||
| this.option.fixedNumber = [1920, 1080]; | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| beforeRead(file) { | |||||
| // console.log(file) | |||||
| if (file.type !== 'image/jpeg' && file.type !== 'image/png') { | |||||
| this.$toast('请上传 jpg/png 格式图片'); | |||||
| return false; | |||||
| } | |||||
| let data = window.URL.createObjectURL(new Blob([file])); | |||||
| this.option.img = data; //给裁剪图片的路径 | |||||
| this.showCropper = true; | |||||
| return false; | |||||
| }, | |||||
| // 点击裁剪的选择 | |||||
| onClickRight() { | |||||
| let that = this; | |||||
| this.loadingShow = true; | |||||
| console.log(this.$refs.cropper); | |||||
| this.$refs.cropper.getCropBlob(async data => { | |||||
| console.log(data, '图片数据'); | |||||
| let formData = new FormData(); | |||||
| formData.append('file', data); | |||||
| let file = formData.get('file'); | |||||
| // 转为 base64 | |||||
| // let reader = new FileReader(); | |||||
| // const base64Data = await new Promise((resolve, reject) => { | |||||
| // reader.onload = () => { | |||||
| // resolve(reader.result); | |||||
| // }; | |||||
| // reader.readAsDataURL(file); | |||||
| // }); | |||||
| // let imgBinary = await that.base64ToBinary(base64Data.substring(23)); | |||||
| // // base64结果 | |||||
| // that.ImgUrl = base64Data; | |||||
| that.loading = false; | |||||
| // console.log(that.ImgUrl, 'dasdasd') | |||||
| // 发请求 | |||||
| const AccessToken = localStorage.getItem('AccessToken'); | |||||
| that | |||||
| .$axios({ | |||||
| method: 'post', | |||||
| // url: `https://smapitest.malls.iformall.com/C/api/upload/awsImgUpload`, | |||||
| // url: `http://m.metavatar.cc/C/api/upload/awsImgUpload`, | |||||
| url: process.env.VUE_APP_API_ROOT + `/api/upload/awsImgUpload`, | |||||
| headers: { | |||||
| 'content-type': 'multipart/form-data', | |||||
| token: AccessToken, | |||||
| 'Access-Control-Allow-Credentials': true | |||||
| }, | |||||
| data: formData | |||||
| }) | |||||
| .then(async res => { | |||||
| // console.log(res.data.data.url) | |||||
| const res1 = await saveImgApi({ | |||||
| type: that.type, | |||||
| videoType: that.videoType, | |||||
| material: res.data.data.url | |||||
| }); | |||||
| // 重新获取列表 | |||||
| await that.$parent.$parent.getMyBGIListApi(); | |||||
| await that.$parent.$parent.getMyScListApi(); | |||||
| if (this.type == 4) { | |||||
| that.$parent.$parent.changeShowBGIList(1); | |||||
| } | |||||
| if (this.type == 5) { | |||||
| that.$parent.$parent.changeShowBGIList(3); | |||||
| } | |||||
| that.loadingShow = false; | |||||
| that.showCropper = false; | |||||
| Toast.success('上传成功'); | |||||
| }); | |||||
| }); | |||||
| }, | |||||
| // 点击取消 | |||||
| onClickLeft() { | |||||
| this.loadingShow = false; | |||||
| this.showCropper = false; | |||||
| this.$parent.showPhotoUploader = false; | |||||
| }, | |||||
| // 上传图片 | |||||
| async pushImg(data) { | |||||
| try { | |||||
| const res = await awsImgUpload(data); | |||||
| this.loadingShow = false; | |||||
| this.showCropper = false; | |||||
| Toast.success('上传成功'); | |||||
| } catch (error) { | |||||
| console.log(error, 'error'); | |||||
| Toast.fail(error.message); | |||||
| } | |||||
| }, | |||||
| //图片转base64,异步 | |||||
| toBase64(file) { | |||||
| let that = this; | |||||
| return new Promise((resolve, reject) => { | |||||
| const reader = new FileReader(); | |||||
| reader.onload = () => { | |||||
| // base64结果 | |||||
| that.ImgUrl = this.result; | |||||
| that.loading = false; | |||||
| }; | |||||
| reader.onerror = reject; | |||||
| reader.readAsDataURL(file); | |||||
| }); | |||||
| }, | |||||
| // base64 转二进制 | |||||
| base64ToBinary(base64) { | |||||
| const binaryStr = window.atob(base64); | |||||
| const len = binaryStr.length; | |||||
| const bytes = new Uint8Array(len); | |||||
| for (let i = 0; i < len; ++i) { | |||||
| bytes[i] = binaryStr.charCodeAt(i); | |||||
| } | |||||
| return bytes; | |||||
| } | |||||
| }, | |||||
| mounted() {} | |||||
| }; | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| // /deep/.cropper-container { | |||||
| // z-index: 2005 !important; | |||||
| // } | |||||
| // .uploder{ | |||||
| // overflow: hidden; | |||||
| // } | |||||
| /deep/.cropper-view-box { | |||||
| outline: 2px dashed #fff !important; | |||||
| } | |||||
| /deep/.crop-point { | |||||
| background-color: auto !important; | |||||
| } | |||||
| /deep/.van-loading { | |||||
| position: absolute; | |||||
| // color: red; | |||||
| z-index: 9999; | |||||
| left: 50%; | |||||
| top: 50%; | |||||
| margin-left: -55px; | |||||
| margin-top: -30px; | |||||
| background: rgba(0, 0, 0, 0.3); | |||||
| padding: 10px 30px; | |||||
| border-radius: 25px; | |||||
| } | |||||
| .uploadava { | |||||
| // width: 100%; | |||||
| // width: 100vw; | |||||
| height: 94vh; | |||||
| .update-avatar { | |||||
| height: 100%; | |||||
| text-align: center; | |||||
| .update-avatar-line { | |||||
| width: 100%; | |||||
| height: 1px; | |||||
| background-color: #979797; | |||||
| } | |||||
| .avatar-select-type { | |||||
| background-color: #fff; | |||||
| width: 346px; | |||||
| border-radius: 12px; | |||||
| padding-bottom: 4px; | |||||
| .upload-avator { | |||||
| padding: 14px; | |||||
| } | |||||
| } | |||||
| p { | |||||
| margin: 15px 0 30px; | |||||
| background-color: #fff; | |||||
| width: 346px; | |||||
| border-radius: 12px; | |||||
| padding: 15px 0 18px; | |||||
| } | |||||
| } | |||||
| .cropper-container { | |||||
| position: relative; | |||||
| width: 100%; | |||||
| height: 94vh; | |||||
| // height: 100%; | |||||
| /deep/ .van-nav-bar { | |||||
| position: absolute; | |||||
| z-index: 999; | |||||
| width: 100%; | |||||
| bottom: 0px; | |||||
| left: 0px; | |||||
| height: 6vh; | |||||
| background-color: rgba(0, 0, 0, 0.87); | |||||
| :global(.van-nav-bar__text) { | |||||
| color: #000; | |||||
| // font-size: $font-size-normal-x; | |||||
| } | |||||
| :global(.van-nav-bar__text:nth-child(2)) { | |||||
| color: #000; | |||||
| font-weight: 500; | |||||
| } | |||||
| // :global(.van-icon) { | |||||
| // color: red; | |||||
| // } | |||||
| } | |||||
| } | |||||
| .vue-cropper { | |||||
| background: #000; | |||||
| width: 100%; | |||||
| height: 88vh; | |||||
| padding-top: 46px; | |||||
| box-sizing: border-box; | |||||
| } | |||||
| } | |||||
| </style> | |||||
| @@ -10,11 +10,12 @@ | |||||
| <div class="uploadava"> | <div class="uploadava"> | ||||
| <!-- van-popup有bug,某些1情况需要绑定app为根 --> | <!-- van-popup有bug,某些1情况需要绑定app为根 --> | ||||
| <van-popup :get-container="this.isAndroid ? '' : '#app'" class="vanPopup" duration="0" v-model="showCropper" position="top" :style="{ height: '100%' }"> | <van-popup :get-container="this.isAndroid ? '' : '#app'" class="vanPopup" duration="0" v-model="showCropper" position="top" :style="{ height: '100%' }"> | ||||
| <div class="cropper-container" :style="{ height: '94vh' }"> | |||||
| <div class="cropper-container" :style="{ height: '92vh', position: 'relative' }"> | |||||
| <van-loading v-show="loadingShow" size="50" color="#fff" vertical text-color="#fff">上传中...</van-loading> | <van-loading v-show="loadingShow" size="50" color="#fff" vertical text-color="#fff">上传中...</van-loading> | ||||
| <!-- 切图组件 --> | <!-- 切图组件 --> | ||||
| <!-- :outputSize="option.outputSize" --> | |||||
| <vueCropper | <vueCropper | ||||
| style="background-image: none" | |||||
| :style="{ backgroundImage: 'none', height: '92vh' }" | |||||
| ref="cropper" | ref="cropper" | ||||
| :img="option.img" | :img="option.img" | ||||
| :outputSize="option.outputSize" | :outputSize="option.outputSize" | ||||
| @@ -38,7 +39,7 @@ | |||||
| <div @click="onClickLeft">取消</div> | <div @click="onClickLeft">取消</div> | ||||
| <div @click="onClickRight">确定</div> | <div @click="onClickRight">确定</div> | ||||
| </div> --> | </div> --> | ||||
| <van-nav-bar left-text="取消" right-text="确定" @click-left="onClickLeft" @click-right="onClickRight" /> | |||||
| <van-nav-bar :style="{ height: '8vh', width: '100%', position: 'absolute' }" left-text="取消" right-text="确定" @click-left="onClickLeft" @click-right="onClickRight" /> | |||||
| </div> | </div> | ||||
| </van-popup> | </van-popup> | ||||
| </div> | </div> | ||||
| @@ -85,7 +86,7 @@ export default { | |||||
| showCropper: false, // 裁剪的弹窗 | showCropper: false, // 裁剪的弹窗 | ||||
| option: { | option: { | ||||
| img: '', | img: '', | ||||
| outputSize: 0.8, | |||||
| outputSize: 0.01, //图片质量 | |||||
| info: false, // 裁剪框的大小信息 | info: false, // 裁剪框的大小信息 | ||||
| // outputType: 'jpeg', // 裁剪生成图片的格式 | // outputType: 'jpeg', // 裁剪生成图片的格式 | ||||
| outputType: 'png', // 裁剪生成图片的格式 | outputType: 'png', // 裁剪生成图片的格式 | ||||
| @@ -149,13 +150,18 @@ export default { | |||||
| }, | }, | ||||
| // 点击裁剪的选择 | // 点击裁剪的选择 | ||||
| onClickRight() { | onClickRight() { | ||||
| const timestamp = Date.now(); | |||||
| let that = this; | let that = this; | ||||
| this.loadingShow = true; | this.loadingShow = true; | ||||
| console.log(this.$refs.cropper); | |||||
| // console.log(this.$refs.cropper); | |||||
| this.$refs.cropper.getCropData(data => { | |||||
| // do something | |||||
| // console.log(data, 'base64'); | |||||
| }); | |||||
| this.$refs.cropper.getCropBlob(async data => { | this.$refs.cropper.getCropBlob(async data => { | ||||
| console.log(data, '图片数据'); | |||||
| console.log(data, '上传图片数据'); | |||||
| let formData = new FormData(); | let formData = new FormData(); | ||||
| formData.append('file', data); | |||||
| formData.append('file', data, timestamp + '.png'); | |||||
| let file = formData.get('file'); | let file = formData.get('file'); | ||||
| // 转为 base64 | // 转为 base64 | ||||
| // let reader = new FileReader(); | // let reader = new FileReader(); | ||||
| @@ -262,6 +268,14 @@ export default { | |||||
| // .uploder{ | // .uploder{ | ||||
| // overflow: hidden; | // overflow: hidden; | ||||
| // } | // } | ||||
| /deep/.van-nav-bar__content { | |||||
| height: 8vh; | |||||
| background-color: #ccc; | |||||
| } | |||||
| /deep/.van-hairline--bottom::after { | |||||
| // height: 8vh; | |||||
| } | |||||
| /deep/.cropper-view-box { | /deep/.cropper-view-box { | ||||
| outline: 2px dashed #fff !important; | outline: 2px dashed #fff !important; | ||||
| } | } | ||||
| @@ -1,6 +1,7 @@ | |||||
| <template> | <template> | ||||
| <div v-if="proportion" :class="inPage ? 'page active' : 'page'" id="pageBody" @touchstart="globalClick"> | |||||
| <div class="content" :style="bgStyle" ref="fatherBox"> | |||||
| <div ref="fatherBox1" v-if="proportion" :class="inPage ? 'page active' : 'page'" id="pageBody" @touchstart="globalClick"> | |||||
| <div class="content" id="content" :style="bgStyle" ref="fatherBox"> | |||||
| <!-- <img style="width: 100px; height: 100px" :src="newImg" alt="" /> --> | |||||
| <!-- 控制框 --> | <!-- 控制框 --> | ||||
| <!-- <div class="control"> | <!-- <div class="control"> | ||||
| <div @click="controlImg(1)">放大</div> | <div @click="controlImg(1)">放大</div> | ||||
| @@ -96,6 +97,7 @@ export default { | |||||
| }, | }, | ||||
| data() { | data() { | ||||
| return { | return { | ||||
| newImg: false, | |||||
| inPage: false, | inPage: false, | ||||
| dragging: false, | dragging: false, | ||||
| proportionSon: null, | proportionSon: null, | ||||
| @@ -133,6 +135,7 @@ export default { | |||||
| methods: { | methods: { | ||||
| ...mapActions(['setCharacters']), | ...mapActions(['setCharacters']), | ||||
| // 组件 | // 组件 | ||||
| globalClick(e) { | globalClick(e) { | ||||
| console.log(e.target.id); | console.log(e.target.id); | ||||
| @@ -224,6 +227,7 @@ export default { | |||||
| // 数字人的处理 | // 数字人的处理 | ||||
| // 鼠标按下事件 | // 鼠标按下事件 | ||||
| virtualTouchStart() { | virtualTouchStart() { | ||||
| this.generateImage(); | |||||
| this.domIndex = -2; | this.domIndex = -2; | ||||
| this.isFcous = true; | this.isFcous = true; | ||||
| this.dragging = true; | this.dragging = true; | ||||
| @@ -28,3 +28,4 @@ new Vue({ | |||||
| render: function (h) { return h(App) } | render: function (h) { return h(App) } | ||||
| }).$mount('#app') | }).$mount('#app') | ||||
| @@ -53,6 +53,10 @@ p { | |||||
| transform: translate(-50%, -50%); | transform: translate(-50%, -50%); | ||||
| } | } | ||||
| .van-toast { | |||||
| // font-size: 12px !important; | |||||
| width: 70% !important; | |||||
| } | |||||
| // 字体导入 | // 字体导入 | ||||
| @font-face { | @font-face { | ||||
| font-family: "ALi Regular"; | font-family: "ALi Regular"; | ||||
| @@ -76,3 +80,12 @@ p { | |||||
| font-family: "ALi Regular","Heiti", "Simsun", "Helvetica Neue", Helvetica, Arial, sans-serif; | font-family: "ALi Regular","Heiti", "Simsun", "Helvetica Neue", Helvetica, Arial, sans-serif; | ||||
| } | } | ||||
| // @media screen and (max-width: 280px) { | |||||
| // /* 根据实际情况修改字体大小和元素宽度 */ | |||||
| // html { | |||||
| // -webkit-text-size-adjust: none !important; | |||||
| // font-size: 8px; | |||||
| // } | |||||
| // } | |||||
| @@ -416,6 +416,7 @@ export default { | |||||
| try { | try { | ||||
| const res = await doRegisterByPhone(data); | const res = await doRegisterByPhone(data); | ||||
| console.log(res); | console.log(res); | ||||
| Toast.success('注册成功!'); | |||||
| this.loginType = 1; | this.loginType = 1; | ||||
| } catch (error) { | } catch (error) { | ||||
| console.log(error, 'error'); | console.log(error, 'error'); | ||||
| @@ -442,7 +442,8 @@ export default { | |||||
| clickBottomTab(index) { | clickBottomTab(index) { | ||||
| if (index == 1) { | if (index == 1) { | ||||
| if (this.textareaContent == 0) { | if (this.textareaContent == 0) { | ||||
| Toast.fail('输入文案后才可以选择声音哦~~'); | |||||
| // Toast.fail('输入文案后才可以选择声音哦~~'); | |||||
| Toast('输入文案后才可以选择声音哦~~'); | |||||
| return; | return; | ||||
| } | } | ||||
| this.showSoundList2 = false; | this.showSoundList2 = false; | ||||
| @@ -577,12 +578,14 @@ export default { | |||||
| forbidClick: true | forbidClick: true | ||||
| }); | }); | ||||
| if (!this.textareaContent) { | if (!this.textareaContent) { | ||||
| Toast.fail('请输入文案内容!'); | |||||
| // Toast.fail('请输入文案内容!'); | |||||
| Toast('请输入文案内容!'); | |||||
| return; | return; | ||||
| } | } | ||||
| // 当没有选择声音参数时 | // 当没有选择声音参数时 | ||||
| if (!this.soundChoose.id) { | if (!this.soundChoose.id) { | ||||
| Toast.fail('请选择声音!'); | |||||
| // Toast.fail('请选择声音!'); | |||||
| Toast('请选择声音!'); | |||||
| return; | return; | ||||
| } | } | ||||
| // 当没有选择声音参数时 | // 当没有选择声音参数时 | ||||
| @@ -26,7 +26,7 @@ | |||||
| <!-- 具体内容 --> | <!-- 具体内容 --> | ||||
| <div v-show="!showLoading"> | <div v-show="!showLoading"> | ||||
| <!-- 列表样式--大图 --> | <!-- 列表样式--大图 --> | ||||
| <div v-if="videoList.length == 0">暂无数据</div> | |||||
| <div v-if="videoList.length == 0" style="height: 550px">暂无数据</div> | |||||
| <!-- 新 修改v-if--> | <!-- 新 修改v-if--> | ||||
| <div v-if="waterfallBug"> | <div v-if="waterfallBug"> | ||||
| <waterfall v-if="videoList.length != 0" v-show="listActive == 1" class="waterFall" :col="2" :data="videoList"> | <waterfall v-if="videoList.length != 0" v-show="listActive == 1" class="waterFall" :col="2" :data="videoList"> | ||||
| @@ -104,7 +104,8 @@ | |||||
| <!-- 创建新作品 --> | <!-- 创建新作品 --> | ||||
| <!-- <div class="goAdd" @click="checkInviteCode">+ 创作新作品</div> --> | <!-- <div class="goAdd" @click="checkInviteCode">+ 创作新作品</div> --> | ||||
| <div class="goNewAdd" @click="checkInviteCode"> | <div class="goNewAdd" @click="checkInviteCode"> | ||||
| <i class="el-icon-plus"></i> | |||||
| <img src="../../assets/icon/icon-plus.png" alt="" /> | |||||
| <!-- <i class="el-icon-plus"></i> --> | |||||
| </div> | </div> | ||||
| <div class="messageCover" :class="isShowMessageCover ? 'active' : ''" @click="exitCover"> | <div class="messageCover" :class="isShowMessageCover ? 'active' : ''" @click="exitCover"> | ||||
| @@ -210,7 +211,7 @@ export default { | |||||
| if (seconds) { | if (seconds) { | ||||
| return formatSeconds(seconds); | return formatSeconds(seconds); | ||||
| } else { | } else { | ||||
| return '无'; | |||||
| return '暂未获取'; | |||||
| } | } | ||||
| }, | }, | ||||
| @@ -219,7 +220,7 @@ export default { | |||||
| if (bytes) { | if (bytes) { | ||||
| return bytesToSize(bytes); | return bytesToSize(bytes); | ||||
| } else { | } else { | ||||
| return '无'; | |||||
| return '暂未获取'; | |||||
| } | } | ||||
| }, | }, | ||||
| @@ -361,6 +362,10 @@ export default { | |||||
| mounted() { | mounted() { | ||||
| this.inPage = true; | this.inPage = true; | ||||
| scrollToID('top'); | scrollToID('top'); | ||||
| console.log(process.env.NODE_ENV); | |||||
| console.log(process.env.VUE_APP_ENV); | |||||
| console.log(process.env.VUE_APP_API_ROOT); | |||||
| }, | }, | ||||
| async created() { | async created() { | ||||
| @@ -383,6 +388,7 @@ export default { | |||||
| } | } | ||||
| .page { | .page { | ||||
| // transform: translateX(30%); | // transform: translateX(30%); | ||||
| min-height: 100vh; | |||||
| opacity: 0; | opacity: 0; | ||||
| transition: all 0.5s; // global-transition | transition: all 0.5s; // global-transition | ||||
| padding-bottom: 25px; | padding-bottom: 25px; | ||||
| @@ -590,12 +596,19 @@ export default { | |||||
| width: 60px; | width: 60px; | ||||
| height: 60px; | height: 60px; | ||||
| border-radius: 50%; | border-radius: 50%; | ||||
| font-size: 40px; | |||||
| line-height: 60px; | |||||
| text-align: center; | |||||
| // font-size: 40px; | |||||
| // line-height: 60px; | |||||
| // text-align: center; | |||||
| color: #ffffff; | color: #ffffff; | ||||
| background: linear-gradient(316deg, #6ee4d7 0%, #37c4f1 32%, #a49afc 100%); | background: linear-gradient(316deg, #6ee4d7 0%, #37c4f1 32%, #a49afc 100%); | ||||
| box-shadow: 0px 2px 6px 0px rgba(114, 100, 245, 0.25); | box-shadow: 0px 2px 6px 0px rgba(114, 100, 245, 0.25); | ||||
| display: flex; | |||||
| justify-content: space-around; | |||||
| align-items: center; | |||||
| img { | |||||
| width: 60%; | |||||
| height: 60%; | |||||
| } | |||||
| } | } | ||||
| .messageCover { | .messageCover { | ||||
| position: fixed; | position: fixed; | ||||
| @@ -1,6 +1,7 @@ | |||||
| // const UglifyJsPlugin = require('uglifyjs-webpack-plugin') | // const UglifyJsPlugin = require('uglifyjs-webpack-plugin') | ||||
| const path = require('path'); | const path = require('path'); | ||||
| let externals = {} | let externals = {} | ||||
| let cdn = { css: [], js: [] } | let cdn = { css: [], js: [] } | ||||
| const isProduction = process.env.VUE_APP_ENV == 'production' // 判断是否是生产环境 | const isProduction = process.env.VUE_APP_ENV == 'production' // 判断是否是生产环境 | ||||
| @@ -27,15 +28,15 @@ if (isProduction) { | |||||
| } | } | ||||
| } | } | ||||
| module.exports = { | module.exports = { | ||||
| configureWebpack: { | |||||
| configureWebpack: { | |||||
| resolve: { | resolve: { | ||||
| alias: { | alias: { | ||||
| '@': path.resolve(__dirname, 'src') | '@': path.resolve(__dirname, 'src') | ||||
| } | } | ||||
| }, | }, | ||||
| externals | |||||
| externals, | |||||
| }, | }, | ||||
| css: { | css: { | ||||
| loaderOptions: { | loaderOptions: { | ||||
| @@ -316,13 +316,13 @@ | |||||
| resolved "https://registry.npmmirror.com/@tufjs/canonical-json/-/canonical-json-1.0.0.tgz#eade9fd1f537993bc1f0949f3aea276ecc4fab31" | resolved "https://registry.npmmirror.com/@tufjs/canonical-json/-/canonical-json-1.0.0.tgz#eade9fd1f537993bc1f0949f3aea276ecc4fab31" | ||||
| integrity sha512-QTnf++uxunWvG2z3UFNzAoQPHxnSXOwtaI3iJ+AohhV+5vONuArPjJE7aPXPVXfXJsqrVbZBu9b81AJoSd09IQ== | integrity sha512-QTnf++uxunWvG2z3UFNzAoQPHxnSXOwtaI3iJ+AohhV+5vONuArPjJE7aPXPVXfXJsqrVbZBu9b81AJoSd09IQ== | ||||
| "@tufjs/models@1.0.2": | |||||
| version "1.0.2" | |||||
| resolved "https://registry.npmmirror.com/@tufjs/models/-/models-1.0.2.tgz#6c1e99210ada62c057b1742b5528d85acbfe0a47" | |||||
| integrity sha512-uxarDtxTIK3f8hJS4yFhW/lvTa3tsiQU5iDCRut+NCnOXvNtEul0Ct58NIIcIx9Rkt7OFEK31Ndpqsd663nsew== | |||||
| "@tufjs/models@1.0.3": | |||||
| version "1.0.3" | |||||
| resolved "https://registry.npmmirror.com/@tufjs/models/-/models-1.0.3.tgz#e6cb8a86834da7459a7c836cd892dee56b4bab44" | |||||
| integrity sha512-mkFEqqRisi13DmR5pX4x+Zk97EiU8djTtpNW1GeuX410y/raAsq/T3ZCjwoRIZ8/cIBfW0olK/sywlAiWevDVw== | |||||
| dependencies: | dependencies: | ||||
| "@tufjs/canonical-json" "1.0.0" | "@tufjs/canonical-json" "1.0.0" | ||||
| minimatch "^8.0.3" | |||||
| minimatch "^7.4.6" | |||||
| "@types/body-parser@*": | "@types/body-parser@*": | ||||
| version "1.19.2" | version "1.19.2" | ||||
| @@ -3239,7 +3239,7 @@ file-loader@^4.2.0: | |||||
| file-saver@^2.0.5: | file-saver@^2.0.5: | ||||
| version "2.0.5" | version "2.0.5" | ||||
| resolved "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38" | |||||
| resolved "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz" | |||||
| integrity sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA== | integrity sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA== | ||||
| file-uri-to-path@1.0.0: | file-uri-to-path@1.0.0: | ||||
| @@ -5179,9 +5179,9 @@ lru-cache@^7.4.4, lru-cache@^7.5.1, lru-cache@^7.7.1: | |||||
| integrity sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA== | integrity sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA== | ||||
| lru-cache@^9.0.0: | lru-cache@^9.0.0: | ||||
| version "9.0.3" | |||||
| resolved "https://registry.npmmirror.com/lru-cache/-/lru-cache-9.0.3.tgz#8a04f282df5320227bb7215c55df2660d3e4e25b" | |||||
| integrity sha512-cyjNRew29d4kbgnz1sjDqxg7qg8NW4s+HQzCGjeon7DV5T2yDije16W9HaUFV1dhVEMh+SjrOcK0TomBmf3Egg== | |||||
| version "9.1.1" | |||||
| resolved "https://registry.npmmirror.com/lru-cache/-/lru-cache-9.1.1.tgz#c58a93de58630b688de39ad04ef02ef26f1902f1" | |||||
| integrity sha512-65/Jky17UwSb0BuB9V+MyDpsOtXKmYwzhyl+cOa9XUiI4uV2Ouy/2voFP3+al0BjZbJgMBD8FojMpAf+Z+qn4A== | |||||
| make-dir@^2.0.0: | make-dir@^2.0.0: | ||||
| version "2.1.0" | version "2.1.0" | ||||
| @@ -5468,14 +5468,14 @@ minimatch@^6.1.6, minimatch@^6.2.0: | |||||
| dependencies: | dependencies: | ||||
| brace-expansion "^2.0.1" | brace-expansion "^2.0.1" | ||||
| minimatch@^7.4.2: | |||||
| minimatch@^7.4.2, minimatch@^7.4.6: | |||||
| version "7.4.6" | version "7.4.6" | ||||
| resolved "https://registry.npmmirror.com/minimatch/-/minimatch-7.4.6.tgz#845d6f254d8f4a5e4fd6baf44d5f10c8448365fb" | resolved "https://registry.npmmirror.com/minimatch/-/minimatch-7.4.6.tgz#845d6f254d8f4a5e4fd6baf44d5f10c8448365fb" | ||||
| integrity sha512-sBz8G/YjVniEz6lKPNpKxXwazJe4c19fEfV2GDMX6AjFz+MX9uDWIZW8XreVhkFW3fkIdTv/gxWr/Kks5FFAVw== | integrity sha512-sBz8G/YjVniEz6lKPNpKxXwazJe4c19fEfV2GDMX6AjFz+MX9uDWIZW8XreVhkFW3fkIdTv/gxWr/Kks5FFAVw== | ||||
| dependencies: | dependencies: | ||||
| brace-expansion "^2.0.1" | brace-expansion "^2.0.1" | ||||
| minimatch@^8.0.2, minimatch@^8.0.3: | |||||
| minimatch@^8.0.2: | |||||
| version "8.0.4" | version "8.0.4" | ||||
| resolved "https://registry.npmmirror.com/minimatch/-/minimatch-8.0.4.tgz#847c1b25c014d4e9a7f68aaf63dedd668a626229" | resolved "https://registry.npmmirror.com/minimatch/-/minimatch-8.0.4.tgz#847c1b25c014d4e9a7f68aaf63dedd668a626229" | ||||
| integrity sha512-W0Wvr9HyFXZRGIDgCicunpQ299OKXs9RgZfaukz4qAW/pJhcpUfupc9c+OObPOFueNy8VSrZgEmDtk6Kh4WzDA== | integrity sha512-W0Wvr9HyFXZRGIDgCicunpQ299OKXs9RgZfaukz4qAW/pJhcpUfupc9c+OObPOFueNy8VSrZgEmDtk6Kh4WzDA== | ||||
| @@ -5694,10 +5694,10 @@ nan@^2.12.1, nan@^2.13.2: | |||||
| resolved "https://registry.npmmirror.com/nan/-/nan-2.17.0.tgz#c0150a2368a182f033e9aa5195ec76ea41a199cb" | resolved "https://registry.npmmirror.com/nan/-/nan-2.17.0.tgz#c0150a2368a182f033e9aa5195ec76ea41a199cb" | ||||
| integrity sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ== | integrity sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ== | ||||
| nanoid@^3.3.4: | |||||
| version "3.3.4" | |||||
| resolved "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.4.tgz" | |||||
| integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw== | |||||
| nanoid@^3.3.6: | |||||
| version "3.3.6" | |||||
| resolved "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.6.tgz" | |||||
| integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA== | |||||
| nanomatch@^1.2.9: | nanomatch@^1.2.9: | ||||
| version "1.2.13" | version "1.2.13" | ||||
| @@ -6970,11 +6970,11 @@ postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.27, postcss@^7.0.3 | |||||
| source-map "^0.6.1" | source-map "^0.6.1" | ||||
| postcss@^8.4.14: | postcss@^8.4.14: | ||||
| version "8.4.21" | |||||
| resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.21.tgz" | |||||
| integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg== | |||||
| version "8.4.23" | |||||
| resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.23.tgz" | |||||
| integrity sha512-bQ3qMcpF6A/YjR55xtoTr0jGOlnPOKAIMdOWiv0EIT6HVPEaJiJB4NLljSbiHoC2RX7DN5Uvjtpbg1NPdwv1oA== | |||||
| dependencies: | dependencies: | ||||
| nanoid "^3.3.4" | |||||
| nanoid "^3.3.6" | |||||
| picocolors "^1.0.0" | picocolors "^1.0.0" | ||||
| source-map-js "^1.0.2" | source-map-js "^1.0.2" | ||||
| @@ -7775,13 +7775,13 @@ signal-exit@^3.0.0, signal-exit@^3.0.2, signal-exit@^3.0.7: | |||||
| integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== | integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== | ||||
| sigstore@^1.0.0: | sigstore@^1.0.0: | ||||
| version "1.2.0" | |||||
| resolved "https://registry.npmmirror.com/sigstore/-/sigstore-1.2.0.tgz#ae5b31dac75c2d31e7873897e2862f0d0b205bce" | |||||
| integrity sha512-Fr9+W1nkBSIZCkJQR7jDn/zI0UXNsVpp+7mDQkCnZOIxG9p6yNXBx9xntHsfUyYHE55XDkkVV3+rYbrkzAeesA== | |||||
| version "1.3.2" | |||||
| resolved "https://registry.npmmirror.com/sigstore/-/sigstore-1.3.2.tgz#2f70ec3e1192911484d9d148ecd9c98345cd172d" | |||||
| integrity sha512-0KT1DjpVB11FK15ep7BIsZQV6j1jBm4SnXIInbBCRvql6II39IKONOMO+j036sGsArU/+2xqa1NDJwJkic0neA== | |||||
| dependencies: | dependencies: | ||||
| "@sigstore/protobuf-specs" "^0.1.0" | "@sigstore/protobuf-specs" "^0.1.0" | ||||
| make-fetch-happen "^11.0.1" | make-fetch-happen "^11.0.1" | ||||
| tuf-js "^1.0.0" | |||||
| tuf-js "^1.1.3" | |||||
| simple-swizzle@^0.2.2: | simple-swizzle@^0.2.2: | ||||
| version "0.2.2" | version "0.2.2" | ||||
| @@ -8520,12 +8520,12 @@ tty-browserify@0.0.0: | |||||
| resolved "https://registry.npmmirror.com/tty-browserify/-/tty-browserify-0.0.0.tgz" | resolved "https://registry.npmmirror.com/tty-browserify/-/tty-browserify-0.0.0.tgz" | ||||
| integrity sha512-JVa5ijo+j/sOoHGjw0sxw734b1LhBkQ3bvUGNdxnVXDCX81Yx7TFgnZygxrIIWn23hbfTaMYLwRmAxFyDuFmIw== | integrity sha512-JVa5ijo+j/sOoHGjw0sxw734b1LhBkQ3bvUGNdxnVXDCX81Yx7TFgnZygxrIIWn23hbfTaMYLwRmAxFyDuFmIw== | ||||
| tuf-js@^1.0.0: | |||||
| version "1.1.3" | |||||
| resolved "https://registry.npmmirror.com/tuf-js/-/tuf-js-1.1.3.tgz#db3aada70fbf91fd9def9ad255645eaf81309f69" | |||||
| integrity sha512-jGYi5nG/kqgfTFQSdoN6PW9eIn+XRZqdXku+fSwNk6UpWIsWaV7pzAqPgFr85edOPhoyJDyBqCS+DCnHroMvrw== | |||||
| tuf-js@^1.1.3: | |||||
| version "1.1.4" | |||||
| resolved "https://registry.npmmirror.com/tuf-js/-/tuf-js-1.1.4.tgz#e85a936b16859c7fae23e5f040bc0f7b559b3192" | |||||
| integrity sha512-Lw2JRM3HTYhEtQJM2Th3aNCPbnXirtWMl065BawwmM2pX6XStH/ZO9e8T2hh0zk/HUa+1i6j+Lv6eDitKTau6A== | |||||
| dependencies: | dependencies: | ||||
| "@tufjs/models" "1.0.2" | |||||
| "@tufjs/models" "1.0.3" | |||||
| make-fetch-happen "^11.0.1" | make-fetch-happen "^11.0.1" | ||||
| tunnel-agent@^0.6.0: | tunnel-agent@^0.6.0: | ||||