增加基本项目配置
This commit is contained in:
Gao xiaosong
206
pages/shop/GoodsEvaluate/index.vue
Normal file
206
pages/shop/GoodsEvaluate/index.vue
Normal file
@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<div class="evaluate-con">
|
||||
<div class="goodsStyle acea-row row-between" v-if="orderCon.productInfo">
|
||||
<div class="pictrue">
|
||||
<img :src="orderCon.productInfo.image" class="image" />
|
||||
</div>
|
||||
<div class="text acea-row row-between">
|
||||
<div class="name line2">{{ orderCon.productInfo.storeName }}</div>
|
||||
<div class="money">
|
||||
<div>￥{{ orderCon.productInfo.price }}</div>
|
||||
<div class="num">x{{ orderCon.cartNum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="score">
|
||||
<div
|
||||
class="item acea-row row-middle"
|
||||
v-for="(item, scoreListIndexw) in scoreList"
|
||||
:key="scoreListIndexw"
|
||||
>
|
||||
<div>{{ item.name }}</div>
|
||||
<div class="starsList">
|
||||
<span
|
||||
@click="stars(starsIndexn, scoreListIndexw)"
|
||||
v-for="(itemn, starsIndexn) in item.stars"
|
||||
:key="starsIndexn"
|
||||
class="iconfont"
|
||||
:class="
|
||||
item.index >= starsIndexn
|
||||
? 'icon-shitixing font-color-red'
|
||||
: 'icon-kongxinxing'
|
||||
"
|
||||
></span>
|
||||
</div>
|
||||
<span class="evaluate">
|
||||
{{
|
||||
item.index === -1 ? "" : item.index + 1 + "分"
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="textarea">
|
||||
<textarea placeholder="商品满足你的期待么？说说你的想法，分享给想买的他们吧~" v-model="expect"></textarea>
|
||||
<div class="list acea-row row-middle">
|
||||
<div
|
||||
class="pictrue"
|
||||
v-for="(item, uploadPicturesIndex) in uploadPictures"
|
||||
:key="uploadPicturesIndex"
|
||||
>
|
||||
<img :src="item" />
|
||||
<span
|
||||
class="iconfont icon-guanbi1 font-color-red"
|
||||
@click="uploadPictures.splice(uploadPicturesIndex, 1)"
|
||||
></span>
|
||||
</div>
|
||||
<!-- <VueCoreImageUpload
|
||||
class="btn btn-primary"
|
||||
:crop="false"
|
||||
compress="80"
|
||||
@imageuploaded="imageuploaded"
|
||||
:headers="headers"
|
||||
:max-file-size="5242880"
|
||||
:credentials="false"
|
||||
inputAccept="image/*"
|
||||
inputOfFile="file"
|
||||
:url="url"
|
||||
v-if="uploadPictures.length < 8"
|
||||
>
|
||||
<div
|
||||
class="pictrue uploadBnt acea-row row-center-wrapper row-column"
|
||||
>
|
||||
<span class="iconfont icon-icon25201"></span>
|
||||
<div>上传图片</div>
|
||||
</div>
|
||||
</VueCoreImageUpload>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="evaluateBnt bg-color-red" @click="submit">立即评价</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import { postOrderProduct, postOrderComment } from "@/api/store";
|
||||
import { trim } from "@/utils";
|
||||
import { VUE_APP_API_URL } from "@/config";
|
||||
import { required } from "@/utils/validate";
|
||||
import { validatorDefaultCatch } from "@/utils/dialog";
|
||||
|
||||
const NAME = "GoodsEvaluate";
|
||||
|
||||
export default {
|
||||
name: NAME,
|
||||
components: {
|
||||
// VueCoreImageUpload
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
orderCon: {
|
||||
cartProduct: {
|
||||
productInfo: {}
|
||||
}
|
||||
},
|
||||
scoreList: [
|
||||
{
|
||||
name: "商品质量",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
},
|
||||
{
|
||||
name: "服务态度",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
}
|
||||
],
|
||||
url: `${VUE_APP_API_URL}/api/qiNiuContent`,
|
||||
headers: {
|
||||
Authorization: "Bearer " + this.$store.state.token
|
||||
},
|
||||
uploadPictures: [],
|
||||
expect: "",
|
||||
unique: ""
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.unique = this.$yroute.query.id;
|
||||
this.getOrderProduct();
|
||||
},
|
||||
watch: {
|
||||
$yroute(n) {
|
||||
if (n.name === NAME && this.unique !== n.params.id) {
|
||||
this.unique = n.params.id;
|
||||
this.$set(this.scoreList[0], "index", -1);
|
||||
this.$set(this.scoreList[1], "index", -1);
|
||||
this.expect = "";
|
||||
this.uploadPictures = [];
|
||||
this.getOrderProduct();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getOrderProduct: function() {
|
||||
let that = this,
|
||||
unique = that.unique;
|
||||
postOrderProduct(unique).then(res => {
|
||||
that.orderCon = res.data;
|
||||
});
|
||||
},
|
||||
stars: function(indexn, indexw) {
|
||||
this.scoreList[indexw].index = indexn;
|
||||
},
|
||||
imageuploaded(res) {
|
||||
if (res.errno !== 0) return this.$dialog.error(res.msg || "上传图片失败");
|
||||
this.uploadPictures.push(res.data[0]);
|
||||
},
|
||||
async submit() {
|
||||
const expect = trim(this.expect),
|
||||
product_score =
|
||||
this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1,
|
||||
service_score =
|
||||
this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1;
|
||||
try {
|
||||
await this.$validator({
|
||||
product_score: [
|
||||
required("请选择商品质量分数", {
|
||||
type: "number"
|
||||
})
|
||||
],
|
||||
service_score: [
|
||||
required("请选择服务态度分数", {
|
||||
type: "number"
|
||||
})
|
||||
]
|
||||
}).validate({ product_score, service_score });
|
||||
} catch (e) {
|
||||
return validatorDefaultCatch(e);
|
||||
}
|
||||
postOrderComment({
|
||||
productScore: product_score,
|
||||
serviceScore: service_score,
|
||||
unique: this.unique,
|
||||
pics: this.uploadPictures.join(","),
|
||||
comment: expect
|
||||
})
|
||||
.then(() => {
|
||||
wx.showToast({
|
||||
title: "评价成功",
|
||||
icon: "success",
|
||||
duration: 2000
|
||||
});
|
||||
this.$yrouter.push({
|
||||
path: "/pages/order/OrderDetails/main",
|
||||
query: { id: this.orderCon.orderId }
|
||||
});
|
||||
})
|
||||
.catch(res => {
|
||||
this.$dialog.error(res.msg);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
5
pages/shop/GoodsEvaluate/main.js
Normal file
5
pages/shop/GoodsEvaluate/main.js
Normal file
@ -0,0 +1,5 @@
|
||||
import Vue from 'vue'
|
||||
import App from './index'
|
||||
|
||||
const app = new Vue(App)
|
||||
app.$mount()
|
||||
Reference in New Issue
Block a user