From 6c7ad2f955d68ff4012332c9e6b02428afb33a2b Mon Sep 17 00:00:00 2001 From: honghong <2401639944@qq.com> Date: Thu, 6 Apr 2023 19:01:55 +0800 Subject: [PATCH] 上传图片,视频, --- api/system/index.js | 7 ++++++- api/user.js | 4 ++-- components/form.vue | 99 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---------------------------------- components/record/record.vue | 42 ++++++++++++++++++++++++++++++++++++++++-- components/upload/aIndex.vue | 46 +++++++++++++++++++++++++++++++++------------- demand/index/index.vue | 2 +- demand/updateForm/updateForm.vue | 26 ++++++++++++++++++++------ my/login/login.vue | 91 ++++++++++++++++++++++++++++++++----------------------------------------------------------- package.json | 8 ++++---- pages/demand/components/index.vue | 4 ++-- pages/demand/index.vue | 4 +++- pages/my/index.vue | 27 ++++++++++++++++++++------- static/recordIcon/goon.png | Bin 0 -> 866 bytes utils/request.js | 4 ++-- 14 files changed, 230 insertions(+), 134 deletions(-) create mode 100644 static/recordIcon/goon.png diff --git a/api/system/index.js b/api/system/index.js index a710601..25e75b5 100644 --- a/api/system/index.js +++ b/api/system/index.js @@ -2,13 +2,17 @@ import { ApiHttp } from '@/utils/request.js' +//修改微信用户 +const updateUserMsg = (params) => { + return ApiHttp('/xinrenli/wxUser',params,'PUT') +} //用户需求广场 const userNeedSquare = (params) => { return ApiHttp('/xinrenli/order/userDemandSquare',params,'GET') } // 获取订单列表 const orderDetailList = (params) => { - return ApiHttp('/xinrenli/order/list',params,'GET') + return ApiHttp('/xinrenli/order/listUser',params,'GET') } // 获取订单详细信息 @@ -45,6 +49,7 @@ const removeOrderFunction = (params) =>{ } export { + updateUserMsg, userNeedSquare, orderDetailList, orderDetailMsg, diff --git a/api/user.js b/api/user.js index 3a54d44..efa2c92 100644 --- a/api/user.js +++ b/api/user.js @@ -7,7 +7,7 @@ const login = (params) => { } // 获取手机号 const loginPhone = (params) => { - return ApiHttp('/xcxPhoneLogin', params, 'POST') + return ApiHttp('/xcxPhoneLogin', params, 'GET') } const loginOut = (params) => { @@ -15,7 +15,7 @@ const loginOut = (params) => { } const loginUserInfo = (params) => { - return ApiHttp('/system/by-wx-user/getUserInfo', params, 'GET') + return ApiHttp('/getInfo', params, 'GET') } const getDealerPhone = (params) => { return ApiHttp('/system/getDealerPhone', params, 'POST') diff --git a/components/form.vue b/components/form.vue index 09c50d3..b7d2b37 100644 --- a/components/form.vue +++ b/components/form.vue @@ -56,7 +56,7 @@ <view class="form-tips">以下内容三选一必填</view> </view> <view class=""> - <comUpload></comUpload> + <comUpload v-model="formInfo.pictureList" @getVal="getPhotoList" ref="photoRef" ></comUpload> </view> </view> <view> @@ -64,7 +64,8 @@ <view class="form-item-name">上传视频</view> </view> <view class=""> - <comUpload :acceptType="acceptType"></comUpload> + <comUpload @getVal="getVideoList" ref="videoRef" :acceptType="acceptType" + :multiple="multiple"></comUpload> </view> </view> <view> @@ -81,11 +82,11 @@ <view>添加语音描述</view> </view> </view> - <!-- <u-popup :show="showPopup" @close="handleClosePopup" @open="handleOpenPopup"> + <u-popup :show="showPopup" @close="handleClosePopup" @open="handleOpenPopup"> <view class="padding-y-two"> - <recordCom></recordCom> + <recordCom @getVal="getVoiceList"></recordCom> </view> - </u-popup> --> + </u-popup> </view> </view> @@ -125,18 +126,10 @@ return { showTime: false, //时间选择器是否显示 acceptType: 'video', + multiple: false, //视频上传数量(多张、单张) path: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3', voicePath: '', showPopup: false, - // formInfo: { - // title: undefined, //标题 - // linkman: undefined, //联系人 - // phone: undefined, //联系电话 - // repairTime: undefined, //维修时间 - // repairAddress: undefined, //维修地址 - // budget: undefined, //预算金额 - // remark: undefined, //备注说明 - // }, formInfo: {}, rules: { title: { @@ -163,7 +156,8 @@ message: '请填写备注说明', trigger: ['blur', 'change'] }, - } + }, + }; }, @@ -193,28 +187,57 @@ // 时间格式化默认值 if (!that.formInfo.repairTime) { that.formInfo.repairTime = uni.$u.timeFormat(Number(new Date()), 'yyyy-mm-dd'); + }else{ + that.formInfo.repairTime = uni.$u.timeFormat(that.formInfo.repairTime, 'yyyy-mm-dd') } }, methods: { + // 获取上传图片的值 + getPhotoList(data) { + this.formInfo.pictureList.push({ + url: data.data.url, + fileType: 'picture' + }) + }, + // 获取上传视频的值 + getVideoList(data) { + this.formInfo.videoList.push({ + url: data.data.url, + fileType: 'video' + }) + }, + // 上传音频事件 + getVoiceList(data) { + this.formInfo.videoList.push({ + url: data.data.url, + fileType: 'voice' + }) + }, //确认修改和重新发布按钮 - handleUpdateForm(){ + handleUpdateForm() { this.$emit('submit', this.formInfo) }, async handleAdd() { let that = this + that.formInfo.repairTime = uni.$u.timeFormat(that.formInfo.repairTime, 'yyyy-mm-dd'); const data_back = await addOrderFunction(that.formInfo) - console.log(data_back,'提交') - const {code} = data_back - if(code == 200){ + const { + code + } = data_back + if (code == 200) { uni.showToast({ - title:'发布成功!', - icon:'none', - duration:2000, + title: '发布成功!', + icon: 'none', + duration: 2000, success() { - setTimeout(()=>{ - that.resetForm() - },1000) + let cleatTime = setTimeout(() => { + clearTimeout(cleatTime) + that.$uniGo.reLaunch({ + url:'/pages/demand/index' + }) + }, 1000) + } }) } @@ -223,7 +246,7 @@ handlePublish() { let that = this this.$refs.form.validate().then(res => { - if(res){ + if (res) { that.handleAdd() } }).catch(errors => { @@ -282,16 +305,24 @@ repairTime: undefined, //维修时间 repairAddress: '', //维修地址 budget: '', //预算金额 - remark: '测试默认值', //备注说明 - fileVos:[ + remark: '', //备注说明 + pictureList: [], //图片 + videoList: [], //视频 + voiceList: [ { - url:'https://img1.baidu.com/it/u=567782244,1695500002&fm=253&fmt=auto&app=138&f=JPEG?w=753&h=500',//地址 - fileType:'picture',//文件类型video - }, - - ], + url:'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3', + fileType: 'voice' + } + ], //音频 + // fileVos:[ + // { + // url:'https://img1.baidu.com/it/u=567782244,1695500002&fm=253&fmt=auto&app=138&f=JPEG?w=753&h=500',//地址 + // fileType:'picture',//文件类型video + // }, + + // ], // id:null, - userId:1,//用户id + userId: 1, //用户id } } } diff --git a/components/record/record.vue b/components/record/record.vue index db18bc9..6c5ff3e 100644 --- a/components/record/record.vue +++ b/components/record/record.vue @@ -28,7 +28,7 @@ <view>重新录制</view> </view> <view class="d-flex flex-column a-center" @click="bofang"> - <img class="record-icon" src="../../static/recordIcon/play.png" alt=""> + <img class="record-icon" :src="playStatus==1 ? '../../static/recordIcon/goon.png' : '../../static/recordIcon/play.png'" alt=""> <view>{{playStatus==1?'录音播放中':'播放录音'}}</view> </view> @@ -38,10 +38,12 @@ <view :class="status==2?'row':'no-clicking'" @click="jixu" hover-class="jump-hover">继续</view> <view :class="status==1 || status==2?'row':'no-clicking'" @click="tingzhi" hover-class="jump-hover">停止</view> --> </view> + <view class="upload-voice-text" @click="handleUpload">上传录音</view> </view> </template> <script> + import apiBaseConfig from '@/config/index.js'; const recorderManager = uni.getRecorderManager() const innerAudioContext = uni.createInnerAudioContext() var init @@ -53,9 +55,35 @@ tempFilePath: "", //音频路径 status: 0, //录音状态 0:未开始录音 1:正在录音 2:暂停录音 3:已完成录音 playStatus: 0, //录音播放状态 0:未播放 1:正在播放 + uploadUrl: apiBaseConfig.upload, } }, methods: { + //上传录音按钮事件 + async handleUpload(){ + console.log('山海关穿 ',this.uploadUrl,this.tempFilePath) + let that = this + return new Promise((resolve, reject) => { + let a = wx.uploadFile({ + url: that.uploadUrl, // 仅为示例,非真实的接口地址 + filePath: that.tempFilePath, + name: 'file', + header:{ + 'Authorization': `Bearer ${uni.getStorageSync('token')}` + }, + success: (res) => { + console.log(res,'dsan') + that.$emit('getVal',JSON.parse(res.data)) + setTimeout(() => { + resolve(res.data.data) + }, 1000) + }, + fail(err) { + console.log('失败',err) + } + }); + }) + }, handleStart() { let that = this if (that.status == 0) { @@ -119,7 +147,6 @@ * 停止录音 */ tingzhi: function() { - debugger recorderManager.onStop((res) => { console.log('recorder stop', res) this.tempFilePath = res.tempFilePath @@ -297,4 +324,15 @@ height: 80rpx; border: 5rpx solid rgb(241, 244, 245); } + .upload-voice-text{ + width: 276rpx; + height: 70rpx; + border-radius: 14rpx; + border: 2rpx solid #2C66FF; + text-align: center; + line-height: 70rpx; + color: #2C66FF; + font-size: 24rpx; + margin: 20rpx auto; + } </style> diff --git a/components/upload/aIndex.vue b/components/upload/aIndex.vue index ed001aa..fd77854 100644 --- a/components/upload/aIndex.vue +++ b/components/upload/aIndex.vue @@ -1,7 +1,8 @@ <template> <view class="index"> - <u-upload :fileList="fileList1" name="1" @afterRead="afterRead" @delete="deletePic" :multiple="true" :maxCount="5" - width="210" height="210" :accept="acceptType"> + + <u-upload :fileList="fileList1" name="1" @afterRead="afterRead" @delete="deletePic" :multiple="multiple" + :maxCount="5" width="210" height="210" :accept="acceptType"> <view class="index-upload d-flex j-center a-center"> <image v-if="imgType === 'camera'" src="@/static/icon/camera.png" mode="widthFix"></image> <view class="index-upload-tlo d-flex flex-wrap j-center" v-else-if="imgType === 'cross'"> @@ -29,6 +30,14 @@ crossTextShow: { type: Boolean, default: true + }, + multiple: { + type: Boolean, + default: true + }, + value: { + typr: Array, + default: () => [] } }, data() { @@ -37,15 +46,29 @@ fileList1: [], }; }, + watch:{ + value:{ + handler(newVal,oldVal){ + console.log(newVal,newVal,'监听') + if(newVal.length){ + this.fileList1 = newVal + console.log(this.fileList1,'大家撒') + }else{ + this.fileList1 = [] + } + }, + immediate:true, + deep:true + } + }, onLoad() {}, methods: { - // 删除图片 deletePic(event) { - this[`fileList${event.name}`].splice(event.index, 1); + this[`fileList${event.name}`].splice(event.index, 1) }, + // 新增图片 async afterRead(event) { - console.log(event) - // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式 + // 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式 let lists = [].concat(event.file) let fileListLen = this[`fileList${event.name}`].length lists.map((item) => { @@ -66,20 +89,17 @@ fileListLen++ } }, - //上传图片 uploadFilePromise(url) { - let that = this return new Promise((resolve, reject) => { let a = uni.uploadFile({ - //url: this.$common.domain+'/api/common/upload', // 仅为示例,非真实的接口地址 - url:that.uploadUrl , // 仅为示例,非真实的接口地址 + url: this.uploadUrl, // 仅为示例,非真实的接口地址 filePath: url, name: 'file', - formData: { - user: 'test' + header:{ + 'Authorization': `Bearer ${uni.getStorageSync('token')}` }, success: (res) => { - console.log(res, '第三款') + this.$emit('getVal',JSON.parse(res.data)) setTimeout(() => { resolve(res.data.data) }, 1000) diff --git a/demand/index/index.vue b/demand/index/index.vue index a0d9b9c..8b20ddd 100644 --- a/demand/index/index.vue +++ b/demand/index/index.vue @@ -61,7 +61,7 @@ <view class="font-bold"> <text></text>订单已驳回 </view> - <view class="paddding-x-two">驳回理由:沟通金额没有谈妥</view> + <view class="paddding-x-two">驳回理由:{{detailData && detailData.reasonsForRejection ? detailData.reasonsForRejection : '暂无'}}</view> <!-- <u--textarea v-model="detailData.value1" placeholder="请输入内容" disabled></u--textarea> --> </view> <view class="content-reject" v-if="subscript == 3 && subs== '1'"> diff --git a/demand/updateForm/updateForm.vue b/demand/updateForm/updateForm.vue index 5ede201..5b9de70 100644 --- a/demand/updateForm/updateForm.vue +++ b/demand/updateForm/updateForm.vue @@ -35,18 +35,32 @@ orderDetailMsgNew({ id: that.detailInfo.id }).then(res => { - console.log('订单详情', res) if (res.code == 200) { that.detailData = res.data } }) }, //重新发布和修改按钮事件 - handleSubmit(data){ - console.log(data,'表单重新提交') - updateOrderFunction(data).then(res=>{ - console.log(res,'重新提交返回') - }) + async handleSubmit(data){ + let that = this + const back_data = await updateOrderFunction(data) + const {code} = back_data + if(code == 200){ + uni.showToast({ + title: '修改成功!', + icon: 'none', + duration: 2000, + success() { + let cleatTime = setTimeout(() => { + clearTimeout(cleatTime) + that.$uniGo.navigateBack({ + delta:1 + }) + }, 1000) + + } + }) + } } } } diff --git a/my/login/login.vue b/my/login/login.vue index af030e0..90b5bcf 100644 --- a/my/login/login.vue +++ b/my/login/login.vue @@ -14,7 +14,7 @@ </template> <script> - import {login} from '@/api/user.js' + import {login,loginPhone,loginUserInfo} from '@/api/user.js' export default { data() { @@ -22,7 +22,8 @@ height:0, loginParams:{ xcxCode:'' - } + }, + token:'' } }, onLoad() { @@ -41,36 +42,28 @@ let that = this uni.login({ success(res) { - console.log(res,'获取code') that.getSessionkeyAndOpenId(res.code) } }) }, // 2.获取sessionKey,openId - async getSessionkeyAndOpenId(code) { - const back_data = await login({xcxCode:code}) - console.log(back_data,'静默登录') + async getSessionkeyAndOpenId(xcxCode) { + let that = this + const back_data = await login({xcxCode:xcxCode}) + const {code,data} = back_data + if(code === 200){ + uni.setStorageSync('token',data.token) + } }, - // async getSessionkeyAndOpenId() { - // const res = await this.$myRequest({ - // url:`/xcxLogin?appid=${this.loginParams.appid}&code=${this.loginParams.code}`, - // }) - // if(res.data.code == 200){ - // let dataObj = JSON.parse(res.data.data) - // this.sessionKey = dataObj.sessionKey - // this.openid = dataObj.openid - // } - // }, - // 3.授权手机号登录拿到encryptedData和iv + + // 3.授权手机号登录 getPhoneNumber(e) { + let that = this // 同意登录 - console.log(e,'第三节') if (e.detail.errMsg == "getPhoneNumber:ok") { - console.log(e,'Dasnj ') - const iv = e.detail.iv - const encryptedData = e.detail.encryptedData - this.getNumberAndToken(iv,encryptedData) + console.log(e.detail.code,'Dasnj ') + that.getPhoneLogin(e.detail.code) } else { // 取消授权 清空头像和昵称 uni.navigateBack({ @@ -78,46 +71,26 @@ }) } }, - // 4.获取token - async getNumberAndToken(iv, encryptedData) { - const res = await this.$myRequest({ - url:'/phone', - method:'POST', - data:{ - appid:this.loginParams.appid, - encryptedData:encryptedData, - iv:iv, - sessionKey:this.sessionKey, - openid:this.openid, - rawData:this.rawData, - signature:this.signature - } - }) - if(res.data.code == 200){ - console.log(res.data.data.token,'token') - uni.setStorageSync('token',res.data.data.token) - uni.setStorageSync('powerIds',res.data.data.powerIds) - uni.setStorageSync('userInfo',res.data.data.feederUserVo) - uni.showToast({ - title:'登录成功', - icon:'none', - duration:2000, - success() { - setTimeout(()=>{ - uni.reLaunch({ - url:'../index/index' - }) - },1000) - } + // 获取手机号 + async getPhoneLogin(xcxCode){ + let that = this + const data_back = await loginPhone({xcxCode:xcxCode}) + const {code} = data_back + if(code === 200){ + that.getUserMsg() + + } + }, + async getUserMsg(){ + const data_back = await loginUserInfo() + const {code,data} = data_back + if(code === 200){ + uni.setStorageSync('mobile',data.user.mobile) + this.$uniGo.reLaunch({ + url:'/pages/home/index' }) } }, - //使用账号密码 - handleUse(){ - uni.navigateTo({ - url:'../chooseLogin/chooseLogin' - }) - } } } </script> diff --git a/package.json b/package.json index 3846173..5c84b21 100644 --- a/package.json +++ b/package.json @@ -11,8 +11,8 @@ "env": { "UNI_PLATFORM": "mp-weixin", "UNI_BASE_ENV": "development", - "UNI_BASE_URL": "http://192.168.0.182:8996", - "UNI_BASE_API": "/custom" + "UNI_BASE_URL": "http://192.168.0.175:7001", + "UNI_BASE_API": "" }, "define": { "CUSTOM-DEV": true @@ -23,8 +23,8 @@ "env": { "UNI_PLATFORM": "mp-weixin", "UNI_BASE_ENV": "uat", - "UNI_BASE_URL": "http://192.168.0.175:7001", - "UNI_BASE_API": "" + "UNI_BASE_URL": "http://xinrenli.nyinhong.com", + "UNI_BASE_API": "/api" }, "define": { "CUSTOM-UAT": true diff --git a/pages/demand/components/index.vue b/pages/demand/components/index.vue index a28dbb4..d8773e7 100644 --- a/pages/demand/components/index.vue +++ b/pages/demand/components/index.vue @@ -12,7 +12,7 @@ </view> <view class="content-matter-substance"> - <image :src="item.fileVos[0].url" mode=""></image> + <image :src="item.pictureList[0].url" mode=""></image> <view class=""> <view class=""> 说明:{{item.remark ? item.remark : '暂无说明'}} @@ -25,7 +25,7 @@ <!-- // 已驳回 --> <view class="d-flex a-end j-sb" v-if="subscript == '1'"> <view class="reject flex-1 hiddenMore"> - 驳回理由:没有明确问题描述没有明确问题描述没有明确问题描述没有明确问题描述 + 驳回理由:{{item.reasonsForRejection ? item.reasonsForRejection : '暂无'}} </view> <button @click.stop="handleAgainAdd(item)" class="buttoncl" style="margin-left: 20rpx;">重新发布</button> </view> diff --git a/pages/demand/index.vue b/pages/demand/index.vue index 96eb6f3..7710871 100644 --- a/pages/demand/index.vue +++ b/pages/demand/index.vue @@ -85,7 +85,6 @@ pageNum: 1, status: 0, deleteStatus: 0, - userId: 1, orderByColumn:'modifyTime', isAsc:'desc' }, @@ -99,12 +98,15 @@ if (option.id) { this.subscript = option.id } + }, + onShow() { this.getMyNeedList() }, methods: { async getMyNeedList() { let that = this that.needInfo.status = that.subscript + that.statusNeedList = [] const data_back = await orderDetailList(that.needInfo) const { code, diff --git a/pages/my/index.vue b/pages/my/index.vue index 8dce3b5..68eb1f6 100644 --- a/pages/my/index.vue +++ b/pages/my/index.vue @@ -9,11 +9,11 @@ </button> <view class="content-in-info-r"> <view class="content-in-info-r-t baiyin-flex"> - <text v-if="nameDisabled">用户名称</text> - <input v-else confirm-type="确定" @confirm="inputNameConfirm" maxlength="15" type="text" value="用户名称" /> + <text v-if="nameDisabled">{{$store.state.login.userInfo.user.nickname}}</text> + <input v-else confirm-type="确定" @confirm="inputNameConfirm" maxlength="15" type="text" value="用户名称1" /> <image src="@/static/icon/my02.png" mode="" @click="nameDisabled = !nameDisabled"></image> </view> - <view class="content-in-info-r-b">手机号:12385757454</view> + <view class="content-in-info-r-b" v-if="mobile">手机号:{{mobile}}</view> </view> </view> <view class="content-in-item baiyin-flex baiyin-flex-c-sb baiyin-flex-c-b" v-for="(item, index) in list" :key="index" @click="index != 0 ? clickJumpNPage(item) : null"> @@ -84,14 +84,17 @@ <script> import apiBaseConfig from '@/config/index.js'; -import { mapMutations } from 'vuex'; +import { mapMutations } from 'vuex'; +import {updateUserMsg} from '@/api/system/index.js' export default { data() { return { imgBgUrl: apiBaseConfig.imgBgUrl, globalData: getApp().globalData, scrollTopHeader: 0, - nameDisabled: true, + nameDisabled: true, + nickname:'zhangsan', + mobile:'',//手机号 list: [ { icon: require('@/static/icon/my04.png'), @@ -120,7 +123,12 @@ export default { ] }; }, - onLoad() {}, + onLoad() { + console.log(this.$store.state.login.userInfo.user.nickname,'D撒') + let mobile = uni.getStorageSync('mobile') + console.log(mobile,'手机号') + this.mobile = mobile + }, methods: { ...mapMutations(['upDateUserInfoMount']), onChooseavatar(e) { @@ -154,7 +162,12 @@ export default { }); }, inputNameConfirm(e) { - console.log('======inputNameConfirm:', e); + console.log('======inputNameConfirm:', e.detail.value); + this.updateUser(e.detail.value) + }, + async updateUser(value){ + const back_data = await updateUserMsg({nickname:value}) + console.log(back_data) }, clickJumpNPage(row) { if (row.url) { diff --git a/static/recordIcon/goon.png b/static/recordIcon/goon.png new file mode 100644 index 0000000..7cb8fb9 Binary files /dev/null and b/static/recordIcon/goon.png differ diff --git a/utils/request.js b/utils/request.js index 3de79dd..e861c52 100644 --- a/utils/request.js +++ b/utils/request.js @@ -33,9 +33,9 @@ function switchMethod(method) { **/ const ApiHttp = (url, params, method, isToken = true) => { let header = {}, - token = store.state.login.token || null; + token = uni.getStorageSync('token') || null; + // token = store.state.login.token || null; header = switchMethod(method) - // console.log(store.state.login.token,'================token') if (isToken) { header = { ...header, -- libgit2 0.26.0