1

pagesMy/order/noService.vue

@@ -2,32 +2,37 @@
 	<mobile-frame>
 		<view class="main">
 			<view class="one">
-				<view class="list" v-for="(item,index) in goodsList" :key="index">
+				<view class="list" v-if="info._id">
 					<view class="list_1">
 						<text>退款商品</text>
 					</view>
 					<view class="list_2">
 						<view class="l">
-							<image class="image" :src="item.goods.file&&item.goods.file.length>0?item.goods.file[0].url:''" mode="">
+							<image class="image" :src="info.goods.file&&info.goods.file.length>0?info.goods.file[0].url:''" mode="">
 							</image>
 						</view>
 						<view class="c">
 							<view class="name">
-								{{item.goods.name}}
+								{{info.goods.name}}
 							</view>
 							<view class="specs">
-								{{item.name}}
+								{{info.name}}
 							</view>
 						</view>
 						<view class="r">
 							<view v-if="type=='0'" class="price">
-								¥{{item.sell_money}}
+								¥{{info.sell_money}}
 							</view>
 							<view v-else class="price">
-								¥{{item.group_config.money}}
+								¥{{info.group_config.money}}
 							</view>
 							<view class="num">
-								×{{item.buy_num}}
+								×{{info.buy_num}}
+							</view>
+							<view class="money" v-if="moneyInfo.payTotal">
+								<view class="">商品总价:{{moneyInfo.goodsTotal}}</view>
+								<view class="">优惠减免:{{moneyInfo.discountTotal}}</view>
+								<view class="">运费总价:{{moneyInfo.freightTotal}}</view>
 							</view>
 						</view>
 					</view>
@@ -35,11 +40,35 @@
 			</view>
 			<view class="two">
 				<uni-forms ref="form" :rules="rules" :model="form" label-width="auto">
-					<uni-forms-item label="申请售后理由" name="desc">
+					<uni-forms-item label="退款商品" name="goods_id">
+						<picker class="picker" mode="selector" :range="goodsList" @change="goodsChange" range-key="name">
+							<view>{{form.goods_name||'请选择退款商品'}}</view>
+						</picker>
+					</uni-forms-item>
+					<uni-forms-item label="售后类型" name="type" v-if="info._id">
+						<picker class="picker" mode="selector" :range="typeList" @change="typeChange" range-key="label">
+							<view>{{form.type_name||'请选择售后类型'}}</view>
+						</picker>
+					</uni-forms-item>
+					<uni-forms-item label="退款金额" name="money" v-if="form.type=='0'||form.type=='1'">
+						<uni-easyinput type="digit" v-model="form.money" @input="toMoney" placeholder="请输入退款金额" />
+						<view>
+							最大退款金额不能超过{{moneyInfo.payTotal||'暂无'}}
+						</view>
+					</uni-forms-item>
+					<uni-forms-item label="申请理由" name="reason">
+						<picker class="picker" mode="selector" :range="reasonList" @change="reasonChange" range-key="label">
+							<view>{{form.reason_name||'请选择申请理由'}}</view>
+						</picker>
+					</uni-forms-item>
+					<uni-forms-item label="申请售后描述" name="desc">
 						<uni-easyinput type="textarea" v-model="form.desc" placeholder="请输入申请售后描述" />
 					</uni-forms-item>
+					<uni-forms-item label="附件" name="icon">
+						<upload :list="icon" name="icon" :count="1" @uplSuc="uplSuc" @uplDel="uplDel"></upload>
+					</uni-forms-item>
 					<view class="btn">
-						<button type="primary" size="mini" @click="onSubmit('form')">提交保存</button>
+						<button v-if="money_num=='0'" type="primary" size="mini" @click="onSubmit('form')">提交保存</button>
 					</view>
 				</uni-forms>
 			</view>
@@ -48,31 +77,58 @@
 </template>
 
 <script>
+	import upload from '@/components/upload/index.vue';
 	export default {
+		components: {
+			upload
+		},
 		data() {
 			return {
 				id: '',
+				// 订单类型
+				type: '',
 				user: {},
+				// 商品详情
+				info: {},
 				form: {},
-				type: '',
+				moneyInfo: {},
 				// 退货商品
 				goodsList: [],
 				icon: [],
 				rules: {
-					desc: {
+					type: {
+						rules: [{
+							required: true,
+							errorMessage: '请选择售后类型',
+						}]
+					},
+					goods_id: {
 						rules: [{
 							required: true,
-							errorMessage: '请输入申请售后描述',
+							errorMessage: '请选择退款商品',
+						}]
+					},
+					reason: {
+						rules: [{
+							required: true,
+							errorMessage: '请选择申请理由',
 						}]
 					},
 				},
+				// 售后类型
+				typeList: [],
+				// 申请理由
+				reasonList: [],
+				money_num: '0'
 			};
 		},
 		onLoad: async function(e) {
 			const that = this;
 			that.$set(that, `id`, e && e.id || '');
+			// 查询其他信息
+			await that.searchOther();
 			// 监听用户登录
-			that.watchLogin();
+			await that.watchLogin();
 		},
 		methods: {
 			// 监听用户是否登录
@@ -100,29 +156,142 @@
 					}
 				})
 			},
-			// 提交保存
-			async onSubmit(ref) {
+			// 查询其他信息
+			async searchOther() {
 				const that = this;
-				that.$refs[ref].validate().then(async params => {
-					params.order_detail = that.id
-					const arr = await that.$api(`/afterSale/orderCancel`, 'POST', params);
+				let res;
+				res = await that.$api(`/dictData`, 'GET', {
+					code: "afterSale_type"
+				});
+				if (res.errcode == '0') {
+					that.$set(that, `typeList`, res.data)
+				}
+				res = await that.$api(`/dictData`, 'GET', {
+					code: "afterSale_reason"
+				});
+				if (res.errcode == '0') {
+					that.$set(that, `reasonList`, res.data)
+				}
+			},
+			// 退款金额
+			toMoney(value) {
+				const that = this;
+				let money = that.moneyInfo.payTotal;
+				if (parseFloat(value) > parseFloat(money)) {
+					uni.showToast({
+						title: '输入金额不能超过实际支付金额',
+						icon: 'none'
+					})
+					that.$set(that, `money_num`, '1');
+				} else {
+					that.$set(that, `money_num`, '0');
+				}
+			},
+			// 选择售后类型
+			async typeChange(e) {
+				const that = this;
+				let data = that.typeList[e.detail.value];
+				if (data) {
+					that.$set(that.form, `type`, data.value);
+					that.$set(that.form, `type_name`, data.label);
+				}
+				if (data.value != '2') {
+					const arr = await that.$api(`/afterSale/cgfr`, 'POST', {
+						order_detail: that.id,
+						goods_id: that.info._id
+					});
 					if (arr.errcode == '0') {
-						uni.showToast({
-							title: `申请售后成功`,
-							icon: 'success',
-						});
-						uni.navigateBack({
-							detail: 1
-						})
+						that.$set(that, `moneyInfo`, arr.data);
 					} else {
 						uni.showToast({
 							title: arr.errmsg,
 							icon: 'none',
 						})
 					}
+				}
+
+			},
+			// 退款商品
+			goodsChange(e) {
+				const that = this;
+				let data = that.goodsList[e.detail.value];
+				if (data) {
+					that.$set(that, `info`, data);
+					that.$set(that.form, `goods_id`, data._id);
+					that.$set(that.form, `goods_name`, data.name);
+				}
+			},
+			// 选择申请理由
+			reasonChange(e) {
+				const that = this;
+				let data = that.reasonList[e.detail.value];
+				if (data) {
+					that.$set(that.form, `reason`, data.value);
+					that.$set(that.form, `reason_name`, data.label);
+				}
+			},
+			// 图片上传
+			uplSuc(e) {
+				const that = this;
+				that.$set(that, `${e.name}`, [...that[e.name], e.data]);
+			},
+			// 图片删除
+			uplDel(e) {
+				const that = this;
+				let data = that[e.name];
+				let arr = data.filter((i, index) => index != e.data.index);
+				that.$set(that, `${e.name}`, arr)
+			},
+			// 提交保存
+			async onSubmit(ref) {
+				const that = this;
+				that.$refs[ref].validate().then(async params => {
+					if (params.type != '2') {
+						if (params.money) {
+							params.file = that.icon;
+							params.order_detail = that.id;
+							const arr = await that.$api(`/afterSale`, 'POST', params);
+							if (arr.errcode == '0') {
+								uni.showToast({
+									title: `申请售后成功`,
+									icon: 'success',
+								});
+								uni.navigateBack({
+									detail: 1
+								})
+							} else {
+								uni.showToast({
+									title: arr.errmsg,
+									icon: 'none',
+								})
+							}
+						} else {
+							uni.showToast({
+								title: `请输入退款金额`,
+								icon: 'none',
+							});
+						}
+					} else {
+						params.file = that.icon;
+						params.order_detail = that.id;
+						const arr = await that.$api(`/afterSale`, 'POST', params);
+						if (arr.errcode == '0') {
+							uni.showToast({
+								title: `申请售后成功`,
+								icon: 'success',
+							});
+							uni.navigateBack({
+								detail: 1
+							})
+						} else {
+							uni.showToast({
+								title: arr.errmsg,
+								icon: 'none',
+							})
+						}
+					}
 				})
 			}
-
 		}
 	}
 </script>
@@ -173,6 +342,11 @@
 					.r {
 						width: 25vw;
 						text-align: right;
+
+						.money {
+							color: var(--f85Color);
+							font-size: var(--font12Size);
+						}
 					}
 				}
 
@@ -202,6 +376,12 @@
 		.two {
 			padding: 2vw;
 
+			.picker {
+				border: 1px solid #3333;
+				border-radius: 5px;
+				padding: 2vw;
+			}
+
 			.btn {
 				text-align: center;