ltlzx
/
cnic_buyer
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 Commits
1 Branch
0 Tags
63 MiB
 
 
 
 
 
 
Tree: c5a59f5221
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'c5a59f5221'
${ noResults }
cnic_buyer/pages/productDetails/review.vue

519 lines
14 KiB
Raw Blame History

<template>
<view>
<uni-nav-bar :statusBar="true" left-icon="left" title="Review" color="#FFF" backgroundColor="#000" :fixed="true" @clickLeft="back">
<block slot="right">
<view class="nav_right">
<button @click="reviewSub">Submit</button>
</view>
</block>
</uni-nav-bar>
<view class="body" v-for="(item,index) in orderDate.order_goods " :key="index">
<view class="order_popup_commodity">
<view class="good_info" >
<view class="good_info_left ">
<view class="good_info_image">
<image :src="item.goods_thumb || item.goods_img" mode=""></image>
</view>
<view class="left_info">
<view class="info_name">{{item.goods_name}}</view>
<view class="left_info_bottom">
<view class="info_lable" v-if="item.goods_attr">
<text>{{item.goods_attr |goodsAttr}}</text>
<!-- <image src="/static/img/bottom.png" mode=""></image> -->
</view>
</view>
</view>
</view>
</view>
</view>
<view class="review">
<view class="review_title">
<text>Score</text>
<uni-rate size="22" disabledColor="#B22234" v-model="query.comment_rank" active-color="#B22234" :is-fill="false" class="rate" v-if="reviewType==0"/>
<uni-rate size="22" disabledColor="#B22234" v-model="query1.comments[index].comment_rank" active-color="#B22234" :is-fill="false" class="rate" v-else/>
</view>
<view class="review_content">
<image src="../../static/img/write.png" mode=""></image>
<textarea placeholder="Write reviews" v-if="reviewType==0" v-model="query.comment"></textarea>
<textarea placeholder="Write reviews" v-else v-model="query1.comments[index].comment"></textarea>
</view>
<view class="reason_upload">
<view class="reason_upload_item" @click="UploadVideo">
<!-- <view class="reason_upload_item1 margin_left" @click="deleteImg(VideoId)" v-model="VideoId" v-if="VideoSrc"></view> -->
<image src="/static/img/vedio.png" class="upload_item_camera1" mode=""v-if="!VideoSrc"></image>
<video :src="VideoSrc" class="upload_item_camera2" mode=""
id="videoId"
object-fit="contain"
@play="play"
@fullscreenchange="fullscreenchange"
v-else>
</video>
<view v-if="!VideoSrc">Upload the video</view>
</view>
<view class="reason_upload_item" @click="Upimg()">
<image src="/static/img/camera.png" class="upload_item_camera" mode="" ></image>
<!-- <image :src="imgSrc" class="upload_item_camera" mode="" v-else></image> -->
<view>Upload pictures</view>
</view>
<view class="reason_upload_item " v-for="(item,index) in imglist" :key="index">
<view class="reason_upload_item1" @click="deleteImg(item.id,0)" v-model="item.id"></view>
<image :src="item.url" class="upload_item_image" mode="" ></image>
</view>
</view>
<view class="reason_upload_tips">Upload JPG, PNG format, within 3M</view>
<view class="reason_upload_tips"></view>
<view class="reason_upload_tipV" @click="deleteImg(VideoId,1)" v-model="VideoId" v-if="VideoSrc">Delete Video</view>
<!-- <view style="height: 100rpx;width: 100rpx;">
<image :src="imgSrc" class="upload_item_image" style="height: 100%;width: 100%;"mode="" ></image>
</view> -->
</view>
</view>
</view>
</template>
<script>
import {defaultRequest,defaultRequest2,defaultRequest3,defaultRequest5} from '../../api/index.js'
import { encryptDes, decryptDes ,encrypt_by_des } from '@/utils/des.js'
import Base64 from 'base-64';
import cryptoJS from "crypto-js"
import { pathToBase64 } from '@/js_sdk/mmmm-image-tools/index.js'
export default {
data() {
return {
orderDate:{},
// 评论状态 0、单个评论 1批量评论
reviewType:0,
query:{
_action:'commentordergoods',
order_id:'',
order_sn:'',
rec_id:'',
goods_id:'',
comment:'',
comment_rank:'',
commentlabels:''
},
query1:{
_action:'commentorder',
order_id:'',
order_sn:'',
comments:[]
},
VideoSrc:'',
VideoId:'',
imgSrc:'',
imglist:[],
videoPlay: false,
videoUrl: '',
ids:[]
}
},
methods:{
// 播放时进入全屏
play(index) {
let videoContext = uni.createVideoContext('videoId', this)
videoContext.requestFullScreen()
},
//退出全屏时暂停
fullscreenchange(e) {
if (!e.detail.fullScreen) {
uni.createVideoContext('videoId', this).pause();
}
},
//退出全屏时停止
fullscreenchange (e){
if(!e.detail.fullScreen){
this.videoContext.stop()
}
},
reviewSub(){
this.query.attachments = this.ids
let data
if(this.reviewType==0){
this.commentordergoods()
}else{
// data=this.query1
this.commentordergoods1()
}
console.info(data)
defaultRequest(this.query).then( res =>{
console.log(res)
})
},
// 单个评论内容
commentordergoods(){
defaultRequest2(this.query).then(res=>{
console.info(res)
if(res.error==0){
uni.showToast({
icon:'none',
title:'Comment successful!'
})
setTimeout(function(){
uni.navigateBack()
},2000)
}
})
},
// 批量评论内容
commentordergoods1(){
defaultRequest2(this.query1,'comments').then(res=>{
console.info(res)
if(res.error==0){
uni.showToast({
icon:'none',
title:'Comment successful!'
})
setTimeout(function(){
uni.navigateBack()
},2000)
}
})
},
back(){
uni.navigateBack()
},
// 上传视频
UploadVideo(){
var that = this
const json_data={
appcode:'DOPE+' ,//应用编码
appchannel:'FXXXXHUAWEI' ,//应用发布渠道
appver: '1.0.0',//应用版本
appname:'cnic_buyer' ,//应用名称
manufacturer:'HUAWEI' ,//设备生产商
phonebrand:'HORNOR' ,//设备品牌
phonetype:'X30' ,//设备型号
phoneos:'ANDROID',// 设备系统
_action:'uploadcommentfile',//上传图片
atype: 2,//视频类型
// afile:res.tempFiles[0]
}
let data = encryptDes(JSON.stringify(json_data),'6780f04cf2e211ec86a8005056c00008');
uni.chooseVideo({
sourceType: ['camera', 'album'],
success: function (res) {
console.log(res)
// that.VideoSrc = res.tempFilePath;
uni.uploadFile({
url: 'https://lilbeattranapismits.dopeplus.com/mapi/api_v2011.php?appcode=DOPE+',
filePath: res.tempFilePath,
name: 'afile',
formData:{
'data':data
},
success: (uploadFileRes) => {
console.log(uploadFileRes);
let data=decryptDes(uploadFileRes.data,'6780f04cf2e211ec86a8005056c00008');
console.log(JSON.parse(data));
let lists = JSON.parse(data)
// this.video = lists.data
that.VideoId = lists.data.attachment_id
that.VideoSrc = lists.data.attachment_url
// setTimeout( () =>{
// uni.showLoading({
// title:'',
// icon:'none'
// })
// },2000)
// console.log(this.VideoSrc,'000')
that.ids.push(lists.data.attachment_id)
console.log(that.ids)
// this.imglist = lists.data
// that.imglist = this.imglist.push(lists.data)
// console.log(that.imglist)
}
});
}
})
},
// 上传图片
Upimg(){
var that = this
let url
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
sourceType: ['album'], //从相册选择
success: function (res) {
console.info(res)
console.log(JSON.stringify(res.tempFilePaths));
const tempFilePaths = res.tempFilePaths
console.log(res.tempFiles[0])
uni.getImageInfo({
src: res.tempFilePaths[0],
success: (path) => {
pathToBase64(path.path).then(base64 => {
// console.log(base64); // 这就是转为base64格式的图片
url = base64
})
.catch(error => {
console.error(error)
})
}})
const json_data={
appcode:'DOPE+' ,//应用编码
appchannel:'FXXXXHUAWEI' ,//应用发布渠道
appver: '1.0.0',//应用版本
appname:'cnic_buyer' ,//应用名称
manufacturer:'HUAWEI' ,//设备生产商
phonebrand:'HORNOR' ,//设备品牌
phonetype:'X30' ,//设备型号
phoneos:'ANDROID',// 设备系统
_action:'uploadcommentfile',//上传图片
atype: 1,//图片类型
// afile:res.tempFiles[0]
}
//加密
let data = encryptDes(JSON.stringify(json_data),'6780f04cf2e211ec86a8005056c00008');
let file = encryptDes(JSON.stringify(res.tempFiles[0]),'6780f04cf2e211ec86a8005056c00008')
// let str = {
// _action: 'uploadcommentfile',
// atype:1,
// }
// let afile ={
// afile:res.tempFilePaths[0]
// }
// let _action = encryptDes(JSON.stringify(str),'6780f04cf2e211ec86a8005056c00008');
// let afile1 = encryptDes(JSON.stringify(afile),'6780f04cf2e211ec86a8005056c00008');
// defaultRequest5(str,url).then(res =>{
// console.log(res)
// })
uni.uploadFile({
url:'https://lilbeattranapismits.dopeplus.com/mapi/api_v2011.php?appcode=DOPE+',
filePath: tempFilePaths[0],
name: 'afile',
formData:{
'data':data
},
success: (uploadFileRes) => {
console.log(uploadFileRes);
let data=decryptDes(uploadFileRes.data,'6780f04cf2e211ec86a8005056c00008');
console.log(JSON.parse(data));
let lists = JSON.parse(data)
that.imglist.push({
id:lists.data.attachment_id,
url:lists.data.attachment_url
})
that.imgSrc = lists.data.attachment_url
// this.imglist = this.imglist.push(lists.data)
console.log(that.imglist )
that.ids.push(lists.data.attachment_id)
console.log(that.ids)
}
});
}
});
console.log(this.imglist)
},
//删除图片和视频
deleteImg(Id,e){
let id = Id
console.log(id)
for(let i =0;i < this.imglist.length ; i++){
if(this.imglist[i].id == id){
this.imglist.splice(i,1)
}
}
for(let i =0;i < this.ids.length ; i++){
if(this.ids[i] == id){
this.ids.splice(i,1)
}
}
if(e==1){
this.VideoSrc = ''
this.VideoId = ''
}
console.log(this.ids)
console.log(this.imglist)
console.log(this.VideoSrc)
}
},
onLoad(e) {
let datas=JSON.parse(e.data)
console.log(datas)
this.query.order_id = datas.order_id
this.query.order_sn = datas.order_sn
this.query.goods_id = datas.order_goods[0].goods_id
this.query.rec_id = datas.order_goods[0].grec_id
this.orderDate=datas
if(datas.order_goods.length>1){
this.reviewType=1
this.query1.order_id=datas.order_id
this.query1.order_sn=datas.order_sn
datas.order_goods.map(item=>{
let data={
rec_id:item.rec_id,
goods_id:item.goods_id,
comment:'',
comment_rank:'',
commentlabels:item.goods_attr.replace(/\s\n/g,' ')
}
this.query1.comments.push(data)
})
}else{
this.query.order_id=datas.order_id
this.query.order_sn=datas.order_sn
this.query.rec_id=datas.order_goods[0].rec_id
this.query.goods_id=datas.order_goods[0].goods_id
this.commentlabels=datas.order_goods[0].goods_attr.replace(/\s\n/g,' ')
}
},
filters:{
goodsAttr(e){
return e.replace(/\s\n/g,';');
}
}
}
</script>
<style lang="scss" scoped>
.review{
padding: 0 26rpx;
padding-top: 35.33rpx;
.review_title{
display: flex;
align-items: center;
font-weight: bold;
font-size: 32rpx;
margin-bottom: 44rpx;
.rate{
margin-left: 24.67rpx;
}
}
.review_content{
display: flex;
image{
width: 29.33rpx;
height: 29.33rpx;
}
textarea{
font-size: 28rpx;
font-weight: 400;
width: 100%;
height: 113.33rpx;
margin-left: 4rpx;
}
}
.reason_upload{
display: flex;
flex-wrap: wrap;
margin-bottom: 34.67rpx;
.reason_upload_item{
border: 1px dashed #D2D2D2;
background-size: 100%;
border-radius: 15rpx;
width: 156rpx;
height: 156rpx;
margin-top:5rpx;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-size: 12rpx;
color: #BFBCBC;
margin-right: 23.33rpx;
margin-left: 6rpx;
image{
height: 100%;
width: 100%;
}
&:nth-child(3n+3){
margin-right: 0;
}
.upload_item_camera{
width: 72rpx;
height: 54.67rpx;
margin-bottom: 14rpx;
}
.upload_item_camera1{
width: 72rpx;
height: 72rpx;
// margin-bottom: 14rpx;
}
.upload_item_camera2{
width: 156rpx;
height: 156rpx;
}
.upload_item_image{
// background-color: aqua;
width: 100%;
height: 100%;
border-radius: 15rpx;
}
}
.reason_upload_item1{
position: relative;
&::after{
content: "";
width: 30.67rpx;
height: 30.67rpx;
position: absolute;
margin-left: 65rpx;
top: -12rpx;
z-index: 999;
background-image: url("@/static/img/close3.png");
background-size: 100% 100%;
}
}
.margin_left{
margin-left: 30rpx;
}
}
.reason_upload_tips{
font-size: 20rpx;
color: #666666;
}
.reason_upload_tipV{
font-size: 24rpx;
color: #8c0000;
}
}
.uni-navbar{
font-size: 32rpx;
font-weight: bold;
}
.nav_right{
button{
width: 116.67rpx;
height: 48rpx;
background-color: black;
margin: 0;
line-height: 48rpx;
border-radius: 24rpx;
font-size: 24rpx;
font-weight: bold;
color: white;
padding-left: 0;
padding-right: 0;
}
}
.body{
border-top: 14.67rpx #F6F5FA solid;
}
.order_popup_commodity{
padding: 0 33.33rpx;
border-bottom: 14.67rpx #F6F5FA solid;
}
</style>